React Router v6

Router V6 정리문서
정리문서2
정리문서3_useParams
정리문서4_redirect

Routes & Not found

path를 지정하지 않고 만드는 Route에 없는 url이 들어오게 만들면
없는 페이지로 유도 할수있음

<Routes>
	<Route path="/" element={<Home />} />
	<Route path="*" element={<NotFound />} />
</Routes>

Navigation

Link 태그를 사용해서 Navbar 작성

//components>Links

const Links = () => {
  return(
    <ul>
        <li><Link to="/">Home</Link></li>
        <li><Link to="/profile">Profile</Link></li>
        <li><Link to="/profile/:id">My Profile</Link></li>
    </ul>
    )
 }
 export default Links

<Links />
<Routes>
	<Route path="/" element={<Home />} />
	<Route path="" element={<NotFound />} />
</Routes>

Login > Home

import { useNavigate } from 'react-router-dom';

const = Login => {
  const navigate = useNavigate();
  const timer = setTimeout(()=>{
                       navigate('/')
                       },1000)
  return(
         <div>
             <button onClick={timer}>로그인</button>
          </div>
         )
  }