diff --git a/client/src/index.js b/client/src/index.js
deleted file mode 100644
index fca194d..0000000
--- a/client/src/index.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react'
-import { createRoot } from 'react-dom/client';
-import './index.css';
-import App from './App';
-
-self.$RefreshReg$ = () => {};
-self.$RefreshSig$ = () => () => {};
-
-const container = document.getElementById('root');
-const root = createRoot(container); // createRoot(container!) if you use TypeScript
-root.render(<App />);
diff --git a/client/src/index.tsx b/client/src/index.tsx
new file mode 100644
index 0000000..a0fc92e
--- /dev/null
+++ b/client/src/index.tsx
@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { createRoot } from 'react-dom/client';
+import './index.css';
+import App from './App';
+
+const container = document.getElementById('root');
+const root = createRoot(container!);
+root.render(<App />);
diff --git a/tsconfig.json b/tsconfig.json
index 66d2074..302a246 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,6 +6,7 @@
     "target": "es5",
     "jsx": "react",
     "allowJs": true,
-    "moduleResolution": "node"
+    "moduleResolution": "node",
+    "jsx": "react",
   }
 }
\ No newline at end of file
diff --git a/webpack.config.js b/webpack.config.js
index 18dd51e..8fc6fcf 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -17,7 +17,7 @@ module.exports = env => {
   global.$RefreshSig$ = () => () => {};
 
   return {
-    entry: ["./client/src/index.js"],
+    entry: ["./client/src/index.tsx"],
     mode: isDevelopment ? 'development' : 'production',
     module: {
       rules: [