리액트와 함께 쓰기좋은것

현재 리액트와 궁합이 맞는다고 생각된 라이브러리/프레임웤 들을 정리하는 포스트.
사실 그냥 내가 사용중인 stack을 정리하는..

기타/빌드

• typescript
  마이크로 소프트에서 만든 javascript 슈퍼셋 언어. 타입을 기본적으로 지정해야하기 때문에 자동완성등이 매우 잘된다. 그것만으로도 쓰기 좋음 (js + flow 를 사용하는것도 자주 비교된다.) 제너릭등 타입스크립트에만 있는 기능들도 많이 있음. 다만 @types 패키지를 따로 설치하는 부분과 그것마저 없는경우 *.d.ts 파일을 만들어 써야하는부분들이 제일 큰 불편.
  
• parcel
  webpack 과 비슷한 역할을 하는 모듈 번들러. webpack 대비 설정이 간편하고 캐싱을통해 핫리로드등이 별도 설정없이 빠르게 된다, 아직까지는 만족하면서 사용중.

상태관리

• redux
  Flux 구조에 기반한 다들 아는 그 상태관리 솔루션. MobX 와 자주 비교된다. 다만 대규모 어플리케이션이나 일반적인 사용례가 redux가 압도적으로 많기 때문에 많은 회사들이 redux 를 선택하여 사용중.
  
• redux-actions
  액션생성 / 핸들링을 도와주는 유틸리티성 라이브러리.
• redux-saga
  redux를 사용하다보면 http call 은 대체 어디서 해야하는건가. 라는 의문이 드는데 이런 사이드이펙트가 있는 서비스로직을 처리하기 위한 미들웨어.
• immer
  Immutablejs 와 자주 비교되는 불변성 상태트리 생성 라이브러리. Immutablejs 와 달리 기본 js type 들을 사용할 수 있고 사용법이 간단하여 좋다.

리액트용

• libreact
  리액트에서 재사용될 로직을 정리한 유틸성 HOC 세트
  
• styled-components
  CSS in JS 패러다임을 지탱하는 라이브러리. 기존 CSS/SCSS 문법을 사용할 수 있어서 편리하다.
• @blueprintjs/core
  데스크탑 어플리케이션에 초점이 맞추어진 ui components

범용 유틸리티

• axios
  Promise 기반 범용 Http 클라이언트 fetch와 자주 비교된다.
  관련 미디엄 포스트 : fetch-vs-axios-js-for-making-http-requests
• date-fns
  Date 를 제어하기위한 함수 모음 moment 대비 가볍고 필요한 부분만 임포트해서 사용이 가능하다. You-Dont-Need-Momentjs 이걸 보는것도 추천.
• cuid
  Collision-resistant ids 의 약자로 충돌저항적인 id를 빠르게 생성하는 간단한 유틸리티

프론트앤드

• normalize.css
  각 브라우저의 기본 스타일들을 일관성 있게 초기화해주는 역할을 한다.
• sass
  css 확장언어 이거아니면 어떻게 css를 작성할지..