첫번째 PR Merge
이번 프로젝트의 첫번째 Pull reaquest가 merge 됐다. ✌️
react-table
이번 프로젝트에서는 표를 많이 사용한다. 단순한 표 뿐만 아니라 sorting, filtering, search 등 표의 부가적인 기능까지 많이 들어갈 예정이다. 그래서 표를 처음부터 다 구현하기보다는 라이브러리를 찾아보았다.
이 사이트에서 나열해놓은 Top 3를 주로 비교했다. 먼저 npm trends에서는 react-table의 이용자수가 압도적으로 많은 것을 알 수 있었다. 나는 보통 라이브러리 선정에 있어, 이용자 수를 중요하게 본다. 이용자수가 많은 만큼 정보도 많을 것이고 이슈 사항에 대한 피드백도 많을 것이라고 생각했기 때문이다.
두번째로 본 것은 "자유로운 커스터마이징이 가능한가?" 이다. 우리 서비스는 상용 서비스가 될 것 이기 때문에 우리의 기획과 디자인을 제약없이 적용할 수 있어야 한다.
material-table은 material-UI를 기반으로 나온 라이브러리이기때문에 안정성이나 이용자수도 적지 않았지만 특유의 material 느낌이 너무 진했고, 또한 css 커스터마이징에서 제약이 있었다.
가장 마음에 들었던 것은 react-table이였다. doc을 보니 react-table은 headless 유틸리티 라고 칭하고 있다. headless 유틸리티란, 라이브러리 자체적으로 어떤 디자인요소도 적용되어 있지 않고 사용자가 모든 디자인을 자유롭게 적용할 수 있는 것을 의미하는 듯 했다.
위 두가지 이유만으로도 react-table을 사용해야 겠다는 생각이 들었다. 다만 react-table을 사용하겠다고 결정하고 나서 추가적으로 고려해본 것은 typescript 지원여부 였다.
타입스크립트를 공식적으로 지원하진 않는 것 같다. 다만, V7에 이르러서 어느 정도 타입에 대한 지원을 하고 있는 듯 하다. 일단 아래의 솔루션에 따라 type을 지정하면 typescript 환경에서도 문제 없이 (?) 사용 할 수 있다.
마지막으로 고려한 것은 제공해주는 document가 얼마나 친절한가? 인가. 일단 doc 은 굉장히 친절한 것 같다. api의 사용법이라던가, example을 직접 제공하여 어렵지 않게 하나씩 구현해볼 수 있었다.
이런 것들을 종합적으로 고려했을 때, react-table을 사용하기로 결정했다. 이 라이브러리에 대한 학습 회고는 지속적으로 포스팅 할 예정이다.
