2주에 한 편, 블로그 글을 쓰며 함께 성장하는 스터디 플랫폼. 웹 대시보드 + Discord 봇으로 스터디 운영을 자동화합니다.
graph TB
subgraph Client["사용자"]
BROWSER["브라우저 / PWA"]
end
subgraph Web["Web · Vercel"]
NEXT["Next.js 16<br/>App Router"]
API["API Routes"]
FCM_WEB["FCM Push"]
end
subgraph Bot["Bot · AWS EC2"]
DISCORD_BOT["discord.js v14"]
SCHEDULER["pg-boss<br/>스케줄러"]
BOT_API["Express API<br/>수동 트리거"]
end
subgraph Infra["인프라"]
SUPABASE["Supabase<br/>PostgreSQL + Auth"]
FIREBASE["Firebase<br/>Cloud Messaging"]
SENTRY["Sentry<br/>Error Tracking"]
DISCORD["Discord Server"]
end
BROWSER --> NEXT
NEXT --> API
API --> SUPABASE
FCM_WEB --> FIREBASE
FIREBASE -->|push| BROWSER
DISCORD_BOT <-->|WebSocket| DISCORD
SCHEDULER --> SUPABASE
API -->|트리거| BOT_API
BOT_API --> SCHEDULER
NEXT --> SENTRY
DISCORD_BOT --> SENTRY
| 영역 | 기술 |
|---|---|
| Frontend | Next.js 16, React 19, Tailwind CSS v4, shadcn/ui, Framer Motion |
| Backend | Next.js API Routes, Supabase Auth (Discord OAuth) |
| Bot | discord.js v14, pg-boss (Job Queue), feedsmith (RSS) |
| Editor | Tiptap (리치 에디터), sonner (토스트) |
| DB | PostgreSQL (Supabase) + Drizzle ORM |
| Push | Firebase Cloud Messaging (FCM) |
| Monitor | Sentry (에러 모니터링 + PII 스크러빙) |
| Deploy | Vercel (Web), AWS EC2 Docker (Bot), Supabase (DB) |
| CI/CD | GitHub Actions → ECR → SSH deploy (Bot), Vercel Git (Web) |
packages/
├── shared/ # DB 스키마, 타입, 유틸 (Drizzle ORM)
├── bot/ # Discord 봇 (스케줄러 + 이벤트 핸들러)
└── web/ # Next.js 대시보드 (사용자 + 관리자)
모노레포: pnpm workspace
- 대시보드 — 현재 회차, 출석 상태, 활동 점수, 최근 포스트
- 포스트 피드 — 스터디원 블로그 글 모아보기, 댓글/비밀댓글, 조회수
- 랭킹 — 활동 기반 실시간 랭킹
- 커뮤니티 게시판 — 공지/건의/후기/지식공유/일상, 댓글/비밀댓글/투표
- 프로필 — 활동 내역, 알림 설정, 소셜 링크
- PWA 푸시 알림 — 댓글/답글/공지 알림
- RSS 자동 수집 — 블로그 글 발행 시 자동 감지 및 수집
- 출석 자동화 — 2주 1회차, 지각/결석 자동 판정
- 벌금 관리 — 자동 부과, DM 리마인드
- 주간 랭킹 — 매주 활동 점수 랭킹 디스코드 공유
pnpm install # 의존성 설치
pnpm dev:web # 웹 개발 서버 (localhost:3300)
pnpm dev:bot # 봇 개발 서버
pnpm build # 전체 빌드
pnpm typecheck # 타입 체크
pnpm lint # 린트.env.example 참조. 두 곳에 설정 필요:
.env.local— 루트 (shared/bot용)packages/web/.env.local— Next.js용
| 문서 | 설명 |
|---|---|
| ARCHITECTURE.md | 시스템 아키텍처 (Mermaid 다이어그램) |
| 기술 결정 | 기술 선택 근거 (ADR) |
| UI 디자인 시스템 | UI 스펙 |
| 개발 환경 | 개발 환경 설정 |
| DB 스키마 | 테이블/Enum/FK 요약 |
| API 패턴 | API 코드 규칙 |
| 온보딩 | 팀 온보딩 가이드 |