Node.js 공식 웹사이트가 Metalsmith/Handlebars에서 Next.js/React로 마이그레이션하면서 월 30억 건의 요청을 처리하는 1600+ 페이지 사이트를 무중단으로 재구축

Context

Node.js 공식 웹사이트는 14년 이상 운영되면서 1600+ 페이지, 월 30억 건의 요청, 2 petabytes의 데이터 전송을 처리하는 핵심 커뮤니티 리소스가 되었다. 기존 Metalsmith 및 Handlebars 기반 아키텍처는 기술 부채가 쌓여 코드 확장성이 낮고 내부 문서화가 부족했으며, 2019년 별도 저장소(nodejs.dev)에서 시작한 첫 번째 재설계 시도는 개발팀의 분리로 인한 기여자 참여 저하와 복잡한 전환 리스크로 인해 실패했다.

Technical Solution

• 리포지토리 통합 전략: 별도 저장소에서의 실패 교훈을 바탕으로 기존 nodejs.org 저장소 내에서 점진적 재설계 진행, 기여자 워크플로우와 커뮤니티 중심성 유지
• 기술 스택 선택: Nextra(Next.js 정적 사이트 생성기)에서 시작했으나 확장성 한계로 인해 Next.js로 직접 마이그레이션, React 컴포넌트 기반 저작으로 현대적 개발 경험 제공
• 정적 빌드 + 동적 업데이트: Next.js의 Incremental Static Regeneration을 활용해 릴리스 같은 동적 콘텐츠를 자동 감지하면서도 최종 사용자 속도와 호스팅 독립성 유지
• 무중단 마이그레이션 검증: 2023년 4월 축소된 전환 작업으로 1600개 파일을 한 번에 병합하는 Pull Request를 실행, 프로덕션 환경에서 사이트 외형·내용·저작 경험 변화 없이 인프라만 교체
• 디자인 시스템 구축: Figma 기반 설계 문서에서 다크/라이트 모드, 모바일 반응형, 컴포넌트 변형을 정의하고 구성 요소별 계층 구조로 순차적 구현

Impact

아티클에 재설계 후의 정량적 성능 수치가 명시되지 않았다.

Key Takeaway

대규모 프로덕션 웹사이트의 기술 부채 해결 시 병렬 저장소 개발보다는 기존 저장소 내 점진적 전환이 기여자 참여와 프로젝트 지속성을 크게 향상시킨다. 또한 전체 스택 교체를 한 번에 시도하기보다는 중간 프로토타입(Nextra)으로 검증한 후 최종 기술(Next.js/React)로 진행하면 리스크를 미리 식별하고 팀의 역량을 균형 있게 구축할 수 있다.