0719_graphql이란 무엇인가

graphql 이란?

graphql

• 데이터 전송 속도를 해결하기 위함
• API 를 만들때 사용할 수 있는 쿼리 언어
• 실제로 필요한 데이터만 받도록 작성 가능
• 선언형 데이터 페칭언어라 불린다. (선언형 : 무엇을 해야 하는지에 초점)

rest의 단점

• 오버펫칭
• 언더페칭: 특정 데이터를 요청하고, 받아온 데이터를 사용해 추가 데이터 요청하는것
• 엔드포인트 관리

graphql 의 장점

• 강력한 타입 시스템
• 버전 관리 용이

예시코드

• 초기셋팅

const client = new ApolloClient({
  <!-- playgroud 주소 -->
  uri: "https://exam.backend.solotrip.kr/graphql",
  <!-- 한번 받아온 것을 캐싱하기 위함 -->
  cache: new InMemoryCache(),
});

Mutation: 데이터를 생성, 수정, 삭제하는 등 서버 상태를 변경하는 작업을 수행 Fetch: 데이터를 조회하는 작업을 수행

• fetch

export const FETCH_SOLPLACE_LOG = (page: number) => {
  return gql`query FetchSolplaceLogs($page: Int! = ${page}) {
            fetchSolplaceLogs(page: $page) {
              id
              introduction
              solplaceName
              solplaceAddress
              images
              userId
              createdAt
              updatedAt
              deletedAt
            }
          }`;
};

• mutation

export const CREATE_SOLPLACE_LOG = gql`
  mutation CreateSolplaceLogBySolplaceName(
    $solplaceName: String!
    $solplaceAddress: String!
    $createSolplaceLogInput: CreateSolplaceLogInput!
  ) {
    createSolplaceLogBySolplaceName(
      solplaceName: $solplaceName
      solplaceAddress: $solplaceAddress
      createSolplaceLogInput: $createSolplaceLogInput
    ) {
      id
      introduction
      solplaceName
      solplaceAddress
      images
      userId
      createdAt
      updatedAt
      deletedAt
    }
  }
`