라이브러리는 개발 편의를 위한 도구의 모음이다. 이와 자주 등장하는 용어인 프레임워크는, 라이브러리보다 더 큰 개념과 구조를 갖고있다. 라이브러리는 개발자가 더 나은 개발을 위해 도움을 주는 공구의 느낌이고, 프레임워크는 개발자가 좋은 환경에서의 개발을 위한 공장 자체를 제공해주는 느낌이다.
각각의 라이브러리 종류는 작거나 크거나 등의 크기나, 핸들링하거나 지원하는 기능의 종류의 다양성의 차이가있다. 그러나 근간은 개발자들이 더 개발을 편하게 해주고, 핸들링하게 해줄 수 있는 도구임은 동일하다,
이 블로그에서 주로 다루고있는 react는 프레임 워크같이 거대한 개발 환경을 제공하지만, react는 공식적으로 라이브러리를 지향한다고 한다. 개발의 유연성과 자유성을 주기 위해서라고 한다. JSX 문법 / state 관리 / 최적화 렌더링 / 성능 확인 등의 기능을 제공해준다.
하지만 위의 기술을 가지고는 완벽하고 신속한 웹 애플리케이션을 만들기에는 한계가 있다. react와 함께 추가적으로 사용되는 라이브러리가 무수히 많으며, 개발자들은 이러한 잘 만들어둔 도구들을 가져다가 쓰면서 react 생태계의 이점을 누려야 한다.
라이브러리 적용의 과정
그렇다면 내가 어떤 라이브러리가 필요하고 적용을 어떻게 시켜야 하는걸까? 당연히 순서와 과정이 존재한다
라이브러리 적용 과정
필요 > 검색 > 기능 파악 > 적용
-
필요성
개발자가 개발을 하다가, 어떤 특정한 기능이 필요해질 순간이 온다. 하지만 직접 구현하기에는 제약이 많이 따라온다. 혹은 기존 A 라이브러리를 쓰고 있다가, 최신 트렌드에 어울리는 다른 B 라이브러리가 필요할 수도 있다. -
기준 정하기
라이브러리를 고르는 기준은 다양하다
기능 / 성능 / 번들 사이즈 / tree shaking / 문서 가독성 / 인기 / 최신 여부 / 관리 주체 등이 있다.
- 검색하기
문제에 맞는 적절한 라이브러리를 찾는다.
라이브러리에 대한 정보는 github / npm trends / 커뮤니티 등을 통해 찾아볼 수 있다.
- github - 오픈소스 라이브러리이며 다양한 코드들을 찾을 수 있다.
- npm trends - 유사한 라이브러리 후보들에 대한 기능, 성능, 사이즈, 인기도, 최신여부 등의 정보를 비교할 수 있다.
- bundlepobia - 각 라이브러리들에 대한 크기를 알려준다.
react 라이브러리의 종류에는 대표적으로 Date / 스타일링 / UI / 애니메이션 / 데이터 모킹 / 상태관리 / 데이터 패칭 / SSR / Query 등이 존재한다.
전반적으로 react와 밀접하게 관련된 라이브러리도 있고, 그렇지 않은 라이브러리도 있다. react를 개발하면서 "나는 이 한 가지 라이브러리만 사용할거야! 이것만 공부해야지!" 는 올바른 자세가 아니다.
다양한 라이브러리를 테스트 해보면서 각각의 장단점을 인지한 체 사용하는 것이 중요하다. 또한 내가 사용하는 라이브러리가 나중에 취업을 하거나 협업을 할 때, 내 것을 사용하지 않고 새로운 라이브러리를 도입하는 경우도 있다. 때문에 이 블로그에선 보다 다양한 라이브러리를 다루고자 한다.
더 좋은 라이브러리를 고르는 기준?
react를 활용할 때, 더 좋은 라이브러리를 선택하는 기준은 여러 가지 요소들을 고려해야 한다. 주요 기준이 될 수 있는 항목은 아래와 같다.
-
기능과 요구사항
프로젝트의 기능과 요구사항에 가장 적합한 라이브러리를 선택하는 것이 중요하다. 각각의 라이브러리들은 사용 목적과 그들만의 철학이 있다. 프로젝트의 목적과 범위에 맞게 선택해야 한다. -
유지보수와 커뮤니티 지원
해당 라이브러리가 활발하게 유지보수되고 있는지, 커뮤니티에서 지원이 활발한지 확인해야 한다. 잘 지원되지 않는 라이브러리는 버그 수정과 보안 취약점 해결이 늦어질 수 있으며, 업데이트를 받을 수 없는 상황이 발생할 수 있다. 지원인 중단된 대표적인 라이브러리는 Date 라이브러리인 moment.js가 있다. -
성능
대규모 데이터를 다루는 경우 성능 최적화가 필요할 수 있다. react 컴포넌트의 라이프사이클, 가상 DOM, 렌더링 최적화 등이 성능에 영향을 미치는 요소이다. -
적용 난이도
라이브러리의 사용 난이도도 고려해야 한다. 일부 라이브러리는 간단하게 적용할 수 있지만, 다른 라이브러리는 더 복잡한 설정과 사용법이 필요할 수 있다. 팀의 기술 수준과 프로젝트의 단기/장기적 목표를 고려해야 한다. -
인기도와 사용 사례
라이브러리의 인기도와 다른 프로젝트에서의 사용 사례를 확인해보는 것도 도움이 된다. npm trends 사이트를 통해 각각의 라이브러리들의 인기도를 시간별로 비교하는 것을 추천한다.
중요한 것은 라이브러리를 찾고 적용하는 과정을 익혀 혼자 할 수 있는 힘을 기르는 것이다.
