2. GrpahQL 설치 - with GraphQL Yoga & Github (1)

- GraphQL Yoga

GraphQL Yoga는 '쉽게 설치하는 데에 중점을 둔, 완전한 기능을 갖춘 GraphQL 서버' 입니다.

(GraphQL Yoga 공식 github)

 프로젝트를 세팅한 후, 설치하는 법을 알아보겠습니다.

1. 폴더 만들기

먼저, 프로젝트를 만들 위치로 간 후, 프로젝트(폴더)를 생성해줍니다. (여기서는 CLI에서 실습하겠습니다.)

그리고 해당 폴더로 이동합니다. (위치는 어디든 상관없습니다.)

cd Documents
mkdir test
cd test

* yarn 을 쓸 수 없어요!

혹시 yarn을 미리 설치하지 않으신 분들은 아래 공식문서에서 install 가이드를 따라서 설치하시면 됩니다. (OS별로 선택해서 진행하세요.)

(yarn 공식문서 설치안내)

설치를 완료하였으면, 다음 명령어를 수행합니다.

yarn init

명령어를 수행하면 위와 같은 화면이 나오는데, description은 마음대로 적어주시고 repository url을 적는 부분이 있습니다.

여기서 Github의 repository url을 적어주시면 됩니다.

저는 위와 같이 새로운 repository를 생성하였습니다.

(README는 체크하셔도, 안하셔도 됩니다.)

.gitignore 부분은 Nodejs로 설정했습니다.

생성한 후, Github의 url을 아까의 CLI에서 repository url 부분에 복사해서 넣어줍니다.

<상단의 url을 복사한다.>

author 부분에 자신의 이름을 적어주세요.

<완료된 화면>

 이제 에디터로 아까 만든 test프로젝트를 열어줍니다.(저는 Atom을 사용하겠습니다.)

프로젝트를 열고 보면, package.json이 생성되어 있는 것을 보실 수 있습니다.

<CLI에서 작성한 설정들이 여기에 정의되어 있다.>

이제 CLI에서 github과 연동 후, pull을 사용해 github에 있는 파일들을 끌어오겠습니다. (.gitignore와 readme가 올겁니다.)

git init
git remote add origin [자신의 git url] // []는 빼고 써주세요.
git pull origin master

<완료 된 모습>

이제 드디어 GraphQL Yoga를 설치하면 됩니다.

yarn add graphql-yoga

설치가 완료되면 다음과 같이 package.json에 yarn dependencies가 생성되고 프로젝트에 yarn.lock파일도 생성됩니다.

<graphql-yoga 설치완료 화면>

마지막으로 'nodemon'이라는 것을 설치하겠습니다.

nodemon은 엄청 간단하고, 파일을 수정할 때마다 자동으로 서버를 재시작해줍니다.

yarn global add nodemon

<nodemon 설치 완료화면>

이제 서버를 시작해보겠습니다.

먼저, package.json에 다음과 같이 nodemon에 대한 설정을 추가해줍니다.

<package.json에 nodemon 설정 추가>

그 후, 서버가 잘 실행되는지 log를 찍어보겠습니다.

index.js 파일을 생성 한 다음에 다음과 같이 입력해보겠습니다.

console.log("Hello GraphQL");

<index.js에 Hello GraphQL log 작성>

이제 서버를 시작해보겠습니다.

yarn start

<서버 작동>

위와 같이 실행이 되고, Log가 잘 찍혀 나오면 무사히 서버가 실행되고 있는 겁니다.

하지만 아직 GraphQL 서버가 실행되고 있는 것은 아닙니다.

GraphQL-Yoga로 GraphQL 서버 시작하기는 다음 시간에 이어서 포스팅하겠습니다.

GraphQL 튜토리얼은 노마드코더 아카데미 - 나의 첫 번째 GraphQL서버 만들기를 참고하여 작성하였습니다.