채택 스택
- React + typescript
- React Suspense 도입 고민
- emotion
style
- scss의 익숙함보다 emotion을 통한 컴포넌트의 구분을 명확히하고, props를 활용한 스타일 패턴의 장점을 가져가기 위해 선택
- context api
상태관리
- 추후 어려움 발견 시 react-query 도입 검토
- 경험하지 못한 문제점을 해결하기 위한 스택을 선택하기 보다는 가장 기본에 가까운 스택을 사용하고, 이후 문제를 만나게 된다면, 그것을 가장 잘 해결할 수 있는 다른 스택을 고려해보는 것으로 결정
storybook, 테스트- 스토리북은 컴포넌트의 prop이나 상태가 다양하지 않고, 공통적으로 사용 가능한 base컴포넌트를 설계하지 않고 있기 때문에 사용의 효용성이 많이 떨어진다고 판단
- 테스트 스택의 경우 2주라는 짧은 시간안에 도입하기에 어려움이 있을 것이라고 판단하였고, 복잡한 수치로직(random함수)의 경우에만 작성 고민하는 것으로 결정
도입 가능한 스택들 리스트업
베이스 스택
- Vue or React
- typescript
- storybook
- 테스트 스택
스타일 관련 스택
- scss
- 익숙함
- styled-component
- emotion
- file관리 깔끔
- props를 통한 스타일 처리 가능
상태관리
- context api
- 경험하지 못한 문제점을 해결하기 위한 스택을 선택하기 보다는 가장 기본에 가까운 스택을 사용하고, 이후 문제를 만나게 된다면, 그것을 가장 잘 해결할 수 있는 다른 스택을 고려해보는 것으로 결정
- redux
- recoil
- react-query
- useswr
Data요청
- fetch
- axios
Context API 사용 방식
- dispatch ( useReducer)
- hook ( useContext)
로딩 관련
- React.Suspense