diff --git a/frontend/src/Main.js b/frontend/src/Main.js
index e3c51004de3a977de2cb1f69aa6e26174206df73..37d91294ed771898ba06cc3e1c9a10f0b4017778 100644
--- a/frontend/src/Main.js
+++ b/frontend/src/Main.js
@@ -1,5 +1,24 @@
+import { useNavigate } from 'react-router-dom';
+
+function Button({history, children}){
+  const navigate = useNavigate();
+  return(
+    <button onClick={() => {navigate('/search');}}>
+      {children}
+    </button>
+  );
+}
+
 function Main() {
-  return <div className="App">Success login!</div>;
+  return(
+    <div className="App">
+      <h1>메인 페이지 입니다.</h1>
+        <div className="introduction">
+          소개 내용을 담을 공간 
+        </div>
+        <Button>검색</Button>
+    </div>)
+  ;
 }
 
 export default Main;
diff --git a/frontend/src/Router.js b/frontend/src/Router.js
new file mode 100644
index 0000000000000000000000000000000000000000..ff1cafa909a4441ab2bf9eed644ceb75173f7e1f
--- /dev/null
+++ b/frontend/src/Router.js
@@ -0,0 +1,20 @@
+import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import Main from './Main.js';
+
+function Router() {
+  return (
+    <div className="Router">
+            <BrowserRouter>
+                {/* <Header/> */}
+                <Routes>
+                    <Route path="/" element={<Main/>}></Route>
+                    {/* <Route path="/search" element={<Search/>}></Route> */}
+                    {/* <Route path="/postwrite" element={<PostWrite/>}></Route> */}
+                </Routes>
+                {/* <Footer/> */}
+            </BrowserRouter>
+    </div>
+  );
+}
+
+export default Router;