diff --git a/web/package-lock.json b/web/package-lock.json
index 81d933fbc..92fc03894 100644
Binary files a/web/package-lock.json and b/web/package-lock.json differ
diff --git a/web/package.json b/web/package.json
index 37cb771f6..274bbc954 100644
--- a/web/package.json
+++ b/web/package.json
@@ -3,28 +3,28 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@testing-library/jest-dom": "^5.16.3",
-    "@testing-library/react": "^12.1.4",
-    "@testing-library/user-event": "^13.5.0",
+    "@testing-library/jest-dom": "^5.16.4",
+    "@testing-library/react": "^13.1.1",
+    "@testing-library/user-event": "^14.1.1",
     "@types/jest": "^27.4.1",
-    "@types/node": "^17.0.23",
+    "@types/node": "^17.0.25",
     "@types/react": "^17.0.43",
-    "@types/react-dom": "^17.0.14",
+    "@types/react-dom": "^18.0.1",
     "@types/react-router-dom": "^5.3.3",
-    "antd": "^4.19.4",
-    "babel-plugin-import": "^1.13.3",
+    "antd": "^4.19.5",
+    "babel-plugin-import": "^1.13.5",
     "customize-cra": "^1.0.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-prettier": "^4.0.0",
-    "http-proxy-middleware": "^2.0.4",
+    "http-proxy-middleware": "^2.0.6",
     "less": "^4.1.2",
     "less-loader": "^7.3.0",
-    "prettier": "^2.6.1",
-    "react": "^17.0.2",
+    "prettier": "^2.6.2",
+    "react": "^18.0.0",
     "react-app-rewired": "^2.2.1",
-    "react-dom": "^17.0.2",
+    "react-dom": "^18.0.0",
     "react-router-dom": "^5.3.0",
-    "react-scripts": "^5.0.0",
+    "react-scripts": "^5.0.1",
     "slugify": "^1.6.5",
     "typescript": "^4.6.3",
     "web-vitals": "^2.1.4"
diff --git a/web/src/index.tsx b/web/src/index.tsx
index dcc257fe2..079f7c698 100644
--- a/web/src/index.tsx
+++ b/web/src/index.tsx
@@ -1,14 +1,16 @@
 import React from "react";
-import ReactDOM from "react-dom";
-import { App } from "./App";
+import ReactDOM from "react-dom/client";
 import "./index.css";
+import { App } from "./App";
 import reportWebVitals from "./reportWebVitals";
 
-ReactDOM.render(
+const root = ReactDOM.createRoot(
+  document.getElementById("root") as HTMLElement
+);
+root.render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>,
-  document.getElementById("root")
+  </React.StrictMode>
 );
 
 // If you want to start measuring performance in your app, pass a function