React

는 하나의 페이지를 통해 작동되기 때문에 router를 이용하여 페이지를 나누어야 한다.

준비

react-router-dom 설치

import { BrowserRouter, Route, Routes } from 'react-router-dom';
import Login from './pages/login';
import Main from './pages/main';
import Signup from './pages/signup';

const App = () =>{
  return (
    <BrowserRouter> //BrowserRouter로 전체 감싸기//
      <Routes> //Routes로 감싸기//
    //<Route path='/주소/' element= {<파일명 />} />//
        <Route path='/' element={<Login />} />  
        <Route path='main/*' element={<Main />} />
        <Route path='signup/*' element={<Signup />} />
      </Routes>
    </BrowserRouter>    
  )
}

export default App;

알아볼 것
1. 메소드를 이용한 앞으로 가기 / 뒤로가기 / 바로 가기
2. 잘못된 주소 입력 시 'not found 페이지' 출력