중앙 관리자 플랫폼 — 여러 도메인을 한 허브에서

여러 도메인 (블로그·마켓·앱·외부 SaaS) 을 운영하는 팀은 매 도메인마다 관리자 UI 를 따로 만들기 쉽습니다. 단기적으로는 빠르지만 3~6개월만 지나면 운영자가 페이지마다 UI 를 다시 배우고 개발자는 같은 boilerplate 를 반복합니다. 이 강좌는 한 Next.js 앱이 여러 PostgreSQL 풀 (도메인 DB) 에 직접 접속해 CRUD · 감사로그 · 백업 · OAuth 까지 감당하는 허브 구조를 8 단계로 따라갑니다.

누구를 위한 강좌인가

• 여러 사이드프로젝트 · 서비스를 하나의 관리자 허브 로 묶고 싶은 분
• React 19 + Next.js App Router 를 실전 규모로 써 보고 싶은 분
• 감사로그 · OAuth · 백업 자동화 등 "운영에 필요한 공통 기능" 을 한 번에 익히고 싶은 분

다 끝내면 가능한 것

• PostgreSQL 여러 풀을 한 앱에서 직접 orchestration
• AdminResourceTable 공통 컴포넌트로 페이지당 30~70 줄로 CRUD 구현
• logAdminAction fire-and-forget 감사로그 패턴
• 카카오 · 네이버 OAuth 2 provider + 이메일 화이트리스트
• pg_dump + cron 자동 백업 + 7일 rolling retention
• Playwright 매니페스트 자동 생성으로 수십 페이지 smoke 1 초 spec

단계 흐름

[1] 동기 ──▶ [2] 셋업 ──▶ [3] 여러 풀 ──▶ [4] 공통 테이블
                                                │
                                                ▼
[8] E2E 매니페스트 ◀── [7] 백업 ◀── [6] 감사로그 ◀── [5] OAuth + 화이트리스트

전반부 (14) 는 기반 — 왜 모았고 어떻게 연결하는지. 후반부 (58) 는 운영 — 권한 · 추적 · 안정성.

단계 구성

1. 왜 중앙 허브인가 — 도메인 N + 관리자 UI N 의 비용, 한 곳으로 묶었을 때의 이득
2. 프로젝트 셋업 — Next 16 + TypeScript strict + shadcn/ui + Tailwind 4
3. 여러 PostgreSQL 풀 연결 — 환경변수 규약 · 풀 싱글톤 · 쿼리 헬퍼
4. AdminResourceTable SSOT — 공통 테이블 컴포넌트 · iconColor 맵 · 페이지네이션 URL-first
5. OAuth 2 provider + 화이트리스트 — 카카오 · 네이버 · JWT 세션 쿠키
6. 감사로그 (logAdminAction) — audit_logs 테이블 · reason 30자 강제 · 도메인별 viewer
7. 백업 자동화 — pg_dump + node-cron + 화이트리스트 테이블 30개
8. E2E 매니페스트 + 배포 — Playwright 자동 매니페스트 + Docker standalone 배포

전제 — getting-started 강좌 + Node 20 / PostgreSQL 15 / Docker · nextjs-fullstack 강좌 (App Router 기초).