[Node.js] GraphQL(3)

Hyun·2023년 8월 31일
0

nodejs

목록 보기
16/19

1. Apollo가 뭐에요?

  • Apollo는 GraphQL을 Client와 Server 모두에서 편하게 사용할 수 있는 라이브러리

1-1) Apollo Client

  • Apollo Client를 사용하면 쿼리 캐싱, loading 상태 및 Error 처리, 서버와 데이터 동기화 유지와 같은 이점이 있다.
  • 웹,ios 또는 Android 에서 React를 사용하든 angular를 사용하든 상관없이 가져온 데이터를 프론트엔드 Component에서 사용할 수 있다.

1-2) Apollo Server

  • Apollo Server는 Apollo Client를 포함한 모든 GraphQL 클라이언트와 호환되는 사양 준수의 오픈 소스 GraphQL 서버이다.
  • 모든 소스의 데이터를 사용할 수 있는 자체 문서화 가능한 자체 문서 GraphQL API를 구축하는 가장 좋은 방법이다.
  • 최신버전은 4지만 아직 많은 사람들이 3을 사용하고 있다.

2. Apollo Server V3

  • 현재 사용했던 코드를 이용하여 Apollo Server를 사용해보자.
  • 먼저 전에 설치한 GraphQL-express를 제거하고 Apollo server를 설치한다.
  • 코드를 변경한다.
const { loadFilesSync } = require('@graphql-tools/load-files')
const { makeExecutableSchema } = require('@graphql-tools/schema')
const {ApolloServer} = require('apollo-server-express')
const express = require('express')
const path = require('path')
const port = 4000
// 모든 폴더안에 extension이 graphql인거
const loadFiles = loadFilesSync('**/*',{
    extensions : ['graphql']
})
const loadedResolvers = loadFilesSync(path.join(__dirname,"**/*.resolvers.js"))
async function startApolloServer(){
    const app = express()
    const schema = makeExecutableSchema({
        typeDefs : loadFiles,
        resolvers : loadedResolvers
    })
    const server = new ApolloServer({
        schema 
    })
    await server.start()
    server.applyMiddleware({app, path:'/graphql'})
    app.listen(port,()=>{
        console.log('running')
    })
}
startApolloServer()

3. Apollo Server 3->4

  • Apollo Server 패키지 삭제
    npm uninstall apollo-server-express
const { loadFilesSync } = require('@graphql-tools/load-files')
const { makeExecutableSchema } = require('@graphql-tools/schema')
const {ApolloServer} = require('@apollo/server')
const express = require('express')
const cors = require('cors')
const {json} = require('body-parser')
const {expressMiddleware} = require('@apollo/server/express4')
const path = require('path')

const port = 4000

// 모든 폴더안에 extension이 graphql인거
const loadFiles = loadFilesSync('**/*',{
    extensions : ['graphql']
})

const loadedResolvers = loadFilesSync(path.join(__dirname,"**/*.resolvers.js"))

async function startApolloServer(){
    const app = express()

    const schema = makeExecutableSchema({
        typeDefs : loadFiles,
        resolvers : loadedResolvers
    })

    const server = new ApolloServer({
        schema 
    })

    await server.start()

    app.use('/graphql',
        cors(),
        json(),
        expressMiddleware(server,{
            context:async({req}) => ({token:req.headers.token})
        })
    )
    app.listen(port,()=>{
        console.log('running')
    })
}

startApolloServer()

0개의 댓글