Initial commit

neberej · Feb 15, 2024 · 252f47c · 252f47c
commit 252f47c
Show file tree

Hide file tree

Showing 12 changed files with 3,165 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+.DS_Store
+dist
diff --git a/README.md b/README.md
@@ -0,0 +1 @@
+# 
diff --git a/nodemon.json b/nodemon.json
@@ -0,0 +1,6 @@
+{
+  "watch": ["server"],
+  "ext": "ts,json",
+  "ignore": ["src/**/"],
+  "exec": "ts-node ./server/server.ts" 
+}
diff --git a/package.json b/package.json
@@ -0,0 +1,40 @@
+{
+  "name": "ypescript-seed",
+  "version": "1.0.0",
+  "description": "Seed project for Node.js, Typescript and React",
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "scripts": {
+    "dev": "webpack serve",
+    "build": "webpack",
+    "server": "nodemon"
+  },
+  "dependencies": {
+    "@types/react-router-dom": "^5.3.3",
+    "dotenv": "^16.4.4",
+    "express": "^4.18.2",
+    "react-dom": "^18.2.0",
+    "react-router-dom": "^6.22.0"
+  },
+  "devDependencies": {
+    "@types/copy-webpack-plugin": "^10.1.0",
+    "@types/cors": "^2.8.17",
+    "@types/express": "^4.17.21",
+    "@types/node": "^20.11.18",
+    "@types/react": "^18.2.55",
+    "@types/react-dom": "^18.2.19",
+    "copy-webpack-plugin": "^12.0.2",
+    "css-loader": "^6.10.0",
+    "nodemon": "^3.0.3",
+    "style-loader": "^3.3.4",
+    "terser-webpack-plugin": "^5.3.10",
+    "ts-loader": "^9.5.1",
+    "ts-node": "^10.9.2",
+    "ts-node-dev": "^2.0.0",
+    "typescript": "^5.3.3",
+    "webpack": "^5.90.1",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^5.0.1"
+  }
+}
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Document</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="bundle.js"></script>
+  </body>
+  <html></html>
+</html>
diff --git a/server/server.ts b/server/server.ts
@@ -0,0 +1,17 @@
+
+import express, { Express, Request, Response , Application } from 'express';
+import dotenv from 'dotenv';
+
+//For env File 
+dotenv.config();
+
+const app: Application = express();
+const port = process.env.PORT || 8000;
+
+app.get('/', (req: Request, res: Response) => {
+  res.send('Welcome!');
+});
+
+app.listen(port, () => {
+  console.log(`Server is running at http://localhost:${port}`);
+})
diff --git a/src/App.css b/src/App.css
diff --git a/src/App.tsx b/src/App.tsx
@@ -0,0 +1,10 @@
+
+import './App.css';
+
+export default function App() {
+  return (
+    <main>
+      <p>App is running!</p>
+    </main>
+  );
+}
diff --git a/src/index.tsx b/src/index.tsx
@@ -0,0 +1,14 @@
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import App from "./App";
+
+const rootElement = document.getElementById("root");
+
+// New as of React v18.x
+const root = createRoot(rootElement!);
+
+root.render(
+  <StrictMode>
+    <App />
+  </StrictMode>
+);
diff --git a/tsconfig.json b/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx" /* IMPORTANT! - this allows our JSX to be transpiled correctly */,
+    "target": "es6" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
+    "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
+    "allowSyntheticDefaultImports": true /* Need for Webpack config file */,
+    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
+    "strict": true /* Enable all strict type-checking options. */,
+    "skipLibCheck": true /* Skip type checking all .d.ts files. */,
+    "outDir": "dist",
+    "moduleResolution": "node"
+  },
+  "include": ["**/*.ts", "**/*.tsx"]
+}
diff --git a/webpack.config.ts b/webpack.config.ts
@@ -0,0 +1,43 @@
+import path from "path";
+import { Configuration } from "webpack";
+import CopyWebpackPlugin from "copy-webpack-plugin";
+import TerserPlugin from 'terser-webpack-plugin';
+
+const config: Configuration = {
+  mode:
+    (process.env.NODE_ENV as "production" | "development" | undefined) ??
+    "development",
+  entry: "./src/index.tsx",
+  module: {
+    rules: [
+      {
+        test: /.tsx?$/,
+        use: "ts-loader",
+        exclude: /node_modules/,
+      },
+      {
+        test: /\.css$/,
+        use: ["style-loader", "css-loader"],
+      },
+    ],
+  },
+  optimization: {
+    minimizer: [new TerserPlugin({
+      extractComments: false,
+    })],
+  },
+  resolve: {
+    extensions: [".tsx", ".ts", ".js"],
+  },
+  output: {
+    filename: "bundle.js",
+    path: path.resolve(__dirname, "dist"),
+  },
+  plugins: [
+    new CopyWebpackPlugin({
+      patterns: [{ from: "public" }],
+    }),
+  ],
+};
+
+export default config;