Feature/#162 upgrade deps versions

back/docker-compose.yml

@@ -1,7 +1,12 @@
-version: '3'
+version: '3.8'
 services:
   mongodb-codepaster:
     container_name: mongodb-codepaster
-    image: mongo:4.2.10
+    image: mongo:6
     ports:
-      - '27017:27017'
+      - '27017:27017'
+    networks:
+      - codepaster
+
+networks:
+  codepaster:

back/package.json

@@ -9,7 +9,7 @@
     "start:dev": "nodemon --exec babel-node --extensions \".ts\" src/index.ts",
     "start:debug": "run-p -l type-check:watch \"start:dev -- --inspect-brk\"",
     "start:prod": "node ./dist/index.js",
-    "start:local-db": "docker-compose up || echo \"Run docker-compose up manually\"",
+    "start:local-db": "docker-compose up -d || echo \"Run docker-compose up manually\"",
     "stop:local-db": "docker-compose down || echo \"Run docker-compose down manually\"",
     "build": "run-p -l type-check build:prod",
     "build:prod": "npm run clean && babel src -d dist --ignore=\"./src/test-runners\" --extensions \".ts\"",
@@ -32,34 +32,32 @@
   },
   "homepage": "https://github.com/Lemoncode/scaffolding-express-typescript#readme",
   "devDependencies": {
-    "@babel/cli": "^7.10.5",
-    "@babel/core": "^7.11.1",
-    "@babel/node": "^7.10.5",
-    "@babel/plugin-proposal-optional-chaining": "^7.11.0",
-    "@babel/preset-env": "^7.11.0",
-    "@babel/preset-typescript": "^7.10.4",
-    "@types/cors": "^2.8.7",
-    "@types/express": "^4.17.7",
-    "@types/jest": "^26.0.15",
-    "@types/mongoose": "^5.7.37",
+    "@babel/cli": "^7.20.7",
+    "@babel/core": "^7.20.12",
+    "@babel/node": "^7.20.7",
+    "@babel/plugin-proposal-optional-chaining": "^7.20.7",
+    "@babel/preset-env": "^7.20.2",
+    "@babel/preset-typescript": "^7.18.6",
+    "@types/cors": "^2.8.13",
+    "@types/express": "^4.17.17",
+    "@types/jest": "^29.4.0",
     "@types/socket.io": "^2.1.10",
-    "babel-plugin-module-resolver": "^4.0.0",
-    "cross-env": "^7.0.2",
-    "jest": "^26.6.1",
-    "nodemon": "^2.0.4",
+    "babel-plugin-module-resolver": "^5.0.0",
+    "cross-env": "^7.0.3",
+    "jest": "^29.4.2",
+    "nodemon": "^2.0.20",
     "npm-run-all": "^4.1.5",
-    "rimraf": "^3.0.2",
-    "ts-jest": "^26.4.2",
-    "typescript": "^3.9.7"
+    "rimraf": "^4.1.2",
+    "ts-jest": "^29.0.5",
+    "typescript": "^4.9.5"
   },
   "dependencies": {
-    "body-parser": "^1.19.0",
     "cors": "^2.8.5",
-    "dotenv": "^8.2.0",
-    "express": "^4.17.1",
-    "immer": "^7.0.9",
-    "mongoose": "^5.10.11",
-    "regenerator-runtime": "^0.13.7",
-    "socket.io": "^2.3.0"
+    "dotenv": "^16.0.3",
+    "express": "^4.18.2",
+    "immer": "^9.0.19",
+    "mongoose": "^6.9.1",
+    "regenerator-runtime": "^0.13.11",
+    "socket.io": "^2.5.0"
   }
 }

back/src/core/db/database.connection.ts

@@ -1,13 +1,8 @@
-import { connect } from 'mongoose';
+import mongoose, { connect } from 'mongoose';
+mongoose.set('strictQuery', false);
 
 export const connectToDB = async (connectionString: string) => {
-  const db = await connect(connectionString, {
-    poolSize: 5,
-    useNewUrlParser: true,
-    promiseLibrary: Promise,
-    useUnifiedTopology: true,
-    useFindAndModify: false,
-  });
+  const db = await connect(connectionString);
 
   console.log('Connected to DB');
 

back/src/core/servers/express.server.ts

@@ -1,13 +1,10 @@
 import express from 'express';
-import bodyParser from 'body-parser';
-import { corsOptions } from './cors'
-import { envConstants } from 'core/constants';
+import { corsOptions } from './cors';
 
 export const createApp = () => {
   const app = express();
 
-  app.use(bodyParser.urlencoded({ extended: false }));
-  app.use(bodyParser.json());
+  app.use(express.json());
   app.use(corsOptions);
 
   return app;

front/.babelrc

@@ -4,5 +4,5 @@
     "@babel/preset-typescript",
     "@babel/preset-react"
   ],
-  "plugins": ["react-hot-loader/babel", "emotion"]
+  "plugins": ["@emotion"]
 }

front/config/test/jest.js

@@ -2,6 +2,7 @@ module.exports = {
   rootDir: '../../',
   preset: 'ts-jest',
   restoreMocks: true,
+  testEnvironment: 'jsdom',
   moduleDirectories: ['<rootDir>/src', 'node_modules'],
   setupFilesAfterEnv: ['<rootDir>/config/test/setup.ts'],
   modulePathIgnorePatterns: ['cypress'],

front/config/test/setup.ts

@@ -1,2 +1 @@
 import '@testing-library/jest-dom';
-import '@testing-library/jest-dom/extend-expect';

front/config/webpack/base.js

@@ -1,5 +1,5 @@
 const HtmlWebpackPlugin = require('html-webpack-plugin');
-const merge = require('webpack-merge');
+const {merge} = require('webpack-merge');
 const helpers = require('./helpers');
 const CopyPlugin = require('copy-webpack-plugin');
 
@@ -22,31 +22,22 @@ module.exports = merge(
     entry: {
       app: ['regenerator-runtime/runtime', './index.tsx'],
     },
+    output: {
+      path: helpers.resolveFromRootPath('dist'),
+      publicPath: '/',
+    },
     module: {
       rules: [
-        {
-          test: /\.tsx?$/,
-          exclude: /node_modules/,
-          loader: 'babel-loader',
-        },
         {
           test: /\.svg$/,
           use: ['@svgr/webpack'],
         },
-      ],
-    },
-    optimization: {
-      runtimeChunk: 'single',
-      splitChunks: {
-        cacheGroups: {
-          vendor: {
-            chunks: 'all',
-            name: 'vendor',
-            test: /[\\/]node_modules[\\/]/,
-            enforce: true,
-          },
+        {
+          test: /\.(png|jpg|gif)$/,
+          exclude: /node_modules/,
+          type: 'asset/resource',
         },
-      },
+      ],
     },
     plugins: [
       new HtmlWebpackPlugin({

front/config/webpack/dev.js

@@ -1,46 +1,36 @@
-const merge = require('webpack-merge');
+const { merge } = require('webpack-merge');
 const Dotenv = require('dotenv-webpack');
+const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 const base = require('./base');
-const helpers = require('./helpers');
 
-const hotReloadingEntries = ['react-hot-loader/patch'];
-
-module.exports = merge.strategy({
-  entry: 'prepend',
-})(base, {
+module.exports = merge(base, {
   mode: 'development',
-  devtool: 'inline-source-map',
-  resolve: {
-    alias: {
-      'react-dom': '@hot-loader/react-dom',
-    },
-  },
-  entry: {
-    app: hotReloadingEntries,
-  },
+  devtool: 'eval-source-map',
   output: {
-    path: helpers.resolveFromRootPath('dist'),
     filename: '[name].js',
   },
   devServer: {
-    inline: true,
     host: 'localhost',
     port: 8080,
-    stats: 'minimal',
     hot: true,
+    historyApiFallback: true,
+    proxy: {
+      '/api': 'http://localhost:3001',
+    },
+    devMiddleware: {
+      stats: 'errors-warnings',
+    },
   },
-  plugins: [
-    new Dotenv({
-      path: 'dev.env',
-    }),
-  ],
   module: {
     rules: [
       {
-        test: /\.(png|jpg|gif|svg)$/,
-        loader: 'file-loader',
-        options: {
-          name: 'img/[name].[ext]',
+        test: /\.tsx?$/,
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            plugins: [require.resolve('react-refresh/babel')],
+          },
         },
       },
       {
@@ -49,4 +39,10 @@ module.exports = merge.strategy({
       },
     ],
   },
+  plugins: [
+    new ReactRefreshWebpackPlugin(),
+    new Dotenv({
+      path: 'dev.env',
+    }),
+  ],
 });

front/config/webpack/prod.js

@@ -1,23 +1,33 @@
-const merge = require('webpack-merge');
+const { merge } = require('webpack-merge');
 const Dotenv = require('dotenv-webpack');
 const base = require('./base');
-const helpers = require('./helpers');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 module.exports = merge(base, {
   mode: 'production',
   output: {
-    path: helpers.resolveFromRootPath('dist'),
-    filename: './js/[name].[chunkhash].js',
+    filename: 'js/[name].[chunkhash].js',
+    assetModuleFilename: 'images/[hash][ext][query]',
+  },
+  optimization: {
+    runtimeChunk: 'single',
+    splitChunks: {
+      cacheGroups: {
+        vendor: {
+          chunks: 'all',
+          name: 'vendor',
+          test: /[\\/]node_modules[\\/]/,
+          enforce: true,
+        },
+      },
+    },
   },
   module: {
     rules: [
       {
-        test: /\.(png|jpg|gif|svg)$/,
-        loader: 'file-loader',
-        options: {
-          name: './images/[name].[ext]?[hash]',
-        },
+        test: /\.tsx?$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader',
       },
       {
         test: /\.css$/,