|
Claude Code Expert는 『클로드 코드 마스터 — 기획 · 개발 · 운영이 한 번에 끝나는 AI 에이전틱 코딩 워크 플로』의 공식 GitHub 조직입니다. 책에서 다루는 프로젝트 예제를 고도화 한 티켓기반 이슈트래커 SaaS입니다. 책에 수록된 모든 예제 코드, 참고 자료가 이 레파지터리에서 관리됩니다. 책 관련 문의 사항이나 프로젝트 관련 문의사항은 brewnet.dev@gmail.com으로 연락주시기 바랍니다. |
이 프로젝트가 도움이 되었다면, Star를 눌러 마음을 표현해 주세요! If you find this project helpful, please give it a Star to show your support!
Goal > Story > Feature > Task 계층으로 업무를 분해하고, 칸반 보드에서 드래그 앤 드롭으로 관리하는 티켓 기반 협업 도구로 WBS 관리나 멤버들의 일감 현황을 한 눈에 추적하고 관리할 수 있습니다. AI 분석 도구와 MCP를 통해 개발 단계에서 업무의 효율적인 등록관리, 상태변경, 자동화를 지원합니다. (개발 진행중)
공식 홈페이지 : https://tika-app.vercel.app
- 칸반 보드 — Backlog 사이드바 + TODO / In Progress / Done 3칼럼, 드래그 앤 드롭
- 티켓 관리 — CRUD, 4가지 타입(Goal/Story/Feature/Task), 우선순위, 시작·마감일, 체크리스트, 라벨, 댓글, 담당자 배정
- 이슈 계층 — Goal → Story → Feature → Task 상하위 연결
- 팀 협업 — 워크스페이스 초대 링크(24h 만료), 역할 관리(OWNER/MEMBER/VIEWER), WBS/간트 차트, 팀 대시보드(번다운·워크로드·통계)
- 알림 — Slack / Telegram 채널 연동, 마감일 D-1 자동 알림, 헤더 벨 드롭다운
- 검색 & 필터 — 실시간 검색, 필터 칩, 라벨·우선순위·날짜 범위 고급 필터
- 인증 — Google OAuth (NextAuth.js v5), 온보딩 워크스페이스 선택
랜딩 페이지
대시보드
칸반 보드
WBS
Project 분석
멤버 현황 분석
| Category | Technology | Version |
|---|---|---|
| Framework | Next.js (App Router) | 15 |
| Language | TypeScript (strict) | 5.7 |
| UI | React + Tailwind CSS | 19 / 4 |
| Drag & Drop | @dnd-kit | 6.x |
| ORM | Drizzle ORM | 0.38 |
| Database | PostgreSQL (Neon) | 14+ |
| Auth | NextAuth.js (Google OAuth) | 5.x |
| Validation | Zod | 3.24 |
| Deploy | Vercel | — |
npm install
cp .env.example .env.local
npm run db:migrate # DB 마이그레이션 적용
npm run dev # http://localhost:3000셀프 호스팅 전체 설치 절차(DB, OAuth, Cron, Vercel 배포)는 docs/INSTALL.md 를 참고하세요.
POSTGRES_URL=postgresql://...
NEXTAUTH_SECRET= # openssl rand -base64 32
NEXTAUTH_URL=http://localhost:3000
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
CRON_SECRET= # openssl rand -base64 32 ← 크론 인증 토큰(알림용)
SLACK_WEBHOOK_URL= # 문의 폼 → Slack 알림 (선택)- Google Cloud Console → APIs & Services → Credentials
- OAuth 2.0 Client ID 생성 (Web application)
- Authorized redirect URI:
http://localhost:3000/api/auth/callback/google
매일 KST 09:00 (UTC 00:00)에 내일 마감인 티켓 담당자에게 인앱 알림을 자동 발송합니다.
워크플로우 파일: .github/workflows/daily-notify.yml
매일 KST 09:00
↓
GitHub Actions 실행
↓
curl GET https://[APP_URL]/api/cron/notify-due
Authorization: Bearer [CRON_SECRET]
↓
내일 마감 티켓 담당자에게 인앱 알림 발송
CRON_SECRET은 외부에서 이 API를 무단 호출하지 못하도록 막는 인증 토큰입니다.
.env.local, Vercel 환경변수, GitHub Secret 세 곳의 값이 모두 동일해야 합니다.
아직 값이 없다면 터미널에서 생성합니다:
openssl rand -base64 32출력된 값을 복사해 .env.local과 Vercel 환경변수에 CRON_SECRET으로 등록합니다.
-
https://github.com/{owner}/{repo}/settings/secrets/actions접속 -
"New repository secret" 버튼 클릭 → 첫 번째 시크릿 입력:
Name: APP_URL Secret: https://your-domain.vercel.app→ Add secret 클릭
-
다시 "New repository secret" 버튼 클릭 → 두 번째 시크릿 입력:
Name: CRON_SECRET Secret: (1단계에서 생성한 값, .env.local의 CRON_SECRET과 동일)→ Add secret 클릭
-
목록에
APP_URL,CRON_SECRET두 개가 표시되면 완료
⚠️ Environment secrets가 아닌 Repository secrets에 추가해야 합니다. Settings → Secrets and variables → Actions 페이지의 "Repository secrets" 섹션을 확인하세요.
GitHub → Actions 탭 → Daily D-1 Notification 선택 → Run workflow 버튼으로 즉시 실행 가능합니다.
| Command | Description |
|---|---|
npm run dev |
개발 서버 |
npm run build |
프로덕션 빌드 |
npm run lint |
ESLint |
npm run format |
Prettier |
npm run db:generate |
마이그레이션 파일 생성 |
npm run db:migrate |
마이그레이션 적용 |
npm run db:studio |
Drizzle Studio (DB GUI) |
npm run db:seed |
시드 데이터 삽입 |
npm run test |
Jest 테스트 |
- GitHub에 Push → Vercel Import
- Environment Variables 등록 (위
.env.local항목 동일) - Google Cloud Console에 프로덕션 redirect URI 추가:
https://your-domain.com/api/auth/callback/google
버그를 발견했다면 GitHub Issues에 등록해 주세요.
-
Issues 탭 → "New issue" 클릭
-
아래 항목을 포함해 작성합니다:
항목 설명 제목 버그를 한 줄로 요약 (예: 칸반 보드에서 드래그 후 카드가 사라짐)재현 방법 버그가 발생하는 단계별 순서 기대 동작 원래 어떻게 동작해야 하는지 실제 동작 실제로 어떻게 동작했는지 환경 OS, 브라우저, 버전 등 스크린샷 가능하면 화면 캡처 첨부 -
Labels 에서
bug를 선택하고 제출합니다.
보안 취약점은 이슈 대신 이메일로 직접 제보해 주세요.
Apache 2.0