리액트 시작하기

■ React Router 설치

패키지 사이트:
npm

검색:
react-router-dom

설치 명령어:
npm i react-router-dom

------------------------------------------------

■ HashRouter 사용

주소 형태:

http://localhost:5173/#/
http://localhost:5173/#/sub01
http://localhost:5173/#/sub02
http://localhost:5173/#/sub03

------------------------------------------------

■ 기본 구조

import { HashRouter, Routes, Route } from "react-router-dom";

<HashRouter>
<Routes>
<Route path="/" element={<Main />} />
<Route path="/sub01" element={<Sub01 />} />
<Route path="/sub02" element={<Sub02 />} />
<Route path="/sub03" element={<Sub03 />} />

{/* 잘못된 경로 */}
<Route path="*" element={<NotFound />} />
</Routes>
</HashRouter>

------------------------------------------------

■ 잘못된 경로 이동 시 에러 페이지

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

* 는 위에 등록되지 않은 모든 경로를 의미한다.

■ react-hook-form 설치

검색:
react-hook-form

설치 명령어:
npm i react-hook-form