[GraphQL] 설치와 기본 세팅

GraphQL 설치 및 기본 세팅

GITHUB

paullee714/graphql-study

프로젝트 세팅 & 설치

프로젝트 파일 초기화하기

프로젝트 세팅을 원하는 폴더에 들어가서 실행 해 준다.

$ yarn init .

graphql, nodemon,babel-node 설치하기

$ yarn add graphql-yoga
$ yarn global add nodemon
$ yarn add bable-node --dev
$ yarn add babel-cli babel-preset-env babel-preset-stage-3 --dev

• graphql-yoga는 nodejs에서 graphql을 쉽게 사용 할 수 있게 해준다
• nodemon은 설정한 기준 파일을 트랙킹하여, 수정이 있을 경우 바로 반영 해 준다
• bable-node 는 우리가 작성할 index.js를 좀더 보기 편하게 작성할 수 있도록 도와준다

.babelrc

{
    "presets": ["env","stage-3"]
}

• babel을 사용하기때문에 .babelrc를 설정 해 준다.

package.json파일 세팅

{
  "name": "testql",
  "version": "1.0.0",
  "description": "graphql study",
  **"main": "index.js",**
  "repository": "https://github.com/paullee714/graphql-study",
  "author": "paullee",
  "license": "MIT",
  "dependencies": {
    "graphql-yoga": "^1.18.3"
  },
  "scripts": {
    **"start": "nodemon --exec babel-node index.js"**
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-node": "^0.0.1-security",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-3": "^6.24.1"
  }
}

• 여기서는 scripts를 추가해줬는데, 주목할 것은 main과 nodemon이다

  nodemon은 이제 main이 가르키고있는 index.js를 팔로잉 할 것이고, index.js가 수정이 되면 자동으로 재시작을 한다.

index.js

import { GraphQLServer } from "graphql-yoga";

console.log("Hello~")

테스트

$ yarn start

• yarn start하면, scripts에 작성된 start구문이 실행된다
• 제대로 실행이 되었다면 "hello"가 출력 될 것이고, 수정 하면 즉시 반영이 된다

Graphql 서버 만들기

index.js

import { GraphQLServer } from "graphql-yoga";

const server = new GraphQLServer({

})

server.start(()=> console.log("Graphql Server Running"))

실행

$ yarn start

아마 오류가 날 텐데... 오류가나면 성공(?)이다. 우리가 스키마를 정해주지 않았기 때문에, 스키마 관련 오류가 난다면 우선 서버 생성이 성공한 것!