### Open Source Software 사용법/리뷰 문서 만들기 - REACT Router 사용법
### Open Source Software 사용법/리뷰 문서 만들기 - REACT Router 사용법
* 라우팅이란?
사용자가 요청한 URL에 따라 해당 URL에 맞는 페이지를 보여주는 것이다. 리액트에서는 라우팅 관련 라이브러리가 많이 있는데, 이중 리액트 라우터가 가장 많이 사용된다.
* React Router v6란?
* React Router v6란?
보통 웹사이트에서는 주소를 입력하거나 링크를 클릭하면 새로운 페이지를 보여준다.
보통 웹사이트에서는 주소를 입력하거나 링크를 클릭하면 새로운 페이지를 보여준다.
리액트로 이런 사이트를 만들기 위해서는 따로 추가적인 개발이 필요하다.
리액트로 이런 사이트를 만들기 위해서는 따로 추가적인 개발이 필요하다.
React Router 라는 것을 사용하면 이런 기능을 편하게 구현할 수 있다.
'React Router' 라는 것을 사용하면 이런 기능을 편하게 구현할 수 있다.
React Router는 리액트 컴포넌트로 페이지를 나누는 라이브러리이다.
리액트 라우터는 리액트 컴포넌트로 페이지를 나누는 라이브러리이다.
Router의 핵심 컴포넌트에는 Router, Route, Routes, Link 4가지가 있다.
라우터의 핵심 컴포넌트에는 Router, Route, Routes, Link 4가지가 있다.
참고로, 리액트 라우터는 리액트에서 제공하는 기본 기능이 아니기 때문에 따로 설치해서 사용해야 한다.
참고로, 리액트 라우터는 리액트에서 제공하는 기본 기능이 아니기 때문에 따로 설치해서 사용해야 한다.
* SPA와 리액트 라우터
리액트는 SPA (Single Page Application) 방식으로, 기존 웹 페이지처럼(MPA 방식) 여러개의 페이지를 사용, 새로운 페이지를 로드하는 방식이 아니다. 새로운 페이지를 로드하지 않고 하나의 페이지 안에서 필요한 데이터만 가져오는 형태를 가진다. 리액트 라우터는 신규 페이지를 불러오지 않는 상황에서 각각의 url에 따라 선택된 데이터를 하나의 페이지에서 렌더링 해주는 라이브러리 라고 볼 수 있다.
* 주제 선정 이유 :
* 주제 선정 이유 :
...
@@ -37,6 +44,11 @@ React Router 라이브러리를 사용해서 웹사이트를 컴포넌트로 만
...
@@ -37,6 +44,11 @@ React Router 라이브러리를 사용해서 웹사이트를 컴포넌트로 만
문서에서 소개하는대로 개념을 익히고 실습을 따라해보며 리액트 라우터 사용법을 익힌다.
문서에서 소개하는대로 개념을 익히고 실습을 따라해보며 리액트 라우터 사용법을 익힌다.
Router의 핵심 컴포넌트인 Router, Route, Routes, Link 4가지를 사용해 간단한 웹 사이트를 만들어본다.
Router의 핵심 컴포넌트인 Router, Route, Routes, Link 4가지를 사용해 간단한 웹 사이트를 만들어본다.