Rest-API&Graphql-API

📖 GRAPHQL

- GraphQL:  Server API를 구성하기 위해 Facebook에서 만든 쿼리 언어이다.

- 쿼리언어: 정보를 얻기 위해 보내는 질의문(Query)를 만들기 위해 사용되는 컴퓨터 언어이다. 가장 잘 알려져있는 예시로는 데이터베이스 시스템에 저장된 데이터를 가져오기 위해 사용하는 SQL이 있다.

 

📖 REST VS GRAPHQL

- Graphql-API는 보통 하나의 엔드포인트를 가진다. 

- Graphql-API는 백엔드로 요청시 원하는 데이터 값을 응답 받을 수 있어 효율적인 통신을 할 수 있다. 

- Rest-API는 Graphql과 다른게 원하는 데이터 값 보다는 전체 데이터를 받아온다.

 

* 하나의 엔드포인트

REST API는 보통 여러 엔드포인트를 가지며 각각의 엔드포인트가 동일한 응답을 반환한다. 하지만 GraphQL은 보통 하나의 엔드포인트만을 사용하며 요청하는 쿼리에 따라 다른 응답을 반환하는 방식이다.

 

학교의 반, 학생의 데이터를 받아오는 예시로 둘의 차이점을 확인해보자.

EX)

REST API
→ example.com/class
→ example.com/class/(반 index)
→ example.com/class/(반 index)/students
→ example.com/class/(반 index)/students/(학생 index)

GraphQL
→ example.com
    (하나의 엔드포인트에 다른 쿼리를 사용해 요청)

REST API의 경우 반에 속해있는 데이터를 가져오는데에 응답마다 다양한 엔드포인트를 가지게 된다. 하지만 GraphQL은 하나의 엔드포인트 (Root Endpoint)에 다른 쿼리로 요청함으로써 다른 응답을 받을 수 있다.

엔드포인트가 많아질 경우 관리하기 힘들 뿐더러, 많은 엔드포인트의 노출을 막기위해 추가적인 처리가 필요 할 수 있다.

 

 

 

📖 C(reate)R(read)U(date)D(elete)

✏️ AXIOS

C : 생성하는 API => POST

ex)

const reulst = axios.post(API 이름)

R : 조회하는 API => GET

const result = axios.get(API 이름)

U : 수정하는 API => PUT

const result = axios.put(API 이름)

D : 삭제하는 API => DELETE

const result = axios.delete(API 이름)

 

✏️ Graphql

C : 생성하는 API => Mutation

R : 조회하는 API => Query

U : 수정하는 API => Mutation

D : 삭제하는 API => Mutation

ex)

const result = useMuation(API 이름)
const result = useQuery(API 이름)

 

참고문서: https://jongminfire.dev/graph-ql%EC%9D%B4%EB%9E%80

GraphQL이란?