PC웹모바일웹CONCEPT즉시 구현 가능
B2B 거래 문서 다채널 발송 운영 콘솔
운영자가 다채널 발송 큐를 실시간 관제하고 실패 로그·재시도를 한 화면에서 처리하는 B2B SaaS 운영 콘솔. 다크 베이스 + 시안 액센트의 ⑤ Console / Technical 패턴으로 KPI·로그·코드 블록 시그니처를 통일했습니다.
본 시안은 의뢰 전 도메인 이해·UI 흐름을 검증한 개념 증명입니다. chamlab 표준 스택(Supabase + Next.js + Vercel)으로 1~2개월 내 실서비스 구현이 가능하며, 동일 스택의 자체 앱(chamlab-grow 등)에서 검증된 패턴입니다.
시안 의도
운영자가 한 화면에서 다채널 발송 상태를 관제하고 실패 건을 즉시 재시도할 수 있는 운영 콘솔 패턴 자산화. KPI·로그 뷰·코드 블록 카드 시그니처를 다른 발송·로그·DevOps 운영 도구 도메인에 그대로 재활용 가능한 형태로 정리했습니다.
시안 한계 · 주의
PDF 생성·다채널 발송 인프라는 도메인별 차이가 있어 본 시안은 운영 콘솔 UI 흐름 중심으로 구성했습니다. 실제 구현 시 SMTP·SMS·푸시 게이트웨이 통합과 큐 시스템(Redis/Realtime) 설계는 별도 단계입니다.
구현 스택
동일 시안을 실제로 구현할 때 사용하는 기본 스택입니다
웹 프론트엔드
Next.js + TypeScript
백엔드 / DB
Supabase (PostgreSQL)
이메일 발송
Resend (또는 SendGrid)
SMS 발송
국내 SMS 게이트웨이
푸시 알림
Firebase Cloud Messaging (FCM)
PDF 생성
Puppeteer 서버사이드 렌더링
큐 시스템
Redis 또는 Supabase Realtime
배포
Vercel + Supabase Edge Functions
시안 화면
주요 기능
- 발송 KPI 관제 — 오늘 발송·성공률·실패·재시도 대기 카드 + 채널별 성공률 바 차트
- 실시간 발송 큐 로그 — 처리중·대기·완료·실패 배지 리스트 + 코드블록 스타일 실패 트레이스 + 재시도 버튼
- 수신자 데이터 그리드 — 대량 필터·CSV 업로드·개별 발송 이력 드릴다운
- PDF 템플릿·다채널 발신자 설정 — SMTP·SMS 게이트웨이·푸시 통합 + 일괄 발송 스케줄
- 운영자 모바일 알림 — 실패 푸시 카드 + 채널별 실패 요약 + 빠른 일괄 재시도
- 수신자 문서 미리보기 — PDF 인라인 뷰 + 다운로드·수신 확인 추적
기술 스택
Next.jsTypeScriptSupabasePostgreSQLPuppeteerResendFCM
작업 범위
데스크톱 4화면모바일 2화면HTML 시안 + Playwright export
프로젝트 정보
- 유형
- 개념 시안 (CONCEPT)
- 타겟
- 운영자(콘솔) + 수신자(문서 수신·확인) 양면
- 핵심 기능
- 발송 큐 관제 + 다채널 발송 + 실패 추적·재시도
- 디자인
- ⑤ Console / Technical (다크 베이스 + 시안 액센트, 모노스페이스 시그니처)