home강의 홈으로
Section 2. GraphQL 서버 만들어보기
Lesson 1. Apollo 서버 구축하기

1. 프로젝트 시작하기

GraphQL을 사용하는 백엔드 서버

a. 프로젝트 생성

  • 프로젝트 폴더 생성 뒤 VS Code에서 열기
  • Ctrl + `로 터미널 창 열기
  • Node.js 프로젝트 생성

    npm init
  • index.js 파일 생성

    console.log('프로젝트 생성 완료') // 터미널에 nodemon index.js로 테스트
  • package.json - "scripts" 항목

    "start": "nodemon index.js"
  • 실행명령 테스트

    npm start

b. 목(mock)데이터베이스 모듈 삽입

  • 2-1-graphql-api-setup 폴더 안 내용들을 프로젝트로 이동
  • index.js

    const database = require('./database') console.log(database)
  • 필요 모듈 설치 뒤 테스트

    npm i convert-csv-to-json npm start
  • VS Code에 Edit csv 확장설치(선택)

c. Apollo 서버 설치

  • 필요 모듈 설치 뒤 테스트

    npm i graphql apollo-server
  • 아폴로 서버 실행

    const database = require('./database') const { ApolloServer, gql } = require('apollo-server') const typeDefs = gql` type Query { teams: [Team] } type Team { id: Int manager: String office: String extension_number: String mascot: String cleaning_duty: String project: String } ` const resolvers = { Query: { teams: () => database.teams } } const server = new ApolloServer({ typeDefs, resolvers }) server.listen().then(({ url }) => { console.log(`🚀 Server ready at ${url}`) }) npm start
  • 쿼리 테스트

    query { teams { id manager office extension_number mascot cleaning_duty project } }



코드 설명
ApolloServer
  • typeDefresolver를 인자로 받아 서버 생성
typeDef
resolver
  • 서비스의 액션들을 함수로 지정
  • 요청에 따라 데이터를 반환, 입력, 수정, 삭제
GraphQL Playground
  • 작성한 GraphQL type, resolver 명세 확인
  • 데이터 요청 및 전송 테스트

🤔얄코에게 질문하기질문은 반.드.시 이리로 보내주세요! ( 강의사이트 질문기능 ✖ )

강의에서 이해가 안 되거나 실습상 문제가 있는 부분,
설명이 잘못되었거나 미흡한 부분을 메일로 알려주세요!

답변드린 뒤 필요할 경우 본 페이지에
관련 내용을 추가/수정하도록 하겠습니다.

이메일 주소
yalco@yalco.kr
메일 제목 (반드시 아래 제목을 붙여넣어주세요!)
[질문] GraphQL과 Apollo 2-1

🛑질문 전 필독!!

  • 구글링을 먼저 해 주세요. 들어오는 질문의 절반 이상은 구글에 검색해 보면 1분 이내로 답을 찾을 수 있는 내용들입니다.
  • 오류 메시지가 있을 경우 이를 구글에 복붙해서 검색해보면 대부분 짧은 시간 내 해결방법을 찾을 수 있습니다.
  • 강의 페이지에 추가사항 등 놓친 부분이 없는지 확인해주세요. 자주 들어오는 질문은 페이지에 추가사항으로 업데이트됩니다.
  • "유료파트의 강의페이지는 어디 있나요?" - 각 영상의 시작부분 검은 화면마다 해당 챕터의 강의페이지 링크가 있습니다.
  • 질문을 보내주실 때는 문제가 어떻게 발생했고 어떤 상황인지 등을 구체적으로 적어주세요. 스크린샷을 첨부해주시면 더욱 좋습니다.
🌏 Why not change the world?