# graphql
GraphQL React + Apollo Tutorial - 3. Query: 링크 불러오기
서버로부터 데이터를 불러오고 데이터를 React 컴포넌트에 표시하는 방법을 익힙니다. Apollo 클라이언트를 사용하여 GraphQL 쿼리를 다룹니다.
React.GraphQL(poketmon-app);
오늘은 노마더코더에서 제공하는 무료강의인 GrpahQL movie-app 만들기를 하겠습니다.설치항목은 router-dom, styled components, apollo 입니다.먼저 router폴더에 Home과 Detail을 만들어 주고, App에서 Router 컴
Get started 'react-apollo'
REST API와 Redux를 대체하는 GraphQL과 Apllographql을 기반으로 한 상태관리 플랫폼. 클라이언트에서 graphql을 사용해 데이터를 가져오는 UI를 만들 때 사용하기 좋다.@apollo/react-hooks로 더 간편하게 사용할 수 있다. =>
GraphQL React + Apollo Tutorial - 2. 시작하기
Hackernews 클론 프로젝트를 시작합니다. `create-react-app`을 사용하여 프론트엔드를 제작하고, Prisma를 사용하여 백엔드를 제작합니다.
GraphQL에서 스키마의 의미
그냥 대충 생각해보면 어떤 의미인지 와닿긴 하지만 뭐라 설명하기에는 애매한 용어라서 기록해놓는다.GraphQL 공식문서에 의하면 스키마가 필요한 이유는 아래와 같다.GraphQL 쿼리의 형태가 결과와 거의 일치하기 때문에 서버에 대해 모르는 상태에서 쿼리가 반환할 결과
GraphQL React + Apollo Tutorial - 1. Introduction
Apollo Client는 프론트엔드에서 GraphQL을 아주 간단하게 시작할 수 있도록 도와주는 유연하면서도 강력하고 직관적인 API를 제공합니다.
Apollo 서버로 GraphQL API 개발하기 (3)
이번에는 로그인/회원가입 기능을 구현해볼 것이다. 본 글에서 설명하는 내용은 개인적으로 공부하면서 생각한 것으로 검증되지 않았습니다. 따라서 이 방식을 다른 프로젝트에 그대로 도입하면 보안상 문제가 생길 수도 있으니 주의하시길 바랍니다. 보안은 저도 잘 모릅니다..ㅜㅜ
GraphQL - Node Tutorial - 10. Summary
이제 여러분은 Node.js를 사용하여 GraphQL 서버를 만드는 법, 필터링과 인증, 페이지네이션과 구독을 구현하는 베스트 프랙티스를 모두 배웠습니다.
GraphQL - Node Tutorial - 09. Filtering, Pagination & Sorting
Node.js, Express, Prisma를 사용하여 GraphQL API에 필터링 및 페이지네이션 기능을 추가해봅니다.
GraphQL 자료정리
[GraphQL 튜토리얼] https://www.howtographql.com/graphql-js/1-getting-started/ [Scalar Types] https://graphql.org/learn/schema/#scalar-types [Non-Null List of Strings] https://graphql.org/learn/schema/#l...
Apollo 서버로 GraphQL API 개발하기 (2)
서버 구축 등 기초적인 내용은 1편에서 다뤄봤고, 2편에선 서버를 커스터마이즈하는 과정에 대해 다뤄볼 것이다. 7. 새로운 데이터베이스 추가 데이터베이스에 사용자 목록을 추가하고 싶으면, 아래와 같이 한다. > 1. 데이터베이스 생성 스키마에 데이터베이스 구조 명시
React 프로젝트 중 Apollo client 이용시 error handling에 대해
안녕하세요. 저는 Apollo client에서 error 핸들링 방법들을 정리해보고, 이번 프로젝트에서 적용될수 있는 부분과 아쉬웠던 부분들에 대해 얘기해보려 합니다. 프로젝트를 하며 error handling에 대해 찾아보게 된 것은 작업을 하다가 error 관련 시련을 많이 겪었기 때문입니다. error가 분명히 발생했는데 만들어놓은 조건문 안으로 ...
Apollo 클라이언트로 React 프론트 개발하기 (1)
Apollo Client(React) 공식 문서 : https://www.apollographql.com/docs/react/get-started/ 0. 사전 설치 Node.js Yarn (선택) Visual Studio Code (선택) 1. Apollo 클라
Apollo 서버로 GraphQL API 개발하기 (1)
GraphQL이란 GraphQL은 데이터베이스 쿼리 언어 중 하나이다. 개인적으로 쿼리문 작성이 직관적인 것이
GraphQL
Restful...? graphQl에 대해 이야기하기 앞서, 우선 REST API에 대해서 간략하게 이야기해야 할 것 같다. REST API는 백앤드 서버와 클라이언트 서버가 분명하게 나뉘어지기 시작하면서, 효율적인 양 서버간의 소통을 위해 등장한 방법론 중의 하나이다. 클라이언트에서 화면에 렌더링할 어떤 정보가 필요로 할 때, 백앤드 서버로 요청을 보...
Graphql-yoga
들어가기 전에 이번 프로젝트에서 GraphQL을 사용하려고 했는데, prisma tutorial을 참고하다가 graphql-yoga라는 것을 사용해서 서버를 돌렸다. 일단 서버를 만들어 배포를 했는데, 무슨 도구인지 몰라서 이번에 정리 좀 하려한다. 개요 Graphql 서버를 실행하게 도와준다. : 합리적인 기본값과 최소 설정을 포함한다. Subscrip...
Prisma 관련 정보정리
Category: 공부정리 Created Time: Jan 05, 2020 1:35 PM Last Updated Time: Jan 05, 2020 8:16 PM 들어가기 앞서 이번에 프로젝트를 시작하면서 graphql을 사용해보려고 했다. 일단 만들어 놓긴 했는데, 용어나 개념들이 정리가 안된거 같아서 정리차원에서 글을 쓰려고 한다. 대부분...
REST API 와 GraphQL
REST API 정의 Representational State Transfer의 약자이다. 일반적으로 REST라고 하면 좁은 의미로 HTTP를 통해 CRUD를 실행하는 API를 뜻한다. 자원의 표현 자원을 이름으로 구분하여 해당 자원의 상태를 주고 받는 모든 것을 의미한다. 즉 자원(recource)의 표현(repersentation)에 의한 상태전달...
apollo client 버그 대잔치
graphql 을 사용하면서 react client에서 어떻게 전역 상태관리를 할 것인지, 그리고 graphql요청은 어떤 방식으로 보낼지에 대한 고민의 답으로 apollo client를 사용하고 있다. 쿼리의 캐싱으로 상태관리를 어느정도 해결해주고, 쿼리 이외의 필요한 값들은 직접적으로 캐싱이 가능하다. 또 custom hook과 codegen으로 쿼리...