본문 바로가기
반응형

개발/GraphQL , Apollo19

GraphQL과 Apollo Apollo+GraphQL의 조합은 Rest, Redux의 단점을 해소하는 조합이다. GraphQL로 인해 프론트엔드, 백엔드 개발자의 업무 독립성 향상 -> 생산성 향상 우선 GraphQL을 사용함으로 axios를 사용할 필요가 없어진다. 이는 서버에게 '이거 만들어주세요, 저거 만들어주세요' 할 필요가 없어지는 것을 뜻한다. 프론트엔드 개발자가 서버의 컨트롤러를 죄다 파악하고 있는 상황이 아니라면 서버요청이 필요할때마다 서버 코드를 살펴봐야 하는데, graphQL은 하나의 엔드포인트에서 클라이언트가 원하는 데이터를 뽑아올 수 있는 시스템이라 프론트엔드 개발자의 생산성을 향상시켜준다. RestAPI 사용시 발생하는 Over,UnderFetching 해소 RestAPI를 사용하다보면 하나의 데이터를 가져.. 2022. 2. 28.
apollo에서 Error: Unexpected token < in JSON at position 0 보통 Error: Unexpected token < in JSON at position 0 에러는 header에 application/json을 명시하지 않아서 나는 에러라고 한다. 하지만 나는 graphql을 사용하기에 해당되지 않는다. 그럼 뭘까. https://stackoverflow.com/questions/53209623/network-error-unexpected-token-in-json-at-position-0-at-new-apolloerror 위 문서에서 말하기를 httpLink를 확인해보란다. 확인해보니 path에 graphql을 안써주었다. graphql을 붙혀주니 해결되었다 ㅎㅎ 2022. 2. 28.
Express, graphql로 서버생성 무려 5시간에 걸쳐서 서버를 개통했다. DB는 그냥 json파일로 하기로했다. rest의 router가 graphQL의 resolver라는 사실을 알았다. 그리고 express를 js로 하다가 오류가 생겼는데 서버 폴더 전체를 뒤져서 겨우 찾았다. 타입스크립트의 중요성을 새삼 깨닫고 서버 폴더 삭제했다가 typescript로 express 다시 설치했다. 2022. 2. 27.
Apollo 를 이용한 상태관리 props 전달로도 충분히 가능하지만, graphQL(Apollo)를 이용하여 상태관리 할 수 있다는 사실을 알고 있었고, 회사에서도 graphQL을 주력으로 사용하기 때문에(난 랜딩페이지 담당이라 아직 사용할일은 없지만) 어떻게든 graphQL을 이용하여 상태관리를 하고 싶었다. 며칠간 유튜브, 블로그, 공식문서를 전전하다 apollo를 이용한 상태관리로 TodoList를 만드는 과정을 설명한 블로그를 찾게 되었다. 그동안 삽질한 것들의 농축 + 기가막힌 컨텐츠 덕분에 곧바로 이해가 되었고 내 사이드 프로젝트에서도 응용하였다. 리덕스, 리코일과 비슷했다.(원리는 다르겠지만 일단 보기에는 비슷) 그냥 파일하나에 전역상태 다 몰아넣고 필요할때마다 꺼내 쓰는 것. 전역상태는 하이라이트 되어 있는 stores.. 2022. 2. 12.
반응형