Supabase에서 GraphQL 사용하기

개요

supabase는 백엔드 인프라 서비스입니다.
백엔드 구성을 자동으로 해주고 테이블 관리를 GUI로 쉽게 관리할 수 있고 그 외 auth, storage, edge function 등의 기능을 제공합니다.

supabae에서 prisma 비슷하게 제공하는 orm으로도 프론트에서 DB에 접근 가능하지만 GrqphQL도 자동으로 구성해주어 쉽게 사용이 가능합니다.

사용

Properties 테이블이 있다고 해봅시다.

API Docs 자동 생성

supabase는 테이블 생성 시 API Docs도 자동으로 만들어줍니다.

GraphQL Playground 제공

API docs > GraphQL > GraphiQL로 이동합니다.

Apollo client 샌드박스 처럼 쉽게 쿼리를 해볼 수 있도록 구성되어 있습니다.

테이블 생성 시 맺었던 관계대로 supabase에서 GraphQL을 세팅을 해줍니다.

기본 기능이 내장된 리졸버 제공

Properties 테이블이지만 PropertiesCollection으로 쿼리를 요청하는 것을 볼 수 있습니다.

필터나, 페이징처리, 개수제한, 정렬 등의 기능을 쓸 수 있도록 래핑된 쿼리 리졸버를 제공해주는 겁니다.

따라서 Properties 테이블이면 PropertiesCollection 리졸버로 자동으로 생성되어 관련 기능을 쓸 수 있습니다.

codegen을 통한 타입 generation

Apollo와 연계하여 codegen을 사용할 수 있습니다.
codegen 사용 시 쿼리의 argument나 response 타입을 바로 가져올 수 있어 따로 타이핑을 하지 않아도 됩니다.

혹시 테이블 관계나 프로퍼티들이 바뀌더라도 명령어 하나로 다시 타입 generation 생성이 가능합니다.

다음과 같이 프로젝트 root에 gql 폴더 내부 graphql.ts에 타입들이 현재 DB를 반영해 자동으로 생성됩니다.

결론

장점

• supabase는 자동으로 GraphQL을 구성해준다.

• 래핑된 리졸버로 필터나, 정렬과 같은 기능이 내장되어 있다.

• Apollo를 지원하고 codegen을 사용할 수 있다.

단점

• schema 수정이 번거롭다. 아직 문서도 친절히 되어있지는 않음.