[React]리액트에서 링크 기능 사용하기

일반적으로 html에서 링크를 걸어줄 때는 a 태그를 많이 사용하지만 react 환경에서는 추천되지 않는다

사용은 가능하지만...! 리액트에서 a 태그로 작성하면 링크를 누를때마다 리액트가 죽고 새 페이지가 열리는 문제가 발생한다(화면 전체가 새로고침됨)

a 엘리먼트의 href 속성은 페이지 전체를 다시 그리기 때문인데...🤔 이러면 필요한 부분만 빠르게 다시 그려주는 리액트의 장점을 활용하기 어렵다

 

리액트에선 a 태그 대신 Link 태그를 사용하자!

// html
<a href="#" />

// JSX
<Link to="#" />

a 태그는 href 속성을 이용해서 경로를 설정하지만 link 태그는 to 속성으로 경로를 설정해준다