Workflow thực chiến với Claude Code: Từ ý tưởng đến production trong 1 ngày
ISC Team
ISC Vibe Marketplace
Bạn có một ý tưởng sản phẩm. Sau 8 tiếng, app đã live trên production. Nghe có vẻ phi thực tế? Với Claude Code và workflow đúng đắn, đây là điều hoàn toàn khả thi — và bài viết này sẽ hướng dẫn bạn từng bước.
Phase 1: Chuẩn bị (30 phút)
Bước 1: Viết CLAUDE.md đầu tiên
Trước khi code bất cứ thứ gì, viết CLAUDE.md để Claude hiểu context dự án của bạn:
# Task Manager App
## Tech Stack
- Next.js 15 (App Router)
- TypeScript (strict mode)
- Supabase (auth + database)
- Tailwind CSS
## Conventions
- Tất cả components phải có TypeScript types
- Server Components mặc định
- Atomic Design: atoms/ molecules/ organisms/
- Import từ barrel exports
## Database
- Dùng Supabase client từ @/lib/supabase
- RLS đã được enable — không bypass
## Trước khi commit
1. npm run lint (phải pass)
2. npm run build (không có errors)Bước 2: Setup project
# Yêu cầu Claude setup project
"Setup Next.js 15 project với Supabase, TypeScript strict, Tailwind.
Tạo folder structure theo Atomic Design.
Setup environment variables template."Phase 2: Core Features (4-5 tiếng)
Bước 3: Database Schema First
Luôn bắt đầu từ data model. Mô tả schema bằng ngôn ngữ tự nhiên, Claude sẽ tạo SQL migrations:
"Tạo Supabase migration cho app task manager:
- Table tasks: id, title, description, status, priority, due_date, user_id
- Table projects: id, name, color, user_id
- Tasks thuộc về projects (foreign key)
- RLS: user chỉ thấy tasks/projects của mình
- Indexes cho performance: user_id, status, due_date"Bước 4: Implement theo từng feature
Đừng yêu cầu Claude build toàn bộ app một lúc. Chia nhỏ thành features độc lập:
Feature 1: "Build TaskCard component — hiển thị title, priority badge,
due date, checkbox để mark complete. Dùng atoms từ Button và Badge."
Feature 2: "Build TaskList với infinite scroll — fetch từ Supabase,
filter theo project/status, sort theo priority."
Feature 3: "Build AddTaskModal — form với validation, tích hợp
Supabase insert, optimistic update UI."Bước 5: Dùng /plan trước khi implement
Với features phức tạp, luôn ask Claude plan trước:
"Trước khi code, hãy lên plan chi tiết cho real-time collaboration feature:
- Cần những components nào?
- Data flow như thế nào?
- Supabase Realtime subscribe ở đâu?
- Edge cases cần handle?"
→ Review plan → Approve → "Giờ implement theo plan đã approve"Phase 3: Polish & Testing (2 tiếng)
Bước 6: Dùng Subagent để review
"Spawn một subagent để review toàn bộ codebase:
1. Security: RLS đã đúng chưa? Authentication vulnerabilities?
2. Performance: N+1 queries? Unnecessary re-renders?
3. Type safety: Any type ở đâu? Missing types?
Báo cáo findings và suggestions."Bước 7: Hook tự động cho quality
# Setup hooks để catch issues sớm
{
"hooks": {
"post-tool-use": [
{
"matcher": { "tools": ["Write", "Edit"] },
"handler": {
"command": "npm run lint --fix && npx tsc --noEmit"
}
}
]
}
}Phase 4: Deploy (30 phút)
Bước 8: Tạo /deploy skill
# ~/.claude/skills/deploy.md
# /deploy — Deploy to Production
## Checklist bắt buộc
1. [ ] npm run build — không có errors
2. [ ] npm run lint — pass
3. [ ] Kiểm tra env variables đã set trên Vercel
4. [ ] Review database migrations mới nhất
5. [ ] Xác nhận với user trước khi push
## Deploy command
vercel --prod
## Post-deploy
- Kiểm tra https://app.example.com
- Xem Vercel deployment logs
- Test auth flow trên production# Gọi khi sẵn sàng
/deployTips Quan Trọng Nhất
Commit thường xuyên. Sau mỗi feature nhỏ, ask Claude commit với message mô tả rõ ràng. Dễ rollback khi AI tạo ra lỗi.
- Một feature một lúc: Đừng yêu cầu quá nhiều thứ trong một prompt
- Review output: Đọc code quan trọng trước khi accept, đặc biệt security logic
- Lưu context: CLAUDE.md cập nhật khi dự án thay đổi
- Dùng /plan: Với features phức tạp, plan trước, code sau
- Test as you go: Setup Hooks để tests chạy tự động
Kết Quả Thực Tế
Với workflow này, một developer có thể:
- MVP trong 1 ngày làm việc (8 tiếng)
- Full-stack app với auth, database, UI trong 2-3 ngày
- Production-ready với testing và monitoring trong 1 tuần
Chìa khóa không phải là "làm ít hơn" — mà là focus đúng chỗ: Architecture, decision making, quality review. Còn implementation, Claude sẽ lo.