NPM 고고학: 5년간 땅에 묻혀도, 아직도 숨 쉬고 있다
Source: Dev.to
Introduction
토요일이고, 특별히 일어나는 일도 없으며, 나는 디지털 고고학자처럼 오래된 GitHub 레포를 스크롤하고 있다. 버려진 주말 프로젝트를 열어 얼마나 엉망인지 확인해 보았다. 놀랍게도 핵심은 여전히 동작했다: 캘린더가 날짜를 올바르게 렌더링했고 클릭해도 크래시되지 않았다. “버려진 주말 프로젝트”라는 기준으로는 꽤 괜찮은 상태였다.
Migrating to TypeScript
첫 번째 진짜 도전은 코드베이스를 JavaScript에서 TypeScript로 옮기는 것이었다. 몇 년 동안 미뤄왔는데, TypeScript가 싫어서가 아니라(사실 정말 좋아한다) 기존 프로젝트를 마이그레이션하는 것이 마치 모든 게으른 지름길을 지적해 주는 엄격한 심판관을 추가하는 느낌이었기 때문이다. 어느 정도 시간이 지나 마이그레이션이 완료되었고, 프로젝트는 갑자기 더 견고해진 듯했다. 마치 등뼈가 생긴 것 같은 느낌이었다.
Bundle‑size Obsession
타입이 자리 잡자마자 번들 크기에 집착하게 되었다. 내 것이 아닌 바이트 하나하나가 눈에 거슬렸다. 목표는 외부 의존성 제로, gzipped 번들을 약 ~5–7 KB 수준으로 유지하는 것이었다. 이 숫자를 확인하는 빈도가 생각보다 많다.
Styling and Theming
처음에는 모든 스타일을 SCSS에서 goober라는 CSS‑in‑JS 라이브러리로 옮겼고, 삽입되는 코드가 약 1 KB 늘어났다. 이후 CSS Modules로 전환했는데, 더 깔끔하고 마음이 놓였다.
프로젝트는 이제 18개의 테마(다크, 라이트, 브루탈리즘, 파스텔, 네온 등)와 함께 제공된다. 이러한 테마를 효율적으로 관리하기 위해 CSS 변수 기반의 정식 테마 시스템을 설계했으며, 번들 크기를 최소화하면서 풍부한 시각 팔레트를 제공한다.
Internationalization
다국어 지원을 추가하려다 보니 패키지가 부풀어 오르던 차에, 네이티브 Intl API를 발견했다. Intl을 활용해 400개 이상의 로케일(월 이름, 요일 이름, 상대 시간 포맷 등)을 추가했으며, 추가적인 바이트, 사전, JSON 파일이 전혀 필요하지 않았다.
Build‑tooling Migration
빌드 파이프라인을 Rollup에서 tsup으로, 그리고 나중에 tsdown으로 마이그레이션했다. 빌드 툴 마이그레이션은 악몽이라는 평이 있지만, 집중적인 주말 코딩 2주 후에는 순조롭게 전환될 수 있었다.
Release v3.1.2
두 주 뒤, v3.1.2 버전이 다음과 같은 기능과 함께 출시되었다:
- 완전 모듈화된 컴포넌트: 시간 선택기, 월 그리드, 연도 선택기, 프리셋을 독립적으로 토글 가능
- CSS‑변수 시스템, 그라디언트, 색조를 포함한 18가지 테마
- Intl을 통한 400개 이상 로케일 지원
- 주 번호, 주말 강조, 스와이프 제스처, “젤리 모드”(묻지 말고 직접 써보세요)
- ~5.9 KB gzipped 번들
- 지속적인 접근성 개선
Community Response
다운로드 수가 월 약 100 건에서 100 건을 훨씬 넘게 성장했다. 사용자들이 이슈를 제기하고, PR을 제출하며, 가끔 긍정적인 피드백을 남긴다—예전보다 훨씬 활발한 참여다.
Reflections
오픈 소스는 언제나 나를 긴장하게 만들었지만, 이번에는 세상을 바꾸는 무언가를 만들려는 것이 아니라 좋은 무언가를 만들고자 하는 마음이 달랐다. 토요일에 지루함을 느끼며 무언가를 파헤치다 보면 의외로 우아한 해결책이 나오기도 한다.
react-calendar-datetime – 살펴보고 싶다면 확인해 보세요. PR, 이슈, 그리고 테마 컬렉션에 대한 부드러운 피드백을 언제든 환영합니다.