https://facebook.com/groups/graphql-kr logo
Join Slack
Powered by
안녕하세요! 채널 가입 후 처음으로 질문하네요 ㅎㅎㅎ GraphQL서버에서 필드를 null...
# 질문
b
안녕하세요! 채널 가입 후 처음으로 질문하네요 ㅎㅎㅎ GraphQL서버에서 필드를 nullable하게 리턴하는데, 클라이언트에서 null 체크를 하거나 null 일 경우 초기화하는 코드가 들어가게 되는데 이 부분에서 깔끔하게 해결하신 분 있으신가요? 코드는 안전해지는 것 같은데 조금 지저분한 것 같아서요 ㅠㅠ
a
우선은 서버측에서 구현상 값이 언제나 있는 건 되도록 NotNullable 하게 줘야 할 것 같아요 클라측에서 할 수 있는 건 저도 궁금하네요 ..ㅎㅎ
😀 1
h
GraphQL 스펙으로 논의되고 있습니다. Client-side nullability control
t
h
뭐 일단은 가벼운 추상화로는 assert & error boundary 같은 패턴도 있구용
Copy code
export function required<T>(v: T): asserts v {
  if (v == null) {
    throw new Error(`Expected non nullable, but got ${v}`);
  }
}
Copy code
export default function MyComponent() {
  const data = useQuery(...);

  required(data.item.field);

  return (
    ...
  );
}
Copy code
<ErrorBoundary
  renderFallback={({ resetError }) => {
    return <>...</>
  }}
>
  <MyComponent />
</ErrorBoundary>
👍 1
음 아니면~~
Apollo Client 나 Urql 같은경우는 구문 확장할 수 있는 레이어가 존재하니 (각각 Link, Exchange) 직접 Client controlled nullability 구현해보시는것도 좋은 옵션일거같고
사실 fragment 를 잘게 쪼개다보면 nullability control 이 지저분해진다 싶을 정도로 길게 들어가는 경우가 드물어지는 것 같긴 해요
b
와 빠른 답변 감사합니다!! 저런 패턴도 있군요! fragment를 잘게 쪼갠다는 건, 컴포넌트별로 필요한 데이터(fragment)만 받아서 각각 예외를 확인할 수 있어서 드물어진단 말씀이신가요?
h
넴 맞습니다!
적당한 예시 바로 보여드릴게 있을지 모르겠는데, 대략 이런느낌으로 갑니다 https://github.com/daangn/websites/blob/main/_packages/%40karrotmarket/gatsby-theme-team-website/src/pages/index.tsx
👍 1
b
fragment로 쪼개니 props 관리도 훨씬 깔끔해지네요! 예시 너무 감사합니다 👍👍
h
b
h
오 얘네 문서 좋네요
Open in Slack
PreviousNext
Powered by