[React] Section 15, 16

Fetch API

브라우저 내장형

 

JSON 데이터

자바스크립트로의 변환 작업이 필요하지만 그럼에도 불구하고 파일에서 자바스크립트 객체로의 변환이 매우 쉽다.

 

json() 메소드

response 객체에 있는 내장 메소드

 

Axios

서드 파티 패키지 라이브러리

-> 요청 전송에 성공한다면 오류 상태 코드에 맞는 오류를 만들어서 전달한다.

 

응답을 기다리게 되다보면 오류를 받을 수도 있고 데이터를 받을 수도 있는데 이 데이터가 비어있을 수도 있다.

-> 이런 여러가지 시나리오를 다룰 줄 알아야 한다.

 

Firebase

RealTime database

-> Rest API가 상대적으로 좋다.

 

fetch()는 데이터를 전송하는데에도 사용할 수 있다.

 

body는 자바스크립트의 객체가 아닌 json 객체를 필요로 한다.

 

커스텀 훅

이것도 결국은 정규 함수

안에 상태를 설정할 수 있는 로직을 포함한 함수

 

함수의 이름은 use로 시작해야함

-> 리액트에게 이 함수가 커스텀 훅임을 알려주며 이는 리액트가 해당 함수를 훅의 규칙에 따라 사용하겠다고 보장해주는 것이다.

 

커스텀 훅을 사용한다고 해서 컴포넌트 전반에 걸쳐서 상태나 효과를 공유하는 것은 아니다.

대신 모든 컴포넌트에 커스텀 훅이 재실행되고 해당하는 모든 컴포넌트 인스턴스가 각자의 상태를 받게 된다.

-> 로직만 공유하는 것이지 상태를 공유하는 것이 아니다!!!

 

상태와 관련된 로직을 사용한다던가 다른 리액트 훅을 사용할 수 있으며 이를 통해 컴포넌트간에 특정 로직을 공유할 수 있게 된다.