facebook
diff --git a/‎package-lock.json
Copy file name to clipboardExpand all lines: package-lock.json
+67-5Lines changed: 67 additions & 5 deletions b/‎package-lock.json
Copy file name to clipboardExpand all lines: package-lock.json
+67-5Lines changed: 67 additions & 5 deletions
diff --git a/‎packages/cra-template-typescript/template.json
Copy file name to clipboardExpand all lines: packages/cra-template-typescript/template.json
+2-2Lines changed: 2 additions & 2 deletions b/‎packages/cra-template-typescript/template.json
Copy file name to clipboardExpand all lines: packages/cra-template-typescript/template.json
+2-2Lines changed: 2 additions & 2 deletions
diff --git a/‎packages/cra-template-typescript/template/src/index.tsx
Copy file name to clipboardExpand all lines: packages/cra-template-typescript/template/src/index.tsx
+6-4Lines changed: 6 additions & 4 deletions b/‎packages/cra-template-typescript/template/src/index.tsx
Copy file name to clipboardExpand all lines: packages/cra-template-typescript/template/src/index.tsx
+6-4Lines changed: 6 additions & 4 deletions
diff --git a/‎packages/cra-template/template/src/index.js
Copy file name to clipboardExpand all lines: packages/cra-template/template/src/index.js
+4-4Lines changed: 4 additions & 4 deletions b/‎packages/cra-template/template/src/index.js
Copy file name to clipboardExpand all lines: packages/cra-template/template/src/index.js
+4-4Lines changed: 4 additions & 4 deletions
diff --git a/‎packages/react-scripts/package.json
Copy file name to clipboardExpand all lines: packages/react-scripts/package.json
+2-2Lines changed: 2 additions & 2 deletions b/‎packages/react-scripts/package.json
Copy file name to clipboardExpand all lines: packages/react-scripts/package.json
+2-2Lines changed: 2 additions & 2 deletions
@@ -6,8 +6,8 @@
       "@testing-library/user-event": "^13.2.1",
       "@types/jest": "^27.0.1",
       "@types/node": "^16.7.13",
-      "@types/react": "^17.0.20",
-      "@types/react-dom": "^17.0.9",
+      "@types/react": "^18.0.0",
+      "@types/react-dom": "^18.0.0",
       "typescript": "^4.4.2",
       "web-vitals": "^2.1.0"
     },
 
@@ -1,14 +1,16 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+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
 
@@ -1,14 +1,14 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+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'));
+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
 
@@ -77,8 +77,8 @@
     "workbox-webpack-plugin": "^6.4.1"
   },
   "devDependencies": {
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
   },
   "optionalDependencies": {
     "fsevents": "^2.3.2"