TIL 7주차 REST API

📌 REST API

REST?

HTTP 메소드 4개를 통해 api를 디자인 하는 것.

rest api는 web의 통신 규약인 HTTP를 이용하기 때문에 HTTP method를 이용한다.

HTTP URI(Uniform Resource Identifier)을 통해 자원(Resource)을 명시하고, HTTP Method(POST, GET, PUT, Patch, DELETE)를 통해 해당 자원에 대한 CRUD Operation을 적용하는 것을 의미한다.

즉, REST는 자원 기반의 구조(ROA, Resource Oriented Architecture) 설계의 중심에 Resource가 있고 HTTP Method를 통해 Resource를 처리하도록 설계된 아키텍처를 의미한다

REST API

REST의 특징을 기반으로 API를 제공하는 것
HTTP 요청을 보낼 때 어떤 URI에 어떤 메소드를 사용할지 개발자들 사이에 지켜지는 약속

RESTful API

RESTful은 REST의 비공식적 구현 가이드이다. 반드시 따라야 하는 법칙을 만들어서 공표한 것이 아니라 여러 개발자들이 비공식적으로 의견을 제시한 것들의 모음으로, 즉 개발자마다 생각하는 RESTful의 내용이 다를 수도 있다.

REST API가 규정(권고)하고 있는 것

1) HTTP 통신을 할 때 리소스는 URI를 통해서 식별,
2) 행위는 HTTP method(POST,GET,DELETE, PUT, Patch)를 통해서,
3) 결과는 응답 코드(201, 403 ~~)로 알려준다.

• 리소스 : resource는 URI를 통해서 표현된다.
  ex) http://example.com/topics
  URI는 해당 정보를 식별하는 이름일 뿐, 이 정보를 가공할 수 있어야 한다. 이를 method로 한다.
• method : GET, POST, DELETE, PUT(전부 수정), Patch(일부 수정)

📌 CRUD

GET

POST

const onAddClick = () => {
    fetch("http://localhost:3001/days/", {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        id: Date.now(),
        day: days.length + 1,
      }),
    }).then(res => {
      if (res.ok) {
        alert("저장 완료");
        history.push("/");
      }
    });
  };

PUT

 const onChange = () => {
    fetch(`http://localhost:3001/words/${word.id}`, {
      method: "PUT",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        ...word,
        isDone: !isDone,
      }),
    }).then(res => {
      if (res.ok) {
        setIsDone(!isDone);
      }
    });
  };

Patch

DELETE

const onDelClick = () => {
    if (window.confirm("are your sure?")) {
      fetch(`http://localhost:3001/words/${word.id}`, {
        method: "DELETE",
        headers: {
          "Content-Type": "application/json",
        },
      }).then(res => {
        if (res.ok) {
          setWord({
            ...word,
            id: 0,
          });
        }
      });
    }
  };

  if (word.id === 0) {
    return null;
  }

관계

리소스와 리소스가 관계를 맺고 있을 경우

topics(부모)/1(부모의 element id)/comments(자식)
// topics의 1번 인덱스가 comments를 포함한다

이와 같이 표현한다.

📌 상태코드 status codes

• 100 : informational

: 100 : continue : 클라이언트가 올바른 요청했을 때

: 102 : processing : 요청 처리 중

• 200 : successful

: 200 : ok : 요청된 리소스 성공 수행

: 201 : created : 요청된 리소스 성공적으로 생성

: 204 : no content : 요청된 리소스 수행 but 내용은 없음

• 300 : redirection

: 301 : 요청된 것이 다른 url로 옮겨짐

: 302 : 요청된 것이 임시적으로 다른 곳으로 옮겨짐

: 303 : get 요청에서만 사용, 302와 유사

: 307 : post 요청에 대해서만, 다른 곳으로 임시적으로 옮겨짐

: 308 : 다른 곳으로 영구적으로 옮겨짐

• 400 : client error

: 400 : 잘못된 요청을 했을 때

: 401 : 권한이 없는 사람이 요청(로그인이 안된 경우)

: 403 : 특정한 일에 대한 권한이 없을 때(로그인이 되었지만 일부 제한이 있는 경우)

: 404 : 해당 url이 존재하지 않을 때

: 405 : 해당 url를 사용되는 것이 허용되지 않을 때

: 409 : 클라이언트가 만들고자 하는 리소스가 이미 존재하거나 충돌할 때

• 500 : server error

: 500 : 서버 내부에서 문제 발생

: 502 : 중간 서버의 응답 문제

: 503 : 서버가 특정 url을 처리할 아직 준비되지 않았을 때