김대휘

라우팅 설정

...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
10 "@testing-library/user-event": "^7.1.2", 10 "@testing-library/user-event": "^7.1.2",
11 "react": "^16.13.1", 11 "react": "^16.13.1",
12 "react-dom": "^16.13.1", 12 "react-dom": "^16.13.1",
13 + "react-router-dom": "^5.2.0",
13 "react-scripts": "3.4.1" 14 "react-scripts": "3.4.1"
14 }, 15 },
15 "scripts": { 16 "scripts": {
......
1 -import React from "react"; 1 +import React from 'react';
2 -import NavBar from "./components/NavBar.js"; 2 +import LandingPage from './pages/LandingPage.js';
3 -import BodyLayout from "./components/BodyLayout.js"; 3 +import MainPage from './pages/MainPage.js';
4 +
5 +import {
6 + BrowserRouter as Router,
7 + Switch,
8 + Route
9 +} from "react-router-dom";
10 +
4 11
5 function App() { 12 function App() {
6 return ( 13 return (
7 - <> 14 + <Router>
8 - <NavBar /> 15 + <>
9 - <BodyLayout /> 16 + <Switch>
10 - </> 17 + <Route exact path="/" component={LandingPage}/>
18 + <Route exact path="/main" component={MainPage}/>
19 + </Switch>
20 + </>
21 + </Router>
11 ); 22 );
12 } 23 }
13 24
14 -export default App; 25 +export default App;
...\ No newline at end of file ...\ No newline at end of file
......
1 +import React from "react";
2 +import NavBar from "../components/NavBar.js";
3 +import BodyLayout from "../components/BodyLayout.js";
4 +
5 +function App() {
6 + return (
7 + <>
8 + </>
9 + );
10 +}
11 +
12 +export default App;
1 +import React from "react";
2 +import NavBar from "../components/NavBar.js";
3 +import BodyLayout from "../components/BodyLayout.js";
4 +
5 +function App() {
6 + return (
7 + <>
8 + <NavBar />
9 + <BodyLayout />
10 + </>
11 + );
12 +}
13 +
14 +export default App;
This diff is collapsed. Click to expand it.