Skip to content
ruok edited this page Dec 12, 2023 · 7 revisions

FE

사용 기술

  • React 18.2.0
  • Zustand
  • React Query
  • Tailwindcss
  • Typescript

React vs Vue vs Angular

React

  • 활발한 커뮤니티
  • 컴포넌트 위주의 개발

Vue

  • 낮은 러닝커브
  • 가벼운 번들 크기

Angular

  • 타입스크립트 기반 정적 타이핑

리액트의 러닝커브가 이미 어느정도 해결되어있고 개발시 마주칠 수 있는 문제를 해결하기 위해 활발한 커뮤니티의 정보의 도움이 필요해서 React를 선정했다.

Zustand의 장점

  • 낮은 러닝커브
  • 작은 번들 사이즈

Zustand는 복잡한 상태 관리가 필요 없는 작은 규모의 프로젝트에 적합한 가벼운 상태 관리 라이브러리이다. Redux에 비해 직관적으로 상태를 관리 할 수 있어 선택했다.

Tailwindcss

  • css 파일을 따로 작성하지 않아도 된다.
  • class 명을 짓는데 시간을 들이지 않아도 된다.
  • 개발 시간이 줄어든다

6주안의 짧은 시간안에 css 파일을 작성하는 시간을 줄이고자 tailwindcss를 도입했다.

typescript

  • 타입을 지정해서 컴파일 단계에서 타입을 검사할 수 있다.
  • 타입 지정에 따른 개발 시간 소요가 발생된다.

팀프로젝트 라는 특성상 타입의 혼선으로 인해 오히려 더 개발이 지연되고 버그가 발생 할 위험이 있어 타입스크립트를 도입했다.

디렉토리 구조

image

Clone this wiki locally