본문 바로가기
개발 노트/기초 지식

a태그의 href 와 link 태그 무슨 차이일까?

by tokkiC 2022. 7. 14.

결론부터 말하자면, a 태그는 페이지 이동 시 사용되고 상태값과 컴포넌트가 초기화되고 페이지가 새로 고침된다

link 태그는 페이지가 새로고침 되지 않고 브라우저의 주소만 바뀌므로 상태값과 컴포넌트를 유지할 수 있다

리액트의 경우 단일 url 을 가지고 Single Page Application 으로 사이트를 표현하기 때문에

매번 새로고침하면 상태값과 랜더링에 자원이 소모된다. 때문에 새로고침이 아닌

업데이트만 하기 위해서 리액트의 경우는 link 를 사용해서 타 페이지를 연결해줘야 한다

하지만 리액트가 아닌 소규모 프로젝트에는 a가 페이지 연결의 의미에 더 맞을 것 같다

link는 css 나 png 파일 등과 현재 문서와 관계를 정의하거나 열기 위한 것이 원래 목적이니

용도에 맞게 사용하자

아직 새싹이구나 모르는게 많다

댓글