이번주 주제(week5)
-
글로벌 스테이트?! props가 필요 없대! >> Recoil
-
로그인에도 역사가 있다며? >> AccessToken / RefreshToken
-
Next.js렌더링에 이런 원리가 있다니! >> Diffing / Hydration
-
잠깐! 이것 먼저 실행해줘! >> Closure / HOC / HOF
-
헉! 폼을 자동으로 만들어준다고?! >> React-Hook-Form
오늘의 TIL
1. props, el, prev 작동 원리
props, el, prev는 인자를 받아서 작동하는 함수로, 인자의 명칭에 관계 없이 순서에 따라 작동한다. 화살표 함수가 아닌 일반 함수로 바꿔서 안에 로직을 추가할 수 있다.
2. Rest와 GraphQL의 차이가 또 있다고? >> Undef-Fetching / Over-Fetching
- restAPI의 단점
restAPI는 요청하고 싶은 데이터가 아니더라도 모든 데이터를 다 받아와야 한다.(OverFetching)
graphQL API는 필요로 하는 데이터만 골라서 요청할 수 있어 더욱 효율적이고, 한번에 묶음으로 요청을 할 수 있어서 불필요한 네트워크 자원 낭비를 막을 수 있다.
3. 정규표현식
/ 안에 \를 활용해서 정규표현식 조건을 작성할 수 있다.
4. 글로벌 스테이트?! props가 필요 없대! >> Recoil
- ApolloCache
AppolloClient에서는 API의 결과로 받는 데이터를 ApolloCache라는 state에 가지고 있다. 다른 컴포넌트에서 같은 요청을 하면 ApolloCache에 데이터가 있는지 먼저 확인하고 없을 경우에만 호출을 해서 네트워크 효율성을 높인다.(cache-first)
- Recoil
API 요청으로 받은것이 아닌 프론트에서 만든 state는 recoil을 통해서 관리한다. atom을 참조해서 사용하고, state와 마찬가지로 global state도 값이 변경되면 해당 state를 참조하는 모든 컴포넌트에서 재렌더링이 일어난다.
recoil을 이용하면 props 없이 필요한 곳에서 바로 state를 활용할 수 있다.
self-study
- 포트폴리오 로그인, 회원가입 페이지 추가
- input값 정규표현식으로 검증
