핀테크그룹의 GraphQL 기반 BFF와 프론트엔드 활용기

Context

MSA 도입으로 마이크로서비스마다 엔드포인트가 분산되면서 프론트엔드에서 관리 복잡도 증가, 여러 서비스의 API 스펙 조율 비용 상승, 각 플랫폼마다 인증·인가·CORS 정책을 중복으로 구현해야 하는 문제 발생했다.

Technical Solution

• NestJS + Apollo Server 조합으로 BFF 구현: 모듈화된 구조와 데코레이터 기반 패턴으로 GraphQL API 서버 구축, 여러 마이크로서비스 데이터를 단일 GraphQL 스키마로 통합
• Fastify 런타임 도입: 가볍고 빠른 특성으로 짧고 잦은 GraphQL 요청 처리
• Apollo Client + graphql-codegen 연계: GraphQL 쿼리 작성 시 TypeScript 타입 자동 생성으로 type safety 확보
• InMemoryCache의 keyFields 설정: 복합 키(id, idType, kycSeq 등)를 지정해 서로 다른 데이터가 단일 캐시 엔트리로 병합되는 문제 해결
• BFF 단일 진입점에서 인증·인가·로깅·CORS 처리 통제: 백엔드 스펙 변경 시 BFF에서만 응답 매핑하여 프론트엔드 변경 방지

Impact

아티클에 정량적 수치 없음

Key Takeaway

GraphQL 기반 BFF는 백엔드와 프론트엔드 사이 완충 계층으로 작동하며, graphql-codegen을 통한 자동 타입 생성으로 개발 생산성을 높이고 백엔드 스펙 변경으로부터 프론트엔드를 보호한다. 다만 추가 계층으로 인한 장애 지점 증가와 운영 복잡도 증가를 고려해 서비스 규모와 마이크로서비스 증가 시점을 기준으로 도입을 판단해야 한다.