프리온보딩 1회차 1월

또다시 시작된 2주의 여정 이번에는 좀 더 열심히 블로그를 남기고 더 많은 복습을 할 수 있도록 하자.

해당 글은 프리온보딩 진행 중 눌지의 귀에 들어오거나 전혀 안 들렸던 이야기를 정리하는 글이다.

신입의 경우 프로젝트가 있다는 가정 아래 새로운 프로젝트보다 기존 프로젝트 리팩토링이 더 좋을 수 있다.

왜냐하면,

사전 질문

Q. 최적화를 진행하는 타이밍이 언제일까요?

A. 일반적으로 병목으로 판단되거나 병목 현상 발생이 예상되는 지점에서 최적화를 진행한다. 하지만 현재 사용자 경험에 영향이 없다면 굳이 최적화를 진행하기보다 다른 업무를 진행하는 것이 좋다.

Q. ChatGPT와 같은 생성형 AI의 사용은 괜찮은가요?

A. 사용하는 것 또한 능력이므로 사용 가능하면 사용하는 것이 좋다.

지역변수 vs 전역변수

state 관리

기존 prop을 자식에게 내려주는 container - presenter 방식의 경우 prop drilling 문제가 발생할 수 있다. 이를 해결하기 위해서 나온 상태 관리 라이브러리들이 존재한다.

context api
- state를 provide 하는 방식. provider가 dispatch를 처리. react 내장 기능. HTTP Request도 Context에서 관리.
- 단점: provider 다수 생성. 설정의 복잡함.
redux
- flux 패턴. view에서 action을 통해 dispatch 처리. store 하나에서 변수 관리. 미들웨어를 통한 비동기처리. redux toolkit을 활용한 비교적 수월한 설정
- 단점: 복잡한 설정. flux 패턴으로 효율성 하락.
recoil
- 필요한 값만 subscribe. react hook과 유사한 문법. 간단한 구조. concurrent mode 지원.
- 단점: 커뮤니티 부족. atom이 많아질 수 있음. 미들웨어 지원 없음.
zustand
- 설정이 간단함. 패턴 없이 자유로운 적용. shallow comparison을 통한 효율 개선. 함수형, 클래스형 모두 지원.
- 단점: 커뮤니티 부족. 미들웨어 없음.

클라이언트에서 상태는 어느 정도 관리가 될 거 같은데 그렇다면 서버의 값들은??

기본적인 로직은 백에서 관리한다고 가정하고 프론트는 React Query로 호출해 관리한다.

최적화는 fresh, stale, inactive 값을 통해 관리할 수 있다.

팁

신입의 경우 다양한 경험도 중요하지만, 본인이 깊이 들어갈 수 있는 가능성을 보여주는 것이 중요하다. 본인이 사용한 기술의 경우 다른 기술보다 해당 기술을 선택한 이유가 있으면 더 좋다.

새로운 기술에 대한 경험이 필요하다고 느끼는 경우 가벼운 토이프로젝트로 해결하는 것이 좋다.

react query는 server side에서 recoil, zustand는 client side에서 사용하는 것을 추천한다.

아하 모먼트 - 사수가 없는 환경에서 성장하기 위한 노력

사수가 중요한가? 강사의 경험에 의하면 신입의 경우 좋은 사수를 알아보지 못하고 불만을 가질 수 있다. 따라서 사수의 유무보다는 나와 대화(토론)가 가능한 동료 1명이 존재하는가가 중요하다고 생각한다.

신입의 경우 정보를 습득하는 공간은 요즘IT, 코드너리, 커리어리, 번역 블로그, ChatGPT와 같은 인터넷을 이용하거나 스터디에 가입해 대화를 나누며 학습을 진행하자.

기타

TDZ? staleTime,cacheTime(react-query dev tool 활용)? api routes를 통한 react-query 데모 구성. webp(이미지 최적화)? 웹 바이탈 LCP 점수? amplify 배포?

학습: 2024.01.02

느낀 점: 다양한 이야기를 들었지만 react를 깊게 진행해보지 못한 나에게는 모르는 이야기들이 더 많았던 수업이었다.

개발?그거 어떻게 하는거야