[React] 5. Router

 

 

 

 목차

1. Router 설치
2. import 와 JSX 작성 (BrowserRouter, Routes, Route, Link)

 

 

 

1. Router 설치

• 터미널 우측에 (+) 클릭
• 터미널 명령어 : npm install react-router-dom
• package.json : "react-router-dom" 이 생성됨

 

 

 

 

 

2. import 와 JSX 작성

• BrowserRouter, Route, Routes 를 import
• JSX 작성 
  • BrowserRouter : 첫 <div>를 감싸는 묶음
  • Routes : Route를 감싸는 묶음
  • Route : path 속성을 통해 원하는 url을 지정, element 속성으로 path 경로가 선택되면 해당 Component 호출
    * Route는 순서대로, 'if ~ else if ... else' 의 기능을 한다
  • Link : <a>태그와 같은 역할을 하며, 지정한 url로 이동시킨다