GraphQL 을 처음 접한건 2018년 6월 즈음인 것 같다. GraphQL 을 이용한 무료 강의를 접하게 되었고 이 계기로 GraphQL 에 꾸준히 관심을 갖게 되었다.
1년이 조금 지난 요즘, 내가 느끼기에 여전히 GraphQL 은 대중화 되지 않았다. 하지만 GraphQL 을 사용하는 곳은 많이 늘었고 GraphQL 을 사용하는 방법에 있어서도 많은 변화가 있다고 느껴진다.
그러던 중 Schema-First에서 Code-First로 Migration 하기라는 발표자료를 보게 되었고 내가 느끼는 GraphQL 에 대해 기록을 남겨놓으면 좋겠다는 생각이 들어 종종 새로운 GraphQL 관련 이슈를 알게 되면 조금씩 적어보려 한다.
Why GraphQL?
Javascript 로 Web 서비스를 만들다보면 아래의 단점을 경험하곤 했다.
- IDE 의 도움을 받아야지만 코드레벨에서의 실수를 그나마 캐치할 수 있다.
- 외부(유저의 Input or DB Read 등)로부터 오는 값들의 validation 이 까다롭거나 귀찮다.
여기서 1번은 Typescript 를 사용하면서 해당 단점이 보완되었다.
그러나 2번의 경우는 @hapi/joi 혹은 class-validator 등을 이용하여 추가적인 액션을 취해줘야 하곤 했다.
헌데 GraphQL 은 유저의 Input 에 대한 validation 을 해주어 유저의 Input 에 대한 type-safe 를 보장해주는 것이 내겐 큰 장점으로 다가왔다.
또한 RESTful API 설계 방식과 대비되는 장점들도 매력적으로 다가오게 되어 꾸준히 관심을 갖고 있다. (“RESTful API 와의 비교는 다른 좋은 글들이 많아 적지 않는다” 고 쓰고 “필력이 부족하다” 라 읽는다)
Schema-First GraphQL (1)
위에서 처음 소개한 강의 이후에도 2탄에 걸쳐 무료 강의를 수강할 수 있었다.
그 이후로 회사의 지원을 받아 유료 코스인 Uber clone 강의를 수강, GraphQL 의 Subscription 을 이용해 Real-time 데이터도 다루는 법을 해보게 되었다. (PPL 아님..)
위 강의까지 수강한 이후 이 방식으로 사내 CMS 를 2개 만들었고 하나는 여전히 현역으로 사용되고 있다.
이 방식으로의 개발은 아래의 순서로 진행되었다.
.graphql로 스키마 정의- Directory 에 흩어진
.graphql을gql-merge를 이용하여 하나의 파일로 merge graphql-to-typescript를 이용하여.d.ts파일 생성- 이를 이용하여 Server 에서 Resolver 작성
- Client 는
gql을 이용하여 query & mutation 파일 작성 - 5번에서 작성한 Schema 들에 대한 정보를
apollocli 를 이용해 Server 에서 다운로드 - 생성된
.d.ts를 이용하여 Client 로직 개발
(써놓고 보니 너무 귀찮은 작업들이었다..)
이 때 나름 재미난(?) 일을 겪었는데 apollo cli 를 버전업 하면서 기존에 잘 수행되던 6번 작업이 잘 되지 않았다. 이를 이슈로 등록하였고 이게 해결되었다. ㅎㅎ
하지만 이슈가 해결 된 이후로도 여전히 버전업(1.9.2 -> 2.5.3)을 하지 않았는데.. 바로 아래의 이유에서 였다.
- 특정 객체의 일부만 수정하고 싶을 땐 수정 할 값만 mutation 을 통해 업데이트 요청하게 구현함
- Client 에서 수정 할 값만 mutation 에 넣고 보내면 Server 에선 해당 값 외에는 Mutation args 에 넘어오지 않았음
- 허나 새 버전에선 update 할 값만 요청 보내도 Server 에선 나머지 property 에 null 이 들어옴
- 이로 인해 Server 에선 null 로 업데이트를 쳐야할지 무시해야할지 판단할 수 없게 됨
- 버전업 하지 않음. ㅎㅎ
GraphQL 로 이렇게 작업하면 되는구나~ 하는 도중 또 다른 신세계(?)를 경험하게 되었다.
Schema-First GraphQL (2) - Prisma
사용해보진 않았지만 Prisma 에 대한 글은 꾸준히 읽어온 것 같다.
소개글에 따르면
- Schema 정의
- DB 에 Schema 생성
- Type-safe 한 database client 사용 가능
하다고 한다.
GraphQL 만을 위한 서비스는 아니기 때문에 기회가 되면 Prisma 를 경험해보고 이에 관련된 글을 따로 쓰는 것이 좋을 것 같다.
(Prisma2 가 Preview 기간이니 조만간 나올 것 같다.)
참고로 토이프로젝트에서 Prisma 를 써보신 분께선 Prisma 가 “편하고 좋았다” 고 하셨고 단점으로는 “서버가 scala로 되어 있는데 무겁다” 를 말씀하셨다.
Code-First GraphQL
(사실 Schema-First / Code-First 의 개념은 이보다 조금 나중에 알게되었다는건 안비밀)
이전에 함께 일했던, 개발로 밥벌어 먹게 해주신 아주 고마운 분과 이야기 하면서 GraphQL 관련 새 기술스택을 접하게 되었다.
바로 TypeGraphQL + TypeORM 이었다. Ben Awad 라는 분의 Youtube 강의를 통해 해당 기술스택을 익힐 수 있었다.
하나의 Entity class 만 정의해두면 Decorator 를 통해 DB 와 GraphQL Resolver 까지 한번에 사용할 수 있는, 아주 재미있는 기술 스택이었다.
마침 내부 CMS 를 하나 더 만들어야 하는 니즈가 있어 해당 기술스택을 이용해 서버 로직을 MVP 로 구현하였다. 다른 우선순위에 밀려 Client 까진 구현하지 않았지만, GraphQL Playground 만으로도 필요한 요청은 모두 보낼 수 있었다.
이 프로젝트에선 TypeORM 을 통해 다른 2개 MySQL 에 커넥션을 맺어 사용했던게 재미있는 경험이었다.
아마 Client 까지 개발하게 되었다면 React Hooks 와 결합해서 사용했을 것 같다.
Database-First GraphQL
사내에서 프론트엔드 개발자분들이 Node.js + MySQL 로 서버를 만드실 일이 있어 간단하게 Node.js 에서 MySQL 을 사용하는 방법에 대해 세션을 열어드린 적이 있다. 이 때 시니어 백엔드 개발자분께서 ORM 을 나누는 여러 기준이 있고 Code/Database-First ORM 에 대해 간략히 설명해주셨다.
지금 회사처럼 DBA 가 있고 기능을 개발하기 전 개발 계획을 작성한다면 Database-First ORM 을 사용하기도 한다는 것이었다. 그렇다면 Database-First GraphQL 도 가능하지 않을까? 하는 생각이 들었다.
시도해보진 않았지만 아마 아래의 순서대로 개발을 진행하게 될 것이라 예상한다.
- DBA 분께 개발 계획을 검토받아 DDL 작성 및 DB 생성
typeorm-model-generator를 이용하여 class 코드 작성- 만들어진 class 에 Type-GraphQL Decorator 를 적용하여 GraphQL Resolver 연결
- Client 는
gql을 이용하여 query & mutation 파일 작성 - 4번에서 작성한 Schema 들에 대한 정보를
apollocli 를 이용해 Server 에서 다운로드 - 생성된
.d.ts를 이용하여 Client 로직 개발
맺으며
개인적으로 GraphQL 의 단점으로는
- MSA 환경에 적합하지 않은 구조
- Server - Client 간의 비교적 느린 통신
이라고 생각한다.
1번의 경우 Apollo Federation 를 통해,
2번의 경우는 “N 번의 통신을 1번에 하는것” + “Over fetch 감소”
로 어느정도 해결되었다는 이야기도 있지만 이건 직접 사용해보며 겪어봐야 할 문제인 듯 싶다.
앞으로..
나는 Fully GraphQL 을 개발하는 사람은 아니기에 눈동냥으로 최대한 최신 트렌드를 따라가보려고 해보긴 하고 있다.
MSA 환경에서도 GraphQL 을 잘 쓸 수 있기 위해 Apollo Federation 를 지속적으로 눈여겨 보고 Client 를 위한 좀 더 좋은 툴은 없는지 찾아보려 한다.
그리고 hasura 라는 서비스를 오늘 처음 소개받아 Demo 를 해봤는데 Fully Managed Database-First GraphQL 이라 해도 되지 않을까..? 하는 생각이 들었다.
GraphQL 관련하여 기억에 남는 글들
