[FE] 2024.11.06 회의록

주식 차트 관련 - 라이브러리 vs 직접 구현

처음에는 라이브러리 사용 후 직접 구현하려고 예정되었음

but, 멘토님 추천은 직접 구현 후 라이브러리 사용하는 게 좋을 듯 하다. why? 라이브러리 먼저 사용할 경우 직접 구현하려고 되돌아가는 게 쉽지 않음

→ 이번주 작은 주식 차트는 한 번 개인적으로 학습하고 어떻게 직접 구현할 수 있을 지 알아보자

주식 차트 관련 - 데이터

이동 평균선의 경우 계산 로직이 들어가는데 토스증권의 경우 서버에서 계산을 완료한 데이터를 전송하는 것으로 추정.

단순 이동 평균 계산 로직

서버 분들한테 언젠가 얘기할 필요가 있음

라이브러리 선택 이유 정리해보기

1. Vite

   • 웹팩과 비교해 빠른 초기 설정 가능.
   • 필요한 모듈만 번들링을 진행하기 때문에 전체 번들을 메모리에 넣는 웹팩에 비해 효율적.

2. React-Query

   • 자동 캐싱으로 불필요한 API 호출 감소
   • 서버와 클라이언트 간 데이터 동기화를 효율적으로 관리

3. Zustand

   • npm trends에서 상당한 성장세

   • 부스트캠프 진행 과정에서 자주 나왔던 키워드.

     → 이번 기회에 사용하며 학습할 수 있음.

4. React

   • 프론트엔드 팀원 모두 React를 사용할 줄 앎

     → 개발 생산성을 높이기 위해 선택

   • 풍부한 생태계 (관련 레퍼런스가 많음)

5. TailwindCSS

   • 효율적인 스타일링
   • 빠른 UI 구현

6. Heroicons

   • Tailwind CSS 개발자들이 만든 아이콘으로 디자인 일관성 유지
   • react-icons에 비해 경량화되어 있어 번들 사이즈를 줄일 수 있음

7. Typescript

   • 프로젝트 안정성 향상
   • 유지보수성 향상