diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
new file mode 100644
index 00000000..d78b7999
--- /dev/null
+++ b/frontend/src/App.tsx
@@ -0,0 +1,26 @@
+import { Route, Routes } from 'react-router-dom';
+import { Main } from '@/pages/Main';
+import { Register } from '@/pages/Register';
+import { AddChannel } from '@/pages/AddChannel';
+import { UserRoute } from '@/pages/UserRoute';
+import { DrawRoute } from '@/pages/DrawRoute';
+import { HostView } from '@/pages/HostView';
+import { GuestView } from '@/pages/GuestView';
+
+const ChannelRoutes = () => (
+  <Routes>
+    <Route path="host" element={<HostView />} />
+    <Route path="guest/:guestId" element={<GuestView />} />
+  </Routes>
+);
+
+export const App = () => (
+  <Routes>
+    <Route path="/" element={<Main />} />
+    <Route path="/register" element={<Register />} />
+    <Route path="/add-channel" element={<AddChannel />} />
+    <Route path="/add-channel/:user" element={<UserRoute />} />
+    <Route path="/add-channel/:user/draw" element={<DrawRoute />} />
+    <Route path="/channel/:channelId/*" element={<ChannelRoutes />} />
+  </Routes>
+);
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
index 061ab8f1..3177f1a3 100644
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -1,5 +1,6 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
+import { BrowserRouter } from 'react-router-dom';
 import './index.css';
 import { App } from './App';
 // 우선은 폰트 다 포함시켰는데, 나중에 사용할 것들만 따로 뺴자.
@@ -15,6 +16,8 @@ import '@fontsource/pretendard/900.css';
 
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
-    <App />
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>
   </StrictMode>,
 );
diff --git a/frontend/src/pages/AddChannel.tsx b/frontend/src/pages/AddChannel.tsx
new file mode 100644
index 00000000..cc2654aa
--- /dev/null
+++ b/frontend/src/pages/AddChannel.tsx
@@ -0,0 +1 @@
+export const AddChannel = () => <>Hello</>;
diff --git a/frontend/src/pages/DrawRoute.tsx b/frontend/src/pages/DrawRoute.tsx
new file mode 100644
index 00000000..f3975f3a
--- /dev/null
+++ b/frontend/src/pages/DrawRoute.tsx
@@ -0,0 +1 @@
+export const DrawRoute = () => <>Hello</>;
diff --git a/frontend/src/pages/GuestView.tsx b/frontend/src/pages/GuestView.tsx
new file mode 100644
index 00000000..575774d7
--- /dev/null
+++ b/frontend/src/pages/GuestView.tsx
@@ -0,0 +1 @@
+export const GuestView = () => <>Hello</>;
diff --git a/frontend/src/pages/HostView.tsx b/frontend/src/pages/HostView.tsx
new file mode 100644
index 00000000..bf6a93bc
--- /dev/null
+++ b/frontend/src/pages/HostView.tsx
@@ -0,0 +1 @@
+export const HostView = () => <>Hello</>;
diff --git a/frontend/src/pages/Main.tsx b/frontend/src/pages/Main.tsx
new file mode 100644
index 00000000..4d9f9074
--- /dev/null
+++ b/frontend/src/pages/Main.tsx
@@ -0,0 +1 @@
+export const Main = () => <>Hello</>;
diff --git a/frontend/src/pages/Register.tsx b/frontend/src/pages/Register.tsx
new file mode 100644
index 00000000..7b341f02
--- /dev/null
+++ b/frontend/src/pages/Register.tsx
@@ -0,0 +1 @@
+export const Register = () => <>Hello</>;
diff --git a/frontend/src/pages/UserRoute.tsx b/frontend/src/pages/UserRoute.tsx
new file mode 100644
index 00000000..3150b926
--- /dev/null
+++ b/frontend/src/pages/UserRoute.tsx
@@ -0,0 +1 @@
+export const UserRoute = () => <>Hello</>;