리액트 폴더 설치

npx create-react-app 폴더이름

폴더구조

my-app
├── node_modules
├── component
├── page
├── images
├── public
│   ├── favicon.ico
│   ├── index.html
│   └── manifest.json
├── src
│   ├── Router.js
│   ├── index.css
│   ├── index.js
│   └── serviceWorker.js
├── .gitignore
├── package.json
└── README.md

Rounter 설치

명령어 입력

npm add react-router-dom

index.js에서 아래와 같이 입력

import React from 'react'
import ReactDOM from 'react-dom'
import Routes from './Routes'

ReactDOM.render(<Routes />, document.getElementById('root'))

Routes.js 추가

import React from 'react'
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
import Main from 'pages/Home'
import Page from './pages/Page'

class Routes extends React.Component {
  render() {
    return (
      <Router>
        <Switch>
          <Route exact="true" path="/home" component={Home} />
          <Route exact path="/Page" component={Page} />
          
        </Switch>
      </Router>
    )
  }
}

export default Routes