feat: Main Page내 페이지별 라우팅 완성 (#16)

frontend/src/App.jsx

@@ -18,7 +18,7 @@ function App() {
 				<Route path="/login" component={LoginLoadingPage} />
 				<Route path="/main/milestones" component={Milestones} />
 				<Route path="/main/labels" component={Labels} />
-				<Route path="/main/new_issue" component={NewIssue} />
+				{/* <Route path="/main/new" component={NewIssue} /> */}
 				<Route path="*" component={NoMatch} />
 			</Switch>
 		</>

frontend/src/components/Header/Header.jsx

@@ -0,0 +1,11 @@
+import { Link } from "react-router-dom";
+
+const Header = () => {
+	return (
+		<>
+			<div>메인의 헤더</div>
+		</>
+	);
+};
+
+export default Header;

frontend/src/components/Header/Menu.jsx

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

frontend/src/components/Header/Navigator.jsx

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

frontend/src/components/pages/MainPage.jsx

@@ -1,31 +1,25 @@
-import { Route, Switch, Link, Redirect, BrowserRouter } from "react-router-dom";
-
+import { Route, Switch, Link, Redirect } from "react-router-dom";
 import Labels from "../Labels/Labels";
 import Milestones from "../Milestones/Milestones";
 import { useState } from "react";
 import NewIssue from "./NewIssue";
 import NoMatch from "./NoMatch";
-
+import Header from "../Header/Header";
+import Navigator from "../Header/Navigator";
 const MainPage = () => {
+	const { pathname } = window.location;
+	console.log(pathname);
+
 	return localStorage.getItem("token") ? (
 		<>
-			<div>메인의 헤더</div>
-			<ul>
-				<li>
-					<Link to="/main/milestones">milestones</Link>
-				</li>
-				<li>
-					<Link to="/main/labels">labels</Link>
-				</li>
-				<li>
-					<Link to="/main/new_issue">이슈 작성</Link>
-				</li>
-				<div>이슈리스트</div>
-			</ul>
+			<Header pathName={pathname} />
+			{(pathname === "/main/labels" || pathname === "/main/milestones") && (
+				<Navigator /> //이부분 switch 문으로 리팩토링(pathName = "/main"이면 Menu~)
+			)}
 			<Switch>
 				<Route exact path="/main/milestones" component={Milestones} />
 				<Route exact path="/main/labels" component={Labels} />
-				<Route exact path="/main/new_issue" component={NewIssue} />
+				<Route exact path="/main/new" component={NewIssue} />
 				<Route path="/main/*" component={NoMatch} />
 			</Switch>
 		</>