- 웹 접근성: heading 태그가 잘 되어 있는 것이 중요하다.
- 아토믹 디자인 패턴. 컴포넌트는 잘게 쪼개는 것이 좋다.
- 디자인 시스템을 체계적으로 갖춘 회사는 의외로 많지 않다.
- 타입스크립트를 차근차근히 해 나가도 괜찮다.
- 가상 스크롤
- 무한스크롤과 완전히 별개의 개념은 아니다.
- 가상적으로 Dom을 만들고 그 안에서 무한스크롤을 구현하는 것(?)
- 무한스크롤은 데이터가 많아지면(최소 100개 이상) 성능 문제가 생길 순 있다.
- 무한스크롤의 성능을 개선할 수 있는 방법 중 하나이다.
- Redux 보다는 Context API를 많이 사용한다.
- 어떤 기능을 맡느냐에 따라서 Context를 나누어야 한다. 한 가지 기능을 맡는 것이 좋다.
- 렌더링으로 인한 성능 문제가 있을 수 있으므로, 국지적으로 사용하는 것이 필요하다.
- 자유도가 높다.
필요한 경우에 한해서만 사용하는 것이 좋다.
- Redux
- 대부분의 프로젝트는 리덕스까지 필요하지 않다. 현업도 포함해서.
- 렌더링 문제는 덜 수 있지만, State의 변화를 추적하기 어려운 문제가 생길 수 있다.
- JWT: access는 로그인, refresh
Axios가 토큰이 만료되었는지 확인 후, 만료되었다면 발급받은 뒤 다시 호출한다.
- Next.js의 SSR과 전통적인 SSR의 차이점
- 첫 페이지에 진입할 때는 SSR을 사용하고, 그 뒤에는 CSR을 사용한다.
- 서버에서 모든 페이지에 대한 html과 css를 받아 온다. 자바스크립트는 나중에 받아 온다.
- CSR의 단점
- 검색 엔진 최적화 이슈
- 사이트의 규모가 커지면 첫 로딩 속도가 확연히 느려질 수 있다.
- 최종 프로젝트에서 Next.js를 사용해보려고 하는데, 괜찮을까요?
- 써라
- 리액트만 사용하는 것, 그리고 Next.js를 사용하는 것과 개발에 있어 큰 차이가 있을까요?
- 리액트는 라이브러리, 자유도가 매우 높다.
- NextJs는 프레임워크
잘 쓰면 잘 쓸 수도 있지만 방향을 잃을 수도 있다.
프로젝트의 셋팅이 너무 다양하다.
어디에 뭘 어떻게 넣을지 이미 정해져 있다.
- 프레임워크, 라이브러리가 어떤 원리로 동작하는지 이해하려는 노력이 필요하다.
Next.js를 사용 경험을 우대하는 회사도 많다.
React + Next.js 체제로 굳어질 확률이 높다고 조심스럽게 예상한다.
- Recoil, React-Query는 아직 사용하지 않아도 된다.
- 함수형은 어렵다.