Discourse 같은 외부 플랫폼을 완전 마이그레이션 없이 CDN·WAF·봇 관리 계층으로 감싸는 아키텍처를 Vercel이 자사 커뮤니티 포럼에 직접 적용한 사례를 공개했다. 내부 호스트(실제 서버)와 외부 호스트(사용자 도메인)를 분리하고 특정 경로만 마이크로프론트엔드 프로젝트로 라우팅하는 점진적 현대화 전략이다.
핵심 포인트- vercel.ts의 rewrites 설정 하나로 모든 트래픽을 내부 Discourse 호스트로 프록시한다. 커스텀 헤더(x-proxy-secret)로 프록시 인증을 처리한다.
- microfrontends.json으로 특정 경로를 별도 Vercel 프로젝트로 라우팅해 프로젝트 단위 격리와 독립적인 환경 변수 관리를 구현한다.
- CDN 레이어에서 DDoS 공격 자동 차단, 악성 스크래퍼 차단(정상 크롤러는 허용), 쿠키 없는 익명화 Web Analytics를 동시에 처리한다.
- 마이크로프론트엔드를 3가지로 활용한다: Discourse 플러그인으로 구현 어려운 신기능 추가, 기존 페이지 재작성, 통합 인증(Sign in with Vercel).
- 완전한 플랫폼 교체 없이 경로 단위로 Next.js 기능을 점진적으로 추가하는 현대화 전략이다.
상세 정리- 아키텍처 구조: 내부 호스트(실제 Discourse 서버)와 외부 호스트(사용자 접근 도메인)를 분리한다. 모든 링크와 canonical URL은 외부 호스트를 가리켜야 한다.
- vercel.ts rewrites 설정: rewrites 배열에 모든 경로(/(.*))를 INNER_HOST 환경 변수로 재작성하는 규칙을 추가하고, 프록시 시크릿 헤더를 함께 전달해 인증한다.
- 마이크로프론트엔드 라우팅: microfrontends.json에서 /.well-known/workflow/:path*를 Workflow 이벤트·비디오 처리 프로젝트로, /live/:path*를 Next.js 기반 라이브 세션 프로젝트로 각각 라우팅한다.
- 프로젝트 분리의 장점: 복잡한 정규식 음수 매칭 없이 경로별로 독립 배포 파이프라인과 환경 변수를 가진다. 조직 권한도 프로젝트 단위로 분리된다.
- DDoS 방어: 방화벽이 지난해 여러 DDoS 공격을 자동으로 차단했다. 설정 변경 없이 CDN 레이어에서 처리된다.
- 봇 관리: 악성 스크래퍼를 차단하면서 Googlebot 등 신뢰할 수 있는 크롤러는 허용한다. 별도 설정 없이 플랫폼 수준에서 제공된다.
- Web Analytics: 쿠키 없이 익명화된 인구통계·참조 데이터를 제공한다. GDPR 컴플라이언스에 친화적이다.
- 마이크로프론트엔드 3용도: Discourse 플러그인으로 구현하기 어려운 새 기능 추가, 완전 커스터마이징이 필요한 기존 페이지 재작성, Sign in with Vercel을 통한 통합 인증 구현.
- 점진적 현대화: 기존 Discourse 투자를 유지하면서 필요한 경로에만 Next.js 마이크로프론트엔드를 붙인다. 큰 폭의 리팩토링 없이 단계적으로 현대화할 수 있다.
- 실제 운영 결과: Vercel Community 포럼이 이 아키텍처로 단일 도메인에서 Discourse 본체와 Next.js 마이크로프론트엔드를 함께 운영한다.
왜 읽나레거시 플랫폼(Discourse, WordPress 등)을 완전 교체 없이 CDN·보안·현대 프레임워크로 점진적으로 감싸야 하는 인프라·프론트엔드 엔지니어에게 실전 아키텍처 레퍼런스다.