웹어플리케이션을 개발하다 보면 라우팅을 사용하는 경우가 많이 생긴다. Routing을 지원하는 라이브러리가 많이 있으나 React Router 라이브러리가 가장 많이 사용된다. 이번 페이지에서는 React의 Router에 대해 알아보고 사용법을 정리하고자 한다. [목차] Router 개념 React Router 사용하기 React Router 특징 1. Router 개념 Routing이란? 먼저 Routing의 개념부터 살펴보면 Route는 영어로 "경로를 정하다"라는 뜻을 가진다. 웹에서 Routing이란 "사용자가 요청한 URL에 따라 입력받은 URL에 맞는 페이지를 보여주는 것"이다. React의 Router 위와 비슷하게 React에서도 Router란 " 사용자가 입력한 주소를 감지하고 입력받은 ..

1. 문제점 이미 구현은 끝났지만 페이지의 렌더링 속도가 약 5초정도 나와서 성능개선이 필요해 보였다. 회의 결과 성능 웹페이지의 성능 개선은 두 가지 부분에서 가능할 것 같았다. 첫 번째 문제점 이미지 파일들이 조금 무거워서 렌더링 시간의 대부분을 차지하는 것이었다. 특히 슬라이드의 이미지들이 많은 페이지들이 문제였다. 한 친구가 이미지 렌더링 부분을 맡기로 했다. 두 번째 문제점 은 지원서의 form부분에 textarea와 input 태그들이 useState를 통해 onChange 이벤트가 발생할 때마다 값이 리렌더링되고 있어서 불필요한 렌더링이 일어난다. 이렇게 useState로 상태를 관리하는 것을 제어 컴포넌트라고 한다. 2. 성능 개선 사항들 이미지 렌더링 속도 개선 먼저 jpg, png에서 ..