Quy Trình Dùng Claude Code Để Xây App Thật | Vibe Code Pro #1

#1Foundations Mình thử xây một portfolio web app hoàn chỉnh bằng Claude Code, từ file trắng đến ứng dụng có backend, database và một AI chat thật chạy bên trong. Không cần viết một dòng code nào, chỉ để hiểu từng bước đang xảy ra 😉 Đây là phần đầu của series Vibe Code Pro. Các tập sau sẽ đi sâu hơn vào sub-agent, hooks, skills, MCP. Tài liệu: https://github.com/tam1511/ClaudeCode... ➡️ Nếu bạn muốn tự thiết kế và xây dựng một AI agent từ đầu, mình có khóa học Agent thực chiến trên Udemy: https://www.udemy.com/course/ai-agent... ---------------------------------------------------------------------------------------------------- ⏰ Timestamps 0:00 - Intro 0:32 - Vibe coding 🧑‍💻 1:51 - IDE, Extension hay CLI - chọn cái nào 3:11 - Setup 8:11 - Context Engineering 9:06 - CLAUDE.md 9:46 - Context Window và giới hạn của LLM 10:36 - Compacting và rủi ro mất thông tin 14:05 - Dự án 1: Portfolio cho người sáng tạo nội dung 15:22 - Gặp Claude Code 19:39 - Đọc /context 21:52 - Thêm dữ liệu thật 22:56 - database, đăng nhập, ghi dữ liệu, nối UI 23:42 - Lấy API key từ OpenRouter và file .env 27:23 - Session, Checkpoint và Git 29:42 - Chủ động /compact 30:58 - Phase 8: làm sao biết model thật sự được gọi 31:23 - Phase 9: bắt AI trả lời có căn cứ 31:55 - Phase 10: Thêm công cụ cho AI 34:12 - Code review toàn diện 34:46 - RECAP 35:16 - Dùng coding agent miễn phí: OpenCode #claudecode #vibecoding #aiagent #nextjs #lậptrình