Style/template

package.json

@@ -10,11 +10,19 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@faker-js/faker": "^9.4.0",
     "@reduxjs/toolkit": "^2.5.0",
     "@tailwindcss/vite": "^4.0.0",
+    "@tinymce/tinymce-react": "^5.1.1",
     "axios": "^1.7.9",
+    "dompurify": "^3.2.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-icons": "^5.4.0",
     "react-redux": "^9.2.0",
     "react-router-dom": "^7.1.3",
     "tailwindcss": "^4.0.0"

src/App.tsx

@@ -1,5 +1,5 @@
 import {RouterProvider} from 'react-router-dom'
-import root from './router/root'
+import root from './common/router/root'
 
 function App() {
 

src/apis/AxiosApi.tsx → src/common/apis/AxiosApi.tsx

@@ -1,5 +1,5 @@
 import axios from "axios";
-import store from "../store";
+import store from "../../store.tsx";
 import {login} from "../slices/loginSlice.tsx";
 
 const axiosApi = axios.create({

src/common/router/blogRouter.tsx

@@ -0,0 +1,14 @@
+import {Suspense} from "react";
+import {Blog, Loading} from "./page.tsx";
+
+const blogRouter = () => {
+
+    return [
+        {
+            path: ':username',
+            element: <Suspense fallback={Loading}><Blog/></Suspense>
+        },
+    ];
+}
+
+export default blogRouter;

src/router/page.tsx → src/common/router/page.tsx

@@ -14,5 +14,17 @@ export const Loading =
         </svg>
     </div>;
 
-export const Main = lazy(() => import('../pages/MainPage'));
-export const Login = lazy(() => import('../pages/member/LoginPage'));
+export const Main = lazy(() => import('../../pages/MainPage.tsx'));
+export const Login = lazy(() => import('../../pages/member/LoginPage.tsx'));
+export const Platform = lazy(() => import('../../pages/member/PlatformPage.tsx'));
+export const Email = lazy(() => import('../../pages/member/EmailPage.tsx'));
+export const Code = lazy(() => import('../../pages/member/CodePage.tsx'));
+export const Signup = lazy(() => import('../../pages/member/SignupPage.tsx'));
+export const Setting = lazy(() => import('../../pages/setting/SettingPage.tsx'));
+
+export const Search = lazy(() => import('../../pages/post/SearchPage.tsx'));
+
+export const Post = lazy(() => import('../../pages/post/PostPage.tsx'));
+export const Write = lazy(() => import('../../pages/post/WritePage.tsx'));
+
+export const Blog = lazy(() => import('../../pages/blog/BlogPage.tsx'));

src/common/router/postRouter.tsx

@@ -0,0 +1,14 @@
+import {Suspense} from "react";
+import {Loading, Post} from "./page.tsx";
+
+const postRouter = () => {
+
+    return [
+        {
+            path: ':id',
+            element: <Suspense fallback={Loading}><Post/></Suspense>
+        },
+    ];
+}
+
+export default postRouter;

src/common/router/root.tsx

@@ -0,0 +1,43 @@
+import {createBrowserRouter} from "react-router-dom";
+import {Suspense} from "react";
+import {Loading, Login, Main, Search, Setting, Write} from "./page.tsx";
+import postRouter from "./postRouter.tsx";
+import blogRouter from "./blogRouter.tsx";
+import signupRouter from "./signupRouter.tsx";
+
+const root = createBrowserRouter([
+    {
+        path: '',
+        element: <Suspense fallback={Loading}><Main/></Suspense>
+    },
+    {
+        path: '/login',
+        element: <Suspense fallback={Loading}><Login/></Suspense>
+    },
+    {
+        path: '/setting',
+        element: <Suspense fallback={Loading}><Setting/></Suspense>
+    },
+    {
+        path: '/search',
+        element: <Suspense fallback={Loading}><Search/></Suspense>
+    },
+    {
+        path: '/write',
+        element: <Suspense fallback={Loading}><Write/></Suspense>
+    },
+    {
+        path: '/signup',
+        children: signupRouter()
+    },
+    {
+        path: '/post',
+        children: postRouter()
+    },
+    {
+        path: '/blog',
+        children: blogRouter()
+    },
+]);
+
+export default root;