# apollo
GraphQL React + Apollo Tutorial - 5. 라우팅
GraphQL과 Apollo를 `react-router 4`와 함께 사용하여 페이지 이동을 구현하는 방법을 배웁니다. 각 라우팅은 `Link`로 표현됩니다.
GraphQL을 Apollo 와 함께 써본 후기
개인적으로 제가 고등학교를 가기 전에 제가 직접 만든 블로그를 운영해보고 싶었습니다.그러기에는 구현해야 될 것이 너무 많았죠. API 서버, DB 모델 구현, DB 연동,로그인 / 로그아웃 구현, 프론트엔드 디자인 등 혼자 하기에는 많이 벅찼습니다.그로 인해 한참 미루
JavaScript로 구현하는 GraphQL 블록체인
최종 결과물 https://vote-link.herokuapp.com/ GraphQL Playground 환경에서 Transaction과 블록을 생성할 수 있다. Bitcoin Blockchain 모델을 기반으로 만들었다.
Heroku에 Apollo 서버 배포하기
1. Heroku 설정 Heroku 회원가입 https://signup.heroku.com/ 에 접속해서 정보를 입력하고 회원가입 후 로그인한다. Heroku 앱 만들기 New -> Create new app을 클릭한다. App name과 Region을 설정하고
Svelte#2 - Svelte + graphQL + apollo
Svelte기능중에 slot 및 graphQL과 같이 쓴 포스트는 아직까지는 다른 svelte관련 자료들에 비해 양이 적은거 같아 이 포스트에서는 가상의 event list Data를 Graphql로 받아와서 Svelte기능중 Slot을 사용해 테스트해본 기록을 해보자
GraphQL React + Apollo Tutorial - 4. Mutation: 링크 생성하기
Apollo 클라이언트를 사용하여 GraphQL 뮤테이션을 다루어봅니다. Apollo의 `<Mutation />` 컴포넌트를 사용하여 뮤테이션을 정의하고 전송합니다.
GraphQL#4 - Schema module 분리
GraphQL Schema(Type, Resolver) 모듈을 분리해서 관리해보자.이 포스트 역시 지난 포스트와 연결하여 작성하는 포스트임을 미리 밝힌다.
GraphQL#3 - Mutation
GraphQl Mutation기능에 대해 정리해보자.해당 포스트는 이전 포스트와 연결되어 진행되는 포스트이기 때문에 관련 소스 역시 연결되어 진행한다.
GraphQL#2 - Apollo Server Setting + Query
GraphQl과 Apollo server를 연동해보기.지난 포스트에 이어 이번에는 Express로 Apollo server를 구현해보고 GraphQL을 연동해보자. npm module부터 설치.Test 용도로 Dummy Data용 json을 일단 하나 만들어보자. 예시
GraphQL React + Apollo Tutorial - 3. Query: 링크 불러오기
서버로부터 데이터를 불러오고 데이터를 React 컴포넌트에 표시하는 방법을 익힙니다. Apollo 클라이언트를 사용하여 GraphQL 쿼리를 다룹니다.
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 React + Apollo Tutorial - 1. Introduction
Apollo Client는 프론트엔드에서 GraphQL을 아주 간단하게 시작할 수 있도록 도와주는 유연하면서도 강력하고 직관적인 API를 제공합니다.
Apollo 서버로 GraphQL API 개발하기 (3)
이번에는 로그인/회원가입 기능을 구현해볼 것이다. 본 글에서 설명하는 내용은 개인적으로 공부하면서 생각한 것으로 검증되지 않았습니다. 따라서 이 방식을 다른 프로젝트에 그대로 도입하면 보안상 문제가 생길 수도 있으니 주의하시길 바랍니다. 보안은 저도 잘 모릅니다..ㅜㅜ
Apollo 서버로 GraphQL API 개발하기 (2)
서버 구축 등 기초적인 내용은 1편에서 다뤄봤고, 2편에선 서버를 커스터마이즈하는 과정에 대해 다뤄볼 것이다. 7. 새로운 데이터베이스 추가 데이터베이스에 사용자 목록을 추가하고 싶으면, 아래와 같이 한다. > 1. 데이터베이스 생성 스키마에 데이터베이스 구조 명시
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은 데이터베이스 쿼리 언어 중 하나이다. 개인적으로 쿼리문 작성이 직관적인 것이
Apollo-boost to Apollo-client, websocket
참고:https://stackoverflow.com/questions/59359280/react-app-error-failed-to-construct-websocket-an-insecure-websocket-connecti https://www.apollographql.com/docs/tutorial/local-state/ https://blog.has...
React infinit scroll 적용시키기
오늘은 리스트를 받아오고 스크롤을 내릴때 로딩 스크롤이 나올수 있는 기능을 넣어보았다. 가장먼저 생각 한것, 쿼리문을 어떻게 수정해야할까. 최소한으로 필요한 사항은 한번에 몇개의 데이터를 가져올것인지. 그리고 게시판으로 생각하면 내가 어떤 페이지의 정보를 가져왔는지 이다. 구글링을 해 보았을때, 기본적 REST API 서버에서 가져올때 https://r...