[T-003] Relay Resolver 다루기

Relay Resolver가 해결하는 문제

하위 수준의 데이터를 가져와서 util 함수로 가공하고 계산하는 방식은 몇 가지 문제를 만들어내요. 비즈니스 로직이 컴포넌트 레벨에 분산되면서 코드 복잡도가 높아지고, 동일한 데이터 변환 로직이 여러 곳에서 중복 구현되면서 일관성 문제도 발생해요.

const stringifiedProductName = stringifyProductName({ price: product.amount, name.product.code, units: product.units }))

위와 같은 방식으로 사용하다 보면 파라미터 이름 불일치, 프로덕트 코드와 상품명의 클라이언트 맵핑 등 미묘한 불편함이 쌓여요. 'amount, code, units와 같은 product의 속성들은 지금 이 컴포넌트의 직접 관심사가 아닌데 왜 쿼리를 해야 하지?'라는 고민도 들고요. Relay Resolver는 이런 문제를 구조적으로 해결해줘요. 기존 GraphQL 스키마를 확장해서 비즈니스 로직을 캡슐화하고, 데이터 변환과 조합을 타입 시스템 내에서 처리할 수 있게 해주거든요. BFF 패턴처럼 중간 추상화 레이어를 제공해 필요한 곳에서 product.stringifiedProductName과 같은 접근으로 바로 쓸 수 있게 해요.

결과적으로 컴포넌트 코드의 가독성과 유지보수성이 크게 향상돼요. 데이터 처리 로직이 스키마 레벨에서 중앙화되니까 일관성도 보장되고, 컴포넌트는 순수하게 UI 로직에만 집중할 수 있게 되죠. 특히 복잡한 비즈니스 요구사항을 처리할 때 Resolver의 타입 안정성과 재사용성이 빛을 발해요.

리졸버 레이어를 얇게 유지하기