1 Gatsby 알아보기 및 개발 환경 구성하기 - Gatsby를 위해 필수로 알아야 할 기술

source: categories/study/gatsby/gatsby_1.md

출처 / 인프런 개츠비 블로그

React

Gatsby는 앞서 설명했다시피 React를 사용하는 JAM Stack 기반 프레임워크입니다.
따라서 이 강의를 듣기에 앞서 React를 모른다면 따라올 수 없기 때문에, 처음 접하는 분들은 React 기초에 대해 공부하시고 오는 것을 추천드립니다.
Redux까지는 학습할 필요는 없고, React 공식 문서의 내용만 어느정도 이해하고 코드를 작성할 수 있으면 수월하게 따라오실 수 있을 것입니다.

GraphQL

GraphQL은 페이스북에서 개발한 쿼리 언어입니다.
각각의 엔드포인트에서 고정된 데이터를 받을 수 있는 Rest API와는 다르게 GraphQL은 단일 엔드포인트에서 원하는 데이터만을 받을 수 있다는 장점을 가지고 있습니다.
위와 같이 Query를 통해 데이터를 받아올 수 있으며, 이 외에도 데이터 변경을 위한 Mutation, 실시간 기능을 위한 Subscription이 있습니다.

query getHeroInfo {
    hero {
        name
        age
        ability
    }
}

물론 GraphQL 사용 방법이 익숙하다면 좋겠지만, Gatsby에서는 데이터 조회를 위한 Query만 사용되기 때문에 나머지 두 개에 대해서는 자세하게 알고 있지 않아도 크게 상관 없습니다.
게다가 Query 문법 자체도 어렵지 않아 이 강의에서 나오는 설명으로 충분히 이해할 수 있어 쉽게 쿼리문을 작성할 수 있습니다.
그래도 Gatsby 공식 홈페이지에서의 GraphQL 설명을 한번 보고 오시는 것을 추천드립니다.
Gatsby에서는 주로 페이지 또는 Static Query 컴포넌트에서 필요한 데이터를 받아오기 위해 사용되는데, 자세한 부분은 나중에 개발을 진행하며 차근차근 알아가봅시다.
여기서 진행할 프로젝트에서는 제목, 개발자 정보, 홈페이지 요약과 같은 기본 정보와 블로그 콘텐츠 데이터를 관리하는 데 GraphQL을 사용할 것입니다.

hyungju-lee

master