Lib upgrade oct24 (#13)

* alias imports fix

* fix build issues of express-server

* express app upgrade pkgs

* upgrade nestjs server

* upgrade nextjs dependencies except MUI

* update express-server readme

* upgrade to mui v6 in next-client

* update next-client mui

* upgrade react dependencies

* upgrade web-vitals, fix test cases failing to run

Author: nishkohli96

README.md

@@ -2,15 +2,16 @@
 
 **The ideal repository for full-stack web development with ReactJS, NextJS as the frontend and ExpressJS, NestJS-fastify server as the backend**
 
+You can clone the full repo and keep only the packages you need in your monorepo, or just retain the source code of a single app, say [express-server](./apps/express-server/) to get started. I'll try my level best to keep all the dependencies in these repos upto date, while also adhering to the industry best practices.  
+
 ## Features
 
 - [Turborepo](https://turborepo.org/)
 - [React](https://reactjs.org/), [NestJs](https://nestjs.com/), [ExpressJS](https://expressjs.com/), [NestJS](https://nestjs.com/)
 - 100% [Typescript](https://www.typescriptlang.org/)
-- [Prettier](https://prettier.io/) and Eslint setup alongside `pre-commit` hook.
-- [Mui](https://mui.com/) and [Redux](https://redux.js.org/) preconfigured.
+- [Prettier](https://prettier.io/) and [Eslint](https://eslint.org/) setup alongside `pre-commit` hook.
+- [Mui v6](https://mui.com/) alongside theme change preconfigured.
 - [Dockerize](https://docs.docker.com/) images
-- Easy to customise
 - Github Actions to build apps and publish their docker images
 
 ## Get Started

apps/express-server/README.md

@@ -4,16 +4,19 @@ Express JS Application with Typescript
 
 ## Running the app
 
+In dev mode,
 ```bash
-# development
-$ yarn dev
+yarn dev
+```
 
-# build & run production code
-$ yarn prod
+Build the app and run production code
+```bash
+yarn prod
 ```
 
 ### Features
 
 - Express app configured
-- Preconfigured logger - [winston](https://www.npmjs.com/package/winston) for logging request and errors 
-- Producion Dockerfile
+- Handled loading of environment variables
+- Styled logging using [chalk](https://www.npmjs.com/package/chalk)
+- Preconfigured logger middleware - [winston](https://www.npmjs.com/package/winston) for logging request details and errors 

apps/express-server/nodemon.json

@@ -0,0 +1,5 @@
+{
+  "watch": ["src/"],
+  "ext": "js,ts,json,yml,yaml",
+  "ignore": ["*.test.{js,ts}", "node_modules/"]
+}

apps/express-server/package.json

@@ -4,27 +4,27 @@
   "author": "Nishant Kohli",
   "private": true,
   "scripts": {
-    "dev": "nodemon src/index.ts",
-    "build": "rimraf dist && tsc",
-    "start": "ts-node dist/index.js",
+    "dev": "nodemon --exec 'ts-node -r tsconfig-paths/register src/index.ts'",
+    "build": "rimraf dist && tsc && tsc-alias",
+    "start": "node dist/index.js",
     "prod": "yarn build && yarn start",
     "lint": "eslint --fix ."
   },
   "dependencies": {
     "cors": "^2.8.5",
     "dotenv": "^16.4.5",
-    "express": "^4.19.2",
-    "winston": "3.13.0"
+    "express": "^4.21.0",
+    "winston": "3.15.0"
   },
   "devDependencies": {
+    "@nish1896/eslint-config": "^2.0.5",
     "@types/cors": "^2.8.17",
-    "@types/express": "^4.17.21",
-    "@types/node": "^20.14.9",
+    "@types/node": "^22.7.4",
     "eslint": "^8.57.0",
-    "nodemon": "^3.1.4",
-    "rimraf": "^5.0.7",
-    "ts-node": "^10.9.2",
+    "nodemon": "^3.1.7",
+    "rimraf": "^6.0.1",
+    "tsc-alias": "^1.8.10",
     "tsconfig-paths": "^4.2.0",
-    "typescript": "^5.3.3"
+    "typescript": "^5.6.2"
   }
 }

apps/express-server/src/app-constants/env_vars.ts

@@ -7,5 +7,5 @@ const env = process.env;
 
 export const ENV_VARS = Object.freeze({
   env: env.NODE_ENV ?? 'development',
-  port: env.PORT ?? 5000
+  port: env.PORT ?? 8000
 });

apps/express-server/src/app.ts

@@ -1,8 +1,8 @@
 import express, { Express, Request, Response } from 'express';
 import cors from 'cors';
-import { ENV_VARS } from 'app-constants';
-import { requestLogger } from 'middleware';
-import * as Routes from 'routes';
+import { ENV_VARS } from '@/app-constants';
+import { requestLogger } from '@/middleware';
+import * as Routes from '@/routes';
 
 const app: Express = express();
 

apps/express-server/src/index.ts

@@ -1,8 +1,24 @@
+/**
+ * In dev env ts-node will be using tsconfig-paths to
+ * resolve alias imports.
+ *
+ * However when generating the build and running it,
+ * tsc-alias will replace the alias imports with the
+ * actual import path relative to each file.
+ *
+ * Sadly "node -r tsconfig-paths/register dist/index.js" is
+ * not resolving the paths when running the build.
+ *
+ * "node -r ts-node/register/transpile-only -r tsconfig-paths/register dist/main.js"
+ * works but not recommended to be used in production because
+ * of the lack of type safety.
+ */
+
 import 'dotenv/config';
 import os from 'os';
 import { createServer } from 'node:http';
-import { ENV_VARS } from 'app-constants';
-import { winstonLogger } from 'middleware';
+import { ENV_VARS } from '@/app-constants';
+import { winstonLogger } from '@/middleware';
 import app from './app';
 
 const hostName = os.hostname();

apps/express-server/src/middleware/winston-logger.ts

@@ -1,5 +1,5 @@
 import { createLogger, addColors, format, transports } from 'winston';
-import { ENV_VARS } from 'app-constants';
+import { ENV_VARS } from '@/app-constants';
 
 const { combine, timestamp, printf } = format;
 

apps/express-server/tsconfig.json

@@ -1,17 +1,22 @@
 {
-  "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "baseUrl": "src",
-    "rootDir": "src",
-    "module": "commonjs",
-    "resolveJsonModule": false,
-    "outDir": "dist",
+    "baseUrl": "./",
+    "outDir": "dist", 
+    "rootDir": "src", 
+    "paths": {
+      "@/*": ["src/*"]
+    },
     "esModuleInterop": true,
-    "incremental": false
+    "moduleResolution": "node"
   },
-  "ts-node": {
-    "require": ["tsconfig-paths/register"]
-  },
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*", "dist"]
+  "include": ["src/**/*.ts"],
+  "exclude": ["node_modules", "dist"],
+	"tsc-alias": {
+    "verbose": false,
+    "resolveFullPaths": true,
+    "fileExtensions": {
+      "inputGlob": "{js,mjs,ts}",
+      "outputCheck": ["js", "ts", "json", "jsx", "mjs"]
+    }
+	}
 }

apps/nestjs-server/README.md

@@ -2,6 +2,11 @@
   <a href="http://nestjs.com/" target="blank"><img src="https://nestjs.com/img/logo-small.svg" width="200" alt="Nest Logo" /></a>
 </p>
 
+
+### Features
+- Routes directory
+- Code snippet to switch to `platform-express` or `platform-fastify` (remove the unused platform from package.json)
+
 ## Running the app
 
 ```bash
@@ -24,8 +29,3 @@ $ yarn run test:e2e
 # test coverage
 $ yarn run test:cov
 ```
-
-### Features
-
-- Routes directory
-- Dockerfile