chore: merge develop

src/App.tsx

@@ -2,6 +2,7 @@ import { Global, ThemeProvider } from '@emotion/react';
 import styled from '@emotion/styled';
 import { useEffect } from 'react';
 
+import { Outlet } from 'react-router-dom';
 import globalStyle from './styles/globalStyle';
 import theme from './styles/theme';
 const App = () => {
@@ -29,6 +30,7 @@ const App = () => {
     <Wrapper>
       <ThemeProvider theme={theme}>
         <Global styles={globalStyle} />
+        <Outlet />
       </ThemeProvider>
     </Wrapper>
   );

src/Router.tsx

@@ -1,5 +1,42 @@
+import { RouterProvider, createBrowserRouter } from 'react-router-dom';
+import App from './App';
+import HomePage from './pages/home/HomePage';
+import JuniorPromisePage from './pages/juniorPromise/JuniorPromisePage';
+import JuniorOnboardingPage from './pages/onboarding/juniorOnboarding/JuniorOnboardingPage';
+import SeniorOnboardingPage from './pages/onboarding/seniorOnboarding/SeniorOnboardingPage';
+import SeniorProfilePage from './pages/seniorProfile/SeniorProfilePage';
+
+const router = createBrowserRouter([
+  {
+    path: '/',
+    element: <App />,
+    children: [
+      {
+        index: true,
+        element: <HomePage />,
+      },
+      {
+        path: 'seniorOnboarding',
+        element: <SeniorOnboardingPage />,
+      },
+      {
+        path: 'juniorOnboarding',
+        element: <JuniorOnboardingPage />,
+      },
+      {
+        path: 'seniorProfile',
+        element: <SeniorProfilePage />,
+      },
+      {
+        path: 'juniorPromise',
+        element: <JuniorPromisePage />,
+      },
+    ],
+  },
+]);
+
 const Router = () => {
-  return <div>Router</div>;
+  return <RouterProvider router={router} />;
 };
 
 export default Router;

src/main.tsx

@@ -1,4 +1,9 @@
+import React from 'react';
 import ReactDOM from 'react-dom/client';
-import App from './App.tsx';
+import Router from './Router.tsx';
 
-ReactDOM.createRoot(document.getElementById('root')!).render(<App />);
+ReactDOM.createRoot(document.getElementById('root')!).render(
+  <React.StrictMode>
+    <Router />
+  </React.StrictMode>,
+);

src/pages/home/HomePage.tsx

@@ -0,0 +1,5 @@
+const HomePage = () => {
+  return <div>Home</div>;
+};
+
+export default HomePage;

src/pages/juniorPromise/JuniorPromisePage.tsx

@@ -0,0 +1,5 @@
+const JuniorPromisePage = () => {
+  return <div>JuniorPromise</div>;
+};
+
+export default JuniorPromisePage;

src/pages/onboarding/juniorOnboarding/JuniorOnboardingPage.tsx

@@ -0,0 +1,5 @@
+const JuniorOnboardingPage = () => {
+  return <div>JuniorOnboarding</div>;
+};
+
+export default JuniorOnboardingPage;

src/pages/onboarding/seniorOnboarding/SeniorOnboardingPage.tsx

@@ -0,0 +1,5 @@
+const SeniorOnboardingPage = () => {
+  return <div>SeniorOnboarding</div>;
+};
+
+export default SeniorOnboardingPage;

src/pages/seniorProfile/SeniorProfilePage.tsx

@@ -0,0 +1,5 @@
+const SeniorProfilePage = () => {
+  return <div>SeniorProfile</div>;
+};
+
+export default SeniorProfilePage;