settings: router

.gitignore

@@ -1,3 +1,4 @@
+.env
 # Logs
 logs
 *.log

package.json

@@ -16,6 +16,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-redux": "^8.0.2",
+    "react-router-dom": "^6.4.0",
     "swiper": "^8.4.0",
     "vite-plugin-svgr": "^2.2.1"
   },

src/App.jsx

@@ -1,5 +1,27 @@
+import { Link, Route, Routes } from 'react-router-dom'
+import Home from './pages/Home/Home'
+import Like from './pages/Like'
+import Onul from './pages/Onul'
+import Login from './pages/Login'
+import Cart from './pages/Cart'
+import MyPage from './pages/MyPage'
+import SignIn from './pages/SignIn'
+
 function App() {
-  return <div className="p-4 text-black text-2xl ">Hello</div>
+  return (
+    <>
+      <Routes>
+        <Route path="/" element={<Home />} />
+        <Route path="/category" element={<Home />} />
+        <Route path="/onul" element={<Onul />} />
+        <Route path="/like" element={<Like />} />
+        <Route path="/my" element={<MyPage />} />
+        <Route path="/login" element={<Login />} />
+        <Route path="/signin" element={<SignIn />} />
+        <Route path="/cart" element={<Cart />} />
+      </Routes>
+    </>
+  )
 }
 
 export default App

src/main.jsx

@@ -1,10 +1,13 @@
 import React from 'react'
 import ReactDOM from 'react-dom/client'
+import { BrowserRouter } from 'react-router-dom'
 import App from './App'
 import './index.css'
 
 ReactDOM.createRoot(document.getElementById('root')).render(
   <React.StrictMode>
-    <App />
-  </React.StrictMode>
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>
+  </React.StrictMode>,
 )

src/pages/Cart.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Cart = () => {
+  return <div>Cart</div>
+}
+
+export default Cart

src/pages/Home/Home.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Home = () => {
+  return <div>Home</div>
+}
+
+export default Home

src/pages/Like.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Like = () => {
+  return <div>Like</div>
+}
+
+export default Like

src/pages/Login.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Login = () => {
+  return <div>Login</div>
+}
+
+export default Login

src/pages/MyPage.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const MyPage = () => {
+  return <div>MyPage</div>
+}
+
+export default MyPage

src/pages/Onul.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Onul = () => {
+  return <div>Onul</div>
+}
+
+export default Onul

src/pages/Order.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Order = () => {
+  return <div>Order</div>
+}
+
+export default Order

src/pages/Prdoucts/ProductDetail.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const ProductDetail = () => {
+  return <div>ProductDetail</div>
+}
+
+export default ProductDetail

src/pages/Prdoucts/ProductList.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const ProductList = () => {
+  return <div>ProductList</div>
+}
+
+export default ProductList

src/pages/Search.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Search = () => {
+  return <div>Search</div>
+}
+
+export default Search

src/pages/SignIn.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const SignIn = () => {
+  return <div>SignIn</div>
+}
+
+export default SignIn