next-intl, 메타데이터, 사이트맵 생성 자동화로 다중 언어 지원

cesium-utils 경로에서 빠른 페이지 전환 시 앱이 종료되는 현상 발생: 전역 변수였던 viewer 를 route 마다 할당하고, async 가드를 설정하는 등으로 해결

웹 앱이 패키지 소스를 직접 사용하던 방식에서 빌드된 결과물을 사용하는 방식으로 전환, 이에 따른 CI 과정 업데이트

분리했던 UI 패키지를 다시 웹 앱에 통합, 리액트의 directive 를 유지하지 못하는 번들러의 한계 발견

Swagger/OpenAPI 사양을 따르는 API 에 대한 TypeScript 타입 생성 자동화 도입

Header 컴포넌트 재설계: langing page, 네비게이션 바, 화면 전환 마스킹의 세 가지 역할을 동시에 수행하는 state-driven 컴포넌트

@storybook/addon-vitest 애드온을 활용해 Storybook 과 Vitest 를 통합, UI 컴포넌트의 동작 단위 테스트를 단일화

타임라인의 컨텐츠 부분을 Next.js 의 parallel & intercepting route 패턴을 적용해 마크다운 parsing 을 분리, HTML 크기를 319 KB 에서 257 KB 로 약 19% 감소

Portfolio 영역을 Playground 로 재정의하고, 파일 기반의 dynamic routes 를 static 으로 변경하되 `cesium-utils` 페이지 구성을 참고하여 하나의 configuration 이 route 목록을 관리하도록 수정

파일 기준으로 route 를 생성하던 기존 방식에서 데이터베이스 기준으로 생성하도록 블로그 시스템을 개편, markdown 렌더링을 위한 커스텀 파이프라인 구현

Backend 서버를 추가로 관리하지 않기 위해 Prisma ORM 과 Neon 의 serverless PostgreSQL 데이터베이스를 통합

2001: 스페이스 오디세이의 모노리스(monolith)로부터 영감을 받은 디자인으로 프로젝트에 대한 타임라인 컴포넌트 구현

단위 테스트 라이브러리를 Jest 에서 Vite 로 이관하고, E2E 테스트를 위한 Playwright 추가

Next.js 의 private folder 패턴, route 로 제한한 context 등을 활용한 리팩토링으로 서비스의 이식성, 높은 응집성 및 관심사 분리 원칙 달성

Cesium 의 React 버전인 Resium 라이브러리를 걷어내고, Cesium 뷰어를 관리할 컴포넌트를 직접 구현해 1MB 의 번들 크기 감소

Next.js 의 multi-zone 을 활용한 MFE 아키텍쳐를 시도했으나, 약 77% 의 성능 저하 가능성을 확인하고 기존으로 되돌림

도커 이미지 크기 최적화(526MB 에서 346MB 로 약 34% 감소) 및 레이어 효율성 99% 달성

모듈 의존성 분석 및 lazy-loading 전략을 통해 66-72% 의 번들 크기 감소 달성

Vercel 배포 환경 및 standalone 빌드 옵션 제약으로 인해 패키지 매니저를 Yarn Berry PnP 에서 PNPM 으로 전환

기존 단일 어플리케이션을 모노레포 아키텍쳐로 전환하며 공유 패키지들을 분리

Yarn Berry 를 포함한 여러 개발 도구들을 사용한 단일 Next.js 어플리케이션 생성