코드스테이츠(cliet-server architecture, API, AJAX, fetch)

클라이언트-서버 통신이란 무엇입니까

정리하자면 리소스가 존재하는곳과 사용하는 앱을 분리시키는 것을 cliet-server architecture라고 합니다. 쉽게 말해서 클라이언트가 리소스를 얻기위해 서버에게 요청하는 것을 요청과 응답을 주고받는 관계가 되는겁니다 이때 요청과 응답을 주고받고자 HTTP라는 프로토콜을 이용하는 개념입니다. 여기서 API개념은 클라이언트가 서버에 리소스를 요청할때 서버가 클라이언트에게 안내해주는 사용설명서 같은개념입니다. API라는 사용설명서를 읽고 클라이언트는 서버에 요청을 할 수있는 것입니다 또한 요청을 할때 '메소드'라는 것을 응용하여 보다 정의적으로 요청할수있습니다 메소드의 종류는 아래와 같습니다.
-조회(READ) : GET
-추가(CREATE) : POST
-갱신(UPDATE) : PUT 또는 PATCH
-삭제(DELETE) : DELETE

Ajax는 뭐죠

저에게 아약스라고 읽는것이 익숙한 이 단어는 정의하자면

fetch란 무엇입니까

fetch란 MDN문서에 따른 정의는 '리소스를 가져 오기위한 인터페이스를 제공하는 것'이라고 소개되어있습니다. 이말은 '서버에서 URL로 네트워크를 요청할 때 사용한다' 입니다

fetch를 사용하는 방법은 아래와 같습니다.

fetch(url)
.then((response) => {
  //되면 뭘 할껀지
})
.catch(function(error) {
  //error가 날때 우짤껀지
})

위의 기본틀에서 코드를 작성하면됩니다

fetch(url)
.then(response => response.json())
.catch(function(error) {
  console.log(error)
});

1. 통신을 성공하면 response.json()을 해서 응답을 JSON형태로 변환시켜서 전달합니다
2. 통신을 실패하면 error를 출력하여 에러의 원인을 보여줍니다