hanghae-plus · bebusl · Aug 11, 2025 · Aug 11, 2025 · Aug 11, 2025 · Aug 11, 2025
diff --git a/index.html b/index.html
@@ -9,6 +9,6 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
+    <script type="module" src="/src/app/index.tsx"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -12,6 +12,8 @@
     "coverage": "vitest run --coverage"
   },
   "dependencies": {
+    "@tanstack/react-query": "^5.85.2",
+    "jotai": "^2.13.1",
     "react": "^19.1.1",
     "react-dom": "^19.1.1"
   },

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/App.tsx b/src/App.tsx
diff --git a/src/app/app-routes.tsx b/src/app/app-routes.tsx
@@ -0,0 +1,17 @@
+import { Route, BrowserRouter as Router, Routes } from "react-router-dom"
+import PostsManager from "../pages/posts-manager"
+import GlobalLayout from "./ui/globalLayout"
+
+const AppRoute = () => {
+  return (
+    <Router>
+      <Routes>
+        <Route element={<GlobalLayout />}>
+          <Route index element={<PostsManager />} />
+        </Route>
+      </Routes>
+    </Router>
+  )
+}
+
+export default AppRoute
diff --git a/src/app/app.tsx b/src/app/app.tsx
@@ -0,0 +1,12 @@
+import AppRoutes from "./app-routes.tsx"
+import TanstackProvider from "./provider/tanstack-query.tsx"
+
+const App = () => {
+  return (
+    <TanstackProvider>
+      <AppRoutes />
+    </TanstackProvider>
+  )
+}
+
+export default App
diff --git a/src/index.css → src/app/index.css b/src/index.css → src/app/index.css
diff --git a/src/app/index.tsx b/src/app/index.tsx
@@ -0,0 +1,9 @@
+import { StrictMode } from "react"
+import { createRoot } from "react-dom/client"
+import App from "./app"
+
+createRoot(document.getElementById("root")!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+)
diff --git a/src/app/provider/tanstack-query.tsx b/src/app/provider/tanstack-query.tsx
@@ -0,0 +1,12 @@
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
+import { PropsWithChildren } from "react"
+
+const queryClient = new QueryClient()
+
+type Props = object
+
+const TanstackProvider = ({ children }: PropsWithChildren<Props>) => {
+  return <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+}
+
+export default TanstackProvider
diff --git a/src/app/ui/globalLayout.tsx b/src/app/ui/globalLayout.tsx
@@ -0,0 +1,17 @@
+import { Outlet } from "react-router-dom"
+import Header from "../../shared/ui/Header"
+import Footer from "../../shared/ui/Footer"
+
+const GlobalLayout = () => {
+  return (
+    <div className="flex flex-col min-h-screen">
+      <Header />
+      <main className="flex-grow container mx-auto px-4 py-8">
+        <Outlet />
+      </main>
+      <Footer />
+    </div>
+  )
+}
+
+export default GlobalLayout