언어: TypeScript
- 타입을 미리 지정해 오류를 미리 잡기 좋다.
- 에디터에서 쓸 수 있는 메소드 등을 미리 제시해주기 때문에 편하다.
- 종합적으로 생산성 향상에 도움을 주기 때문에 쓰는게 좋을 것 같다.
프레임워크: Next.js
- 간소화된 패킷 뿐만 아니라 webpack 설정 다수가 미리 되어있기 때문에 초기 설정이 간편하다.
- Router 설정 또한 미리 되어있기 때문에 별도의 프레임워크를 지정하지 않아도 된다.
전역 상태 관리: Redux Toolkit
- Redux는 React 전역 상태 관리의 기본이고, Redux Toolkit이 Redux보다 가볍기에 쓰기 좋을 것이다.
- 하지만 전역상태관리의 필요성에 따라 context API를 쓸 가능성도 있다.
디자인 패턴: Atomic Design
- 컴포넌트의 재사용성을 고려한 설계
- 설계 단계에서 기능 정의와 역할 분배를 완벽하게 해야 좋을 것 같다.
- 구체적으로 어떻게 컴포넌트들을 나눌지는 기능 정의 단계에서 설정하기로 합의
- 참고: 상권님 컨벤션
Emotion/Styled:
- emotion은 class에 css 정보가 담기기 때문에 inline-style로 담기는 styled와 달리 HTML이 깔끔하게 출력된다.
폴더 구조
- Style 영역을 컴포넌트 별로 명시하는 것이 보기 좋다.
- Storybook이 필요한 컴포넌트와 없는 컴포넌트를 구분해야한다.
- 컴포넌트 별로 폴더를 만들어 안에 소스와 stories, css 파일 등을 넣자.
이 외에 브레인 스토밍을 할 때 Figjam을 써보기로 함