Table of Contents

DEVIEW 2016

네이버의 모던 웹 라이브러리

REST에서 GraphQL과 Relay로 갈아타기

ediket

  1. REST API - Status Quo & Limitations
  2. GraphQL - How it replaces REST
  3. Relay - Data fetching and management

1. REST API 소개

2. GraphQL

Lokka - GraphQL client

GraphiQL: 자동 문서화와 Type Inspection이 가능한 강력한 툴

3. Relay

Relay 가 GraphQL에서 확장하는 컨셉

Node

Resource에 대한 단일 Interface. Data management면에서 유리함

Connection

다수의 Node를 가져올때 사용. PPagination에 특화되있음

React Relay

데이터의 의존성과 React 컴포넌트가 공존한다.

Mutation in Relay

Mutation Config: Mutation의 Side Effect를 적용시키는 방식을 Config에 명시하면 클라이언트에 적절하게 반영

예제) 이미 불러온 Node의 값을 업데이트. 기존에 불러온 Connection에 추가/제거

3. REST에서 GraphQL Replay로 갈아타기

Summary

GET, POST, PUT, DELETE 로 모든 것을 해결해야 함. → 데이터 가져올땐 query (node, connections, 등) 사← 변경할땐 mutation 사용

기본값으로 어떤걸 불러올지 정하기가 애매함 → 항상 데이터 의존성을 명시

필드 타입이 정해져 있지 않아서 따로 문서화를 하지 않으면 협업이 힘듬 → GraphQL은 타입이 정해져 있고 프로토콜 단에서 확인할 수 있음

데이터 의존성을 URI에 명세하려면 복잡해진다. → 데이터 의존성을 명세한 query/mutation를 보낸다.

데이터 변경사항을 클라이언트에서 치리하는 방식이 제각각 → Mutation Config만 잘 써주면 알아서 데이터 변경사항을 처리한다.

Aftermath

Data management 를 React와 묶어줘서 생산성과 개발 속도가 크게 향상
Query build + Cache로 인하여 성능 향상

지금 존재하는 온라인 문서만으로는 Relay의 진입장벽은 꽤 높은 편. 현재 Relay는 실시간 지원이 미비… 현재 GraphQL Relay만으론 안정적인 서비스 구현이 가능.. 하지만 아직 실험적인 생태계

관련 링크

실내 위치 지도

Motion prediction

Problem formulation: SLAM

Simultaneous Localization And Mapping

Data Association

Graph SLAM

TeeVR

Third Eye Everywhere Virtual Reality

http://www.TeeVR.com

키노트 / 송창현 NAVER CTO