Web Dev/Gatsby :: 개츠비

[Gatsby] Link로 개츠비 페이지들 연결하기

HJPlumtree 2020. 10. 13. 17:08

개츠비 설치와 기본 프로젝트 생성방법은 전 포스트를 참고하세요->

 

보통 HTML에서 페이지를 연결할 때 <a> 태그를 이용한다.

이렇게

<a href="/about">소개 페이지</a>

 

Link 사용하기

개츠비에는 Link라는 리액트 컴포넌트를 사용할 수 있다.

Link는 내부 페이지간의 이동시 좋은 점을 가지고 있다.

가장 돋보이는 점은 누르는 즉시 이동되는 점이다.

 

어떻게 사용할까?

우선 Link를 개츠비 모듈에서 가져와야한다.

import { Link } from 'gatsby'

 

그런다음 Link를 HTML태그를 사용하듯이 사용하면된다.

<Link to="/about">소개 페이지</Link>

 

끝!