11-29

props

el

data

prev

다 함수. 이름은 짓기 나름.

매개변수 parameter

인자 argument

rest api 언더페칭 문제를 해결 한 게 graphql

하나하나 따로 요청 vs 한 번에 여러 개 요청 (createBoard, createProduct ,...)

rest api오버페칭

받고 싶은 것만 받을 수 없고 전부 다 받아야함

(_id, writer, title, contents,...)

정규표현식 -조건 검증식

\ 역슬래시 -escape

\w -문자

\w+ —문자 한 개 이상

/\w+@\w+.\w+/.test("aaa@bbb.com")

. ←all

. ←그냥 점

/\w+@\w+.\w+/.test("aaa@bbb.com")

\d - 숫자

/\d{3}-\d{3,4}-\d{4}/.test("010-1234-5678")

^ 시작점

$ 끝점

/^\d{3}-\d{3,4}-\d{4}$/.test("010-1234-5678")

글로벌 스테이트

ex) redux, Context API

리덕스 쓰게 되면 apolloCache가 해주는 것들을 직접 해야함 -최근에 안 쓰는 추세

→mobx→SWR→React-Query

SWR,react query - 아폴로랑 비슷하게 나옴. 많이 씀

rest api 쓸 때는 React-Query

grahpql 쓸 때는 apolloClient

아폴로 fetchPolicy

-"Cache first"

외부 api 요청하기 전에 아폴로 캐시에 먼저 가보고 없으면 요청.

-"network-only"

캐시에 있든 없든 무조건 요청.

contextapi 실습

createContext

useContext

useRef

컴포넌트에서 특정 DOM 을 선택해야 할 때, ref 를 사용해야 한다고 배웠었습니다. 그리고, 함수형 컴포넌트에서 이를 설정 할 때 useRef 를 사용하여 설정한다고 배웠었습니다.

useRef Hook 은 DOM 을 선택하는 용도 외에도, 다른 용도가 한가지 더 있는데요, 바로, 컴포넌트 안에서 조회 및 수정 할 수 있는 변수를 관리하는 것 입니다.

useRef 로 관리하는 변수는 값이 바뀐다고 해서 컴포넌트가 리렌더링되지 않습니다. 리액트 컴포넌트에서의 상태는 상태를 바꾸는 함수를 호출하고 나서 그 다음 렌더링 이후로 업데이트 된 상태를 조회 할 수 있는 반면, useRef 로 관리하고 있는 변수는 설정 후 바로 조회 할 수 있습니다.

이 변수를 사용하여 다음과 같은 값을 관리 할 수 있습니다.

• setTimeout, setInterval 을 통해서 만들어진 id
• 외부 라이브러리를 사용하여 생성된 인스턴스
• scroll 위치