[TDL] 08/18 Today's-Done-List

- 유튜브 강의

Recoil

https://www.youtube.com/watch?v=tMQaxZl_MqY

---

React Suspense

const ProfilePage = React.lazy(() => import('./ProfilePage')); // Lazy-loaded

// Show a spinner while the profile is loading
<Suspense fallback={<Spinner />}>
  <ProfilePage />
</Suspense>

• 비동기 작업을 진행하는 컴포넌트를 자식 컴포넌트로 가지며,
  자식 컴포넌트들이 비동기 작업을 진행하는 동안 props에게 할당받은 특정 컴포넌트를 렌더링 한다. ex) Spinner
• 리액트에게 자식 컴포넌트들이 비동기 작업을 진행하고 있다는 것을 전달하여
  리액트는 자식 컴포넌트들을 구독? 주시하면서 비동기 작업이 끝나기만을 기다린다.
• 작업이 끝나면, 자식 컴포넌트 대신 보여준 Spinner 컴포넌트를 자식 컴포넌트로 바꾸면서 리 렌더링을 한다.

즉,  Suspense는 자식 컴포넌트를 관찰하면서 비동기 작업이 진행 중이라면 Spinner 같은 컴포넌트를 대신 보여주고,
비동기 작업이 끝났다면 자식 컴포넌트로 리 렌더링 한다.

https://17.reactjs.org/docs/concurrent-mode-suspense.html

Suspense for Data Fetching (Experimental) – React

https://www.youtube.com/watch?v=8q7OQSPLF4k

https://www.youtube.com/watch?v=7mkQi0TlJQo

---

Vite

• build tool
• 빠른 esbuild를 사용.
• 라이브러리 설치하자마자 미리 bundle을 만들어 놓는다.
• 소스코드는 필요한 것만 건드림

esbuild란 Go로 만든 엄청 빠른 bundler 라이브러리

npm create vite@latest

---

오후 회고 (만족도: 6)

개인 일정으로 약 3시쯤부터  두 시간 조금 넘게 한 것 같음.
요새 해야 할 건 많은데 의욕이 나질 않아서 큰일이다...
캠프도 거의 막바지에, 아직 붙은 건 아니지만 열심히 과제해서 붙는다는 전제하에 프리온 보딩도 5주 과정이니깐
지금 이 하기 싫은 마음의 고비를 잘 넘겨서, 두 달 정도만 더 힘 내보자!(사실 두 달 뒤가 더 참혹할 수 있지만..)

---

- 프리 온보딩 챌린지 과제

우연인지 모르겠지만 온보딩 챌린지 과제와 온보딩 FE과제가 거의 비슷해서, 우선 챌린지 과제를 구현하는 중이다.
원래 ui 그냥 대충 하려 했는데 갑자기 요리조리 해보고, 이색 저색 넣어보느라고 시간이 좀 걸렸다.
그래 봤자 이쁘지도 않은데... 그냥 대충 할 거얼!
내일 전반적으로 모두 구현하고, 주말 중 토요일은 오전에 강의 듣고 저녁에는 약속이 있기 때문에 토요일은 별로 시간이 없을 것 같고, 일요일에 ts로 마이그레이션을 최대한 시도해보고, 로그인 부분은 recoil을 써보는 등의 새로운 도전을 해보는 것으로 대략적인 계획을 구성했다. 너무너무 하기 귀찮았는데, 막상 또 구현하니깐 강의 듣는 거보단 재미있다 흐

---

저녁 회고 (만족도: 6.5)

실습은 뭐 하는 거 없이 시간이 후딱 간다.. 목표 달성 실패

---