11/9 마스터 클래스

FE 퀴즈

1. React Router에서 Link 컴포넌트가 하는 기능?

• history api 를 이용해서 to 속성에 넣어준 url을 넣어주고, compnents 속성에 넣어준 컴포넌트를 렌더링해준다.

2. popstate?
3. 상태관리는 어떻게 했는지?
4. useEffect가 어떤 역할?
5. 이번 프로젝트를 수행하는데 어려웠던점?

• cors 에러 해결
• debouncing
• throttling
• hitory api를 활용한 callback 처리

면접때 시간을 끄는 방법

• 질문을 하자 -> 토론하는 분위기를 만들자

상태관리

context api

• props drilling을 해결하기 위한 것 (props를 계층적으로 계속 내려주는것)
• 상태가 너무 많아지면 관리하기 힘들다.
• view가 순수하게 렌더링만 할 수 있도록 구현하는게 좋다.
• view의 dependency가 model과 분리되어 있는 것이 좋다.
• Provider가 최상위 컴포넌트에서 필요한게 아니라 중간에 필요하다면, 굳이 최상위 컴포넌트를 Provider로 감싸주지 말자.

Hook

• mixin 처럼 동작
• 커스텀훅 안에서 useState, useEffect를 쓰는데 컴포넌트 안에서도 useState, useEffect를 쓴다!?
  • 컴포넌트가 렌더링될때 mixin처럼 동작해서 useState, useEffect를 한번에 묶어서 실행하고 렌더링한다.

React Router

• [auth workfolw(https://reactrouter.com/web/example/auth-workflow)
  • 사용자 인증 정보를 관리하는 context를 만듦
  • 커스텀훅을 사용해 코드를 간결하게 작성(상태관리 부분을 컴포넌트 밖으로 뺌)