Skip to content

기술스택

daeseong9388 edited this page Dec 18, 2022 · 27 revisions

Tech Stack

       

TypeScript

진정한 강자는 강타입 언어만을 사용한다.

  • 타입을 명시함으로써 컴파일 단계에서 오류를 확인할 수 있고, 타입 체크와 테스트 과정에 드는 비용을 줄일 수 있습니다.
  • 인터페이스를 먼저 정의해 내부 로직 구현과 인터페이스를 사용하는 다른 로직 구현을 병렬적으로 할 수 있습니다.

React

  • 팀원들 전체가 React 경험이 있어 짧은 개발 기간 내 기술에 대한 학습 비용을 줄일 수 있습니다.

styled-components

  • 컴포넌트와 스타일을 하나의 파일 안에 작성할 수 있어 관리가 용이해 생산성을 높일 수 있습니다.
  • JavaScript(TypeScript)를 사용해 CSS 조건문을 작성할 수 있어 효율적인 스타일 코드 작성이 가능합니다.
  • 테마 설정, 반응형 디자인 등을 고려하지 않았기 때문에 일관된 디자인에 용이한 Tailwind CSS을 사용했을 때 득보다 클래스 속성과 코드 길이가 길어져 가독성이 낮아진다는 실이 더 크다고 판단했습니다.

Jest

  • 코어 알고리즘이 복잡해 테스트 작성이 필요했고, 애자일한 프로젝트 특성과 제한된 프로젝트 기간을 고려했을 때 커뮤니티가 활성화 되어있고 러닝커브가 낮으며 별다른 configuration이 필요없는 Jest를 사용했습니다.

Vite

  • 기본적으로 typescript compiling, file loading을 지원해 Webpack보다 빠른 프로젝트 설정을 할 수 있습니다.
  • Vite의 빠른 번들링 속도로 인한 비용 감소가 학습 비용보다 클 것이라 판단했습니다.

Jotai

  • 추가적인 re-render 문제를 해결하는데 있어 React context보다 사용성이 뛰어나고 러닝커브가 낮은 Jotai를 선택했습니다.
  • 컴포넌트에서 복잡한 비동기 데이터 처리가 예상되는 프로젝트 특성상, React suspense를 지원하는 라이브러리를 선택했습니다.

Docker

  • 다양한 플랫폼에서 코드 환경을 동일하게 설정할 수 있어 올바른 코드 동작을 보장받을 수 있습니다.
  • tag로 이미지 version을 관리해서 문제 발생 시 rollback이 가능하게 견고한 프로젝트를 만들 수 있습니다.

GitHub Actions

  • Jenkins와 달리 별도의 서버 인스턴스를 구축할 필요가 없어 사용성이 좋습니다.
  • GitHub를 저장소로 사용하기 때문에, branch의 push, PR 등의 이벤트를 감지해 자동으로 코드를 실행시킬 수 있습니다.

💊 비타500

📌 프로젝트

🐾 개발 일지

🥑 그룹활동

🌴 멘토링
🥕 데일리 스크럼
🍒 데일리 개인 회고
🐥 주간 회고
👯 발표 자료
Clone this wiki locally