react-router-dom

곽민서·2026년 7월 10일

리액트 라우터(react-router-dom)

  • 리액트(React)는 메타(구 페이스북)에서 개발한 웹 애플리케이션의 사용자 인터페이스(UI)를 만들기 위한 자바스크립트 라이브러리이다.
  • 리액트 라우터(React Router)는 리액트 앱에서 페이지 이동을 구현할 때 사용하는 표준 라이브러리이다.

1. react-router-dom이 필요한 이유

전통적인 웹사이트(MPA, Multi Page Application)는 페이지를 이동할 때마다 서버에 새로운 HTML 파일을 요청한다. 이 과정에서 화면 전체가 순간적으로 깜빡이며 새로고침된다.

하지만 리액트는 SPA(Single Page Application) 방식을 사용한다.
SPA는 처음에 HTML을 딱 한 장만 받아두고, 주소가 바뀔 때마다 자바스크립트가 필요한 부분의 컴포넌트(화면 조각)만 동적으로 갈아끼우는 방식이다.

이때 주소창의 URL이 바뀜에 따라 어떤 컴포넌트를 화면에 보여줄지 결정하고 관리해 주는 내비게이션 역할을 하는 라이브러리가 바로 react-router-dom이다.


2. 패키지 설치

리액트 프로젝트 폴더의 터미널에 아래 명령어를 입력하여 라이브러리를 설치한다.

npm install react-router-dom

0개의 댓글