비동기 통신

개발자 모드에서 네트워크에서 서버와 브라우저가 통신하고 있는 것을 볼 수 있다

네이버 검색창에 '새ㅇㅇ'을 검색하고 있을 때 네트워크 상황

 

이고잉님 강의자료

https://docs.google.com/document/d/1bzKpUgF2fTlo3wA-qxyfg1Mqi6A5O9LhQDY-0JlXpGQ/edit#

 

json-server 레포지토리 사이트

https://github.com/typicode/json-server

 

fetch() cheetSheet

https://devhints.io/js-fetch

 

Json placeholder

https://jsonplaceholder.typicode.com/guide/

 

JSON.stringify()는 json으로 인코딩한 것이고 (객체 타입 -> 텍스트로 전환)

JSON.parse()는 원래 데이터 타입으로 디코딩한 것입니다. (텍스트 -> 객체로 전환)

 

JSON을 만든 사람의 사이트 주소?

https://json.org/json-ko.html

 

웹브라우저가 서버에게 이 데이터 타입은 JSON이라고 알려줄 때 사용하는 것?

'Content-Type': 'application/json',

 

rest API

resource

method: POST

method: GET

데이터가 resource , 그 데이터를 수정하는 방법들이 method (디폴트는 GET)

element

데이터 중에 특정한 데이터 하나를 가지고 오고 싶다면 그 한 건은 element

 

함수는 1급식이지만 if문은 2급식

setTimeout(function() { alert(1); }, 1000)

함수의 인자로 전달된 함수 : 콜백함수

 

fetch API 

내가 사용하는 함수의 리턴값이 Promise라면?

1. promise는 then을 호출하면 된다.
2. 이 then에는 함수를 넣어주면 된다. (=콜백함수)
3. 그 함수는 이 작업이 성공했을 때 호출될 것이다
4. 그 함수의 첫번째 파라미터엔 데이터가 들어가 있다.
5. then은 두개의 파라미터가 있다. 
6. 첫번째 파라미터는 성공할 때 실행되고, 두번째 파라미터는 실패할 때 실행될 것이다.
7. 두번째 함수의 첫번째 파라미터에는 실패한 이유가 들어있을 것이다.

 

여기서 data는 response 객체이다. 서버가 응답한 정보들이 다 정리정돈돼서 우리에게 오는 것이다,

이 data를 JSON객체로 컨버팅해서 받고 싶다. -> 그러면 리턴한 값이 Promise이다

위의 코드랑 같은 코드임. promise를 그대로 return해주면 바로 뒤에 .then()을 해줄 수가 있다.

data.json도 비동기 작업, promise 작업이 이루어지고 then을 호출하는 것이다.

 

그런데, 너무 Promise로 리턴을 하게되면 then hell promise 현상이 발생할 수 있다.

 

생활코딩 promise 수업

https://www.youtube.com/watch?v=Sn0ublt7CWM 

생활코딩님 강의트리인 서말을 자주 이용하자...!!!!!!!!!!!!!!

https://opentutorials.org/course/3083

https://seomal.org/