Rest-API & GraphQL-API

API

API란 HTTP 요청을 Back-end 컴퓨터에 보냈을때 실행되는 Back-end 기능이다.
즉 Back-end 개발자가 만든 함수이다.
Front-end에서 HTTP라는 길을 통행 데이터를 Back-end에 보내 저장시킨다.
API는 여러 종류가 있고, Front-end에서 종류에 맞게 데이터를 보내면 종류에 따라 데이터를 API에 각각 저장시킨다.

Rest-API

rest-API는 API 이름이 홈페이지 주소 처럼 생겼다.

ex) 네이버 1번 게시글 조회
https://naver.com/board/1

rest-API는 응답 결과로 back-end에서 보내주는 모든 데이터를 받아야 한다.
rest-API에 요청하는 요청담당자는 axios이다.

rest-API에 CRUD

//axios(rest-API)
생성(CREATE) - POST
수정(UPDATE) - PUT
삭제(DELETE) - DELETE
조회(READ) - GET

실제 사용법

import axios from 'axios'

const result = axios.post(API이름)
const result = axios.put(API이름)
const result = axios.delete(API이름)
const result = axios.get(API이름)

GraphQL-API

graphql-API는 API 이름이 일반적이 함수와 같다.

ex) 네이버 1번 게시글 조회
board(1)

graphql-API는 back-end에서 필요한 데이터만 골라서 받을 수 있다.
graphql-API에 요청하는 요청담당자는 apollo-client이다.
필요한 데이터만 골라 받을 수 있어, 효율적인 통신이 가능하다.
페이스북 개발팀에서 만들었다.

graphql-API에 CRUD

//apollo-client(graphql-API)
생성(CREATE) - MUTATION
수정(UPDATE) - MUTATION
삭제(DELETE) - MUTATION
조회(READ) - QUERY

실제 사용법

import { useMutation, useQuery } from '@apollo/client'

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