Merge pull request #2 from Skhuthon/feature/1

[#1] 프로젝트 생성

package.json

@@ -6,9 +6,16 @@
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
+    "@types/node": "^20.14.9",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@types/react-router-dom": "^5.3.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-router-dom": "^6.24.0",
     "react-scripts": "5.0.1",
+    "three": "^0.165.0",
+    "typescript": "^5.5.2",
     "web-vitals": "^2.1.4"
   },
   "scripts": {

src/App.tsx

@@ -0,0 +1,17 @@
+import React from "react";
+import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
+import MainPage from "./pages/MainPage";
+import ThemeRecs from "./pages/ThemeRecs";
+
+const App: React.FC = () => {
+    return (
+        <Router>
+            <Routes>
+                <Route path="/" Component={MainPage} />
+                <Route path="/themeRecs" Component={ThemeRecs} />
+            </Routes>
+        </Router>
+    );
+};
+
+export default App;

src/index.tsx

@@ -0,0 +1,21 @@
+import React from "react";
+import ReactDOM from "react-dom/client";
+import "./index.css";
+import App from "./App";
+import reportWebVitals from "./reportWebVitals";
+
+const root = ReactDOM.createRoot(
+    document.getElementById("root") as HTMLElement
+);
+
+root.render(
+    // strictMode에서는 두번 렌더링 될 수 있으나, 프로덕션빌드 모드에서는 그렇지 않을것
+    <React.StrictMode>
+        <App />
+    </React.StrictMode>
+);
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(console.log))
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();

src/pages/MainPage.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+
+const MainPage = () => {
+    return (
+        <>
+            <h1>Main</h1>
+        </>
+    );
+};
+export default MainPage;

src/pages/ThemeRecs.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+
+const ThemeRecs = () => {
+    return (
+        <>
+            <h1>ThemeRecs</h1>
+        </>
+    );
+};
+export default ThemeRecs;

tsconfig.json

@@ -0,0 +1,20 @@
+{
+    "compilerOptions": {
+        "target": "es5",
+        "lib": ["dom", "dom.iterable", "esnext"],
+        "allowJs": true,
+        "skipLibCheck": true,
+        "esModuleInterop": true,
+        "allowSyntheticDefaultImports": true,
+        "strict": true,
+        "forceConsistentCasingInFileNames": true,
+        "noFallthroughCasesInSwitch": true,
+        "module": "esnext",
+        "moduleResolution": "node",
+        "resolveJsonModule": true,
+        "isolatedModules": true,
+        "noEmit": true,
+        "jsx": "react-jsx"
+    },
+    "include": ["src"]
+}