현대 소프트웨어 개발에서 HTTP 기반 API를 생각하면 우리는 크게 두 가지 기술을 떠올리게 되죠? REST와 GraphQL. 역사가 오래된 REST는 비교적 간단한 백엔드 시스템이나 개발된 지 시간이 좀 지난 레거시 시스템에서 많이 사용되고 있습니다. 반면에 GraphQL은 관계가 복잡한 데이터를 다루는 API를 개발하거나 BFF(Backend for Frontend) 또는 API Orchestration(오케스트레이션)을 위해 많이 채택되고 있습니다. 만약 이 두 대표적인 API 기술을 유기적으로 통합할 수 있다면 얼마나 좋을
GraphQL을 사용하다 보면 스키마를 관리하는 일이 점점 중요해지는데요. 팀원이 늘어나고 서비스가 커지면서 "이 필드 바꿔도 기존 클라이언트에 문제 없을까?", "지금 운영 중인 스키마가 정확히 뭐였지?" 같은 고민이 생기기 마련이잖아요? 😅 이럴 때 큰 도움이 되는 도구가 바로 Apollo에서 만든 Rover CLI입니다. 이번 글에서는 Rover CLI의 설치부터 주요 명령어, CI/CD 파이프라인 연동까지 쭉 다뤄보겠습니다. Rover CLI란? Rover는 Apollo GraphQL에서 제공하는 공식 CLI 도구입니다.
Subscription GraphQL에는 query와 mutation 그리고 subscription 이렇게 총 3가지 operation type이 있습니다. 이 중에 query는 데이터 조회를 위해서 필수적으로 사용되고, mutation은 데이터 변경을 위해서 많이 사용되고 있습니다. query와 mutation 대비 다소 생소한 subscription은 주로 실시간(real-time) 애플리케이션을 구현하기 위해서 사용되는데요. subscription도 기본적으로 query처럼 데이터를 조회를 위해서 사용되지만 작동 방식에서 큰
Subscription GraphQL에는 query와 mutation 그리고 subscription 이렇게 총 3가지 operation type이 있습니다. 이 중에 query는 데이터 조회를 위해서 필수적으로 사용되고, mutation은 데이터 변경을 위해서 많이 사용되고 있습니다. query와 mutation 대비 다소 생소한 subscription은 주로 실시간(real-time) 애플리케이션을 구현하기 위해서 사용되는데요. subscription도 기본적으로 query처럼 데이터를 조회를 위해서 사용되지만 작동 방식에서 큰
서버 애플리케이션을 개발할 때 사용자 사용자 인증(authentication)과 인가(Authorization)는 데이터 보안을 위해서 매우 핵심적인 기능입니다. 따라서 GraphQL API를 설계하거나, GraphQL 서버를 개발할 때도 사용자 인증/인가 부분에 대해서 여러 가지 고려가 필요합니다. 이번 포스팅에서는 Apllo Server를 이용하여 GraphQL 서버의 사용자 인증과 인가를 구현해보도록 하겠습니다. HTTP 인증 방식 HTTP 인증 방법에는 여러 가지가 있는데, GraphQL 스팩에서는 어떤 특별한 인증 방법을
GraphQL 서버에서 클라이언트로 부터 요청받은 쿼리(Query)나 뮤테이션(Mutation)을 실행하다가 오류가 발생할 수 있습니다. 이런 경우, GraphQL 서버에서 해당 오류에 대한 정보를 응답해줘야 클라이언트에서도 그에 상응하는 화면 처리를 할 수가 있을 것입니다. 이번 포스팅에서는 Apollo Server로 개발된 GraphQL 서버에서 어떻게 오류 처리를 해야하는지 알아보도록 하겠습니다. 오류 발생 시 응답 결과 GraphQL 서버에서 오류가 발생할 경우, Apollo Server는 HTTP 응답 바디의 errors
지난 포스팅에서는 Apollo Hooks라는 새로운 방법을 통해 React 앱에서 어떻게 GraphQL API를 호출할 수 있는지 간단히 살펴보았습니다. 이번 포스팅에서는 지난 포스팅에서 다뤘던 useQuery() 함수 뿐만 아니라 useMuation() 함수까지 사용해서 간단한 노트(Note) 앱을 React로 작성해보도록 하겠습니다. Apollo Hooks가 생소하신 분들은 아래 포스팅를 통해 먼저 기본 개념을 잡으시고 이 포스팅로 돌아오시기를 추천드립니다. [GraphQL/React] Apollo Hooks 소개/사용법 기존에
지난 달, Apollo Client에서 공개되어 현재 뜨거운 반응을 얻고 있는 Apollo Hooks에 대해서 알아보겠습니다. Apollo Client가 생소하신 분들은 아래 포스팅를 먼저 보시고 이 포스팅로 돌아오시는 것을 추천드립니다. [GraphQL] Apollo Client 사용법 Apollo Hooks? Apollo Hooks는 Apollo Client로 React 앱을 개발할 때, GraphQL API를 호출할 수 있는 새로운 방법입니다. 기존에는 react-apollo 패키지에서 제공하는 <Query/>나 <Mutati
지난 포스팅에서 SchemaLink를 이용하여 서버 없이 클라이언트에서 GraphQL API를 호출하는 방법에 대해서 알아보았습니다. 이번 포스팅에서는 로컬에서 직접 스키마를 작성하지 않고 원격 서버로 부터 스키마를 가져오는 몇 가지 방법에 대해서 알아보겠습니다. 패키지 설치 예제 프로젝트에서 필요한 GraphQL과 Apollo Client 관련 패키지를 설치하고 시작하겠습니다. 여기서 graphql-tools 패키지가 가장 중요한데, 스키마 생성을 위해 makeExecutableSchema(), introspectSchema(),
GraphQL 서버 없이도 클라이언트에서 GraphQL API를 호출할 수 있도록 도와주는 Aollo Client의 SchemaLink에 대해서 알아보겠습니다. 일반적인 Apollo Client 생성 일반적으로 Apollo Client를 사용할 때는 다음과 같이 GraphQL 서버로 HTTP 요청을 보내기 위해서 HttpLink를 사용합니다. 이렇게 HttpLink를 사용할 때는 반드시 연동할 GraphQL API의 endpoint를 가진 GraphQL Server가 어딘가에 떠 있어야 합니다. Apollo Client를 이용해서
GraphQL API를 호출할 때 사용하는 클라이언트 라이브러리인 Apollo Client에 대해서 알아보겠습니다. 기본적으로 HTTP 기반으로 동작하는 GraphQL API를 호출할 때 반드시 Apollo Client와 같은 전용 클라이언트 라이브러리가 필요한 것은 아닙니다. GraphQL API를 별다른 라이브러리 없이 최대한 간단하게 호출하는 방법에 대해서 관련 포스팅를 참고바라겠습니다. 패키지 설치 프로젝트에 Apollo Client를 사용할 때 필요한 5개의 패키지를 설치합니다. pacakge.json 이 중, apollo
Apollo Client를 사용하여 GraphQL API를 호출하는 React 컴포넌트를 테스트하는 방법에 대해서 알아보겠습니다. 예제 컴포넌트 작성 Apollo Client를 사용하여 GraphQL API를 호출하는 매우 간단한 React 컴포넌트를 작성해보겠습니다. 아래 PingPong 컴포넌트는 GraphQL 서버에 ping이라는 쿼리를 호출합니다. 서버로부터 응답이 올 때까지는 Loading...라는 메시지를 렌더링합니다. 만약에, 서버로 부터 에러가 응답되면 Error!라는 메시지를 렌더링합니다. 마지막으로 서버로 부터 정
Apollo Client는 GrpahQL API를 호출하기 위해 사용되는 라이브러리입니다. 이번 포스팅에서는 React 앱에서 Apollo Client를 사용하여 GraphQL API를 호출하는 방법에 대해서 알아보겠습니다. 사실, GraphQL API를 호출할 때, 반드시 Apollo Client와 같은 전용 클라이언트가 필요한 것은 아닙니다. GraphQL API를 별다른 라이브러리 없이 최대한 간단하게 호출하는 방법에 대해서는 아래에 따로 포스팅해놓았으니 참고바랍니다. 관련 포스팅: GraphQL API 간단하게 호출하기 그리
GraphQL 서버를 개발할 때도 여느 Rest API 서버와 마찬가지로 테스트의 중요성의 아무리 강조해도 지나치지 않습니다. 이번 포스팅에서는 Apollo Server로 개발된 GraphQL 서버에 대한 테스트를 작성하는 방법에 대해서 알아보도록 하겠습니다. 기존에 Apollo Server를 이용해서 GraphQL 서버를 개발하신 적이 없으신 분들은 관련 포스팅를 먼저 보시고 GraphQL 서버 프로젝트를 생성하시기 바랍니다. 프로젝트 설정 Apollo Server에서는 GraphQL 서버의 테스트를 돕기 위해 apollo-ser
이번 포스팅에서는 Apollo Server를 이용하여 매우 간단하게 GraphQL 서버를 개발해보도록 하겠습니다. 기존에 GraphQL 서버를 한 번도 개발해보신 적인 없으신 분들께 도움이 되었으면 합니다. 프로젝트 생성 원하는 디렉터리(ex. my-server)에 index.js 파일을 생성합니다. 그리고 NPN 초기화 명령어를 실행하면 package.json 파일이 생성됩니다. 패키지 설치 Apollo Server를 사용하기 위해서 패키지 두개를 설치합니다. 참고로 apollo-server는 Apollo에서 제공하는 패키지이며,