얄팍한 graphql & apollo 강좌 - Apollo 서버 구축

📌 목차

• 서론
• 설치
• 간단한 구현
• graphql playground
• 결론
• 참고

📌 서론

얄코님의 강의를 정리한 내용들 입니다. 해당 강의는 apollo server와 react를 연결하는 부분을 구현합니다. 그럼 먼저 apollo-server를 설치해볼까요?

📌 설치

먼저 graphlql과 apollo-server를 설치해볼까요?

npm install 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,
  }
`;

// resolvers는 실제로 query 혹은 mutations가 어떤 기능을 수행하는지 적어줍니다.
const resolvers = {
  Query: {
    teams: () => database.teams
  }
};

// Initialization
const server = new ApolloServer({ typeDefs, resolvers });

// 실제로 서버가 실행되는 부분
server.listen().then(({ url }) => {
  console.log(`Server is ready at ${url}`);
});

📌 graphql playground

이제 localhost:4000으로 들어가서 실제로 한번 쿼리를 날려보겠습니다.

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

여기서 눈치를 채셨겠지만 teams안에 있는 것들만 내려오게 됩니다. 가령 만약에 id만 얻고 싶다면

query {
  teams {
    id
  }
}

이렇게 보내주면 되겠죠?

📌 결론

graphql은 rest-api를 정말 대체할 수 있을까? 그리고 대체한다면 어떤 점 때문에 대체가 가능할지 한번 앞으로 알아보는 시간을 가져 보겠습니다. 실제로 완성된 부분을 보며 실제 rest-api는 어떻게 했어야 했는지 간단하게 비교도 해보는 시간이 있을거 같아요. 그럼 다음 강의도 봐주세요! 안녕 ~

📌 참고

• 얄코 강의