웹 애플리케이션에서는 HTTP 메소드를 이용해 서버와 통신한다. GET
을 통해 웹 페이지나 데이터를 요청하고, POST
로 새로운 글이나 데이터를 전송하거나 DELETE
로 저장된 글이나 데이터를 삭제할 수 있다. 이처럼 클라이언트와 서버가 HTTP 통신을 할 때는 어떤 요청을 보내고 받느냐에 따라 메소드의 사용이 달라진다.
요청과 응답을 할 때, '제대로 보내고 받을 수 있는' 일종의 규약이 존재한다.
웹에서 사용되는 데이터나 자원(Resource)을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식을 말한다.
서로 잘 알아볼 수 있도록 작성하는 것이 중요
REST 성숙도 모델 - 0단계
REST 성숙도 모델 - 1단계
개별 리소스와의 통신을 준수해야 한다.
모든 자원은 개별 리소스에 맞는 엔드포인트(Endpoint)
를 사용해야 한다는 것과 요청하고 받은 자원에 대한 정보를 응답으로 전달해야 한다.
엔드포인트
작성 시에는 동사, HTTP 메소드, 혹은 어떤 행위에 대한 단어 사용은 지양하고, 리소스에 집중해 명사 형태의 단어로 작성하는 것이 바람직한 방법이다.
요청에 따른 응답으로 리소스를 전달할 때에도 사용한 리소스에 대한 정보와 함께 리소스 사용에 대한 성공/실패 여부를 반환해야 한다.
REST 성숙도 모델 - 2단계
CRUD에 맞게 적절한 HTTP 메소드를 사용하는 것에 중점을 둔다.
메소드를 사용할 때도 규칙
GET
메소드 같은 경우는 서버의 데이터를 변화시키지 않는 요청에 사용해야 한다.
POST
는 요청마다 새로운 리소스를 생성하고 PUT
은 요청마다 같은 리소스를 반환한다. 이렇게 매 요청마다 같은 리소스를 반환하는 특징을 멱등(idempotent)하다고 한다. 그렇기 때문에 멱등성을 가지는 메소드 PUT과 그렇지 않은 POST는 구분하여 사용해야 한다.
PUT
과 PATCH
도 구분하여 사용해야 한다. PUT
은 교체, PATCH
는 수정의 용도로 사용합니다.
REST 성숙도 모델 - 3단계
2단계와 동일하지만, 응답에는 리소스의 URI를 포함한 링크 요소를 삽입하여 새로운 기능에 접근할 수 있도록 하는 것이 중요 포인트
클라이언트 개발자들이 응답에 담겨져 있는 링크들을 눈여겨본다면, 이러한 링크들은 조금 더 쉽고, 효율적으로 리소스와 기능에 접근할 수 있게 하는 트리거가 될 수 있다.
curl -X POST http://3.36.72.17:3000/zzok3312@naver.com/messages
-d '{"username": "이재협", "text":"안녕하세요","roomname":"codestates"}'
-H 'Content-Type: application/json'
curl -X GET http://3.36.72.17:3000/zzok3312@naver.com/messages
[{"username":"관리자","roomname":"코드스테이츠","date":"2021-10-19T13:00:42.169Z","text":"이머시브 여러분들 환영합니다"},
{"username":"관리자","roomname":"코드스테이츠","date":"2021-10-19T13:00:42.169Z","text":"chatterbox client 스프린트를 위한 서버입니다"},
{"username":"관리자","roomname":"코드스테이츠","date":"2021-10-19T13:00:42.169Z","text":"아자 아자 화이팅!!!"},
{"username":"이재협","text":"안녕하세요","roomname":"codestates"}]
let url = 'https://api.openweathermap.org/data/2.5/weather?id=1835848&appid=0750803d52e711a7a202a054cd315448'
// 비동기 함수를 통해 weather 정보만 객체 형태로 추출
function test(url) {
return fetch(url)
.then(res => res.json())
.then(json => console.log(json.weather))
}
async function weather(url) {
let weather = await fetch(url);
let json = await weather.json();
console.log(json);
}