fix: sync all translated READMEs with root README and add proper translations

- Sync en-US/README.md with root README.md (path adjustments)
- Translate zh-TW to proper Traditional Chinese (was mixed simplified)
- Translate ja-JP body content to Japanese (was Chinese)
- Translate ko-KR body content to Korean (was Chinese)
- Translate es-ES, fr-FR, ar-SA, vi-VN, de-DE body content
- Add missing banner image to all translations
- Add missing sections: User Research appendix, Major Projects,
  Claude Agent SDK, Spec Coding, Other Courses, etc.
- Ensure consistent structure across all 10 language versions

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
sanbuphy
2026-05-17 14:31:28 +08:00
parent 339b24fd95
commit d2f6bd7504
9 changed files with 2031 additions and 2225 deletions
+246 -283
View File
@@ -3,6 +3,8 @@
<img src="../../assets/easy-vibe-logo-hd.svg" alt="Easy-Vibe Logo" width="300">
<img src="../../assets/banner.png" alt="Easy-Vibe Banner" width="100%">
<p align="center" style="font-size: 1.2em; color: #666; margin: 20px 0;">
Bat dau ngay va cung vibe nao. Chi can ban noi duoc, ban da co the lam app.<br>
<span style="font-size: 0.9em; color: #888;">直接上手,一起 vibe!会说话就会做应用。</span>
@@ -11,16 +13,16 @@
<a href="https://trendshift.io/repositories/22079" target="_blank"><img src="https://trendshift.io/api/badge/repositories/22079" alt="datawhalechina/easy-vibe | Trendshift" style="width: 250px; height: 55px;" width="250" height="55"/></a>
<p align="center">
🚀 <a href="https://datawhalechina.github.io/easy-vibe/welcome.html">Bat dau ngay</a> · ✨ <a href="https://datawhalechina.github.io/easy-vibe/en/appendix/">Huong dan tuong tac</a> · 🦞 <a href="https://github.com/datawhalechina/hello-claw">Hoc OpenClaw</a><br>
🚀 <a href="https://datawhalechina.github.io/easy-vibe/welcome.html">Bat dau kham pha</a> · ✨ <a href="https://datawhalechina.github.io/easy-vibe/en/appendix/">Huong dan tuong tac</a> · 🦞 <a href="https://github.com/datawhalechina/hello-claw">Hoc OpenClaw</a> · 📖 <a href="#table-of-contents">Muc luc</a><br>
<span style="font-size: 0.85em; color: #888;">🚀 <a href="https://datawhalechina.github.io/easy-vibe/welcome.html">开始体验</a> · ✨ <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/">交互式教程</a> · 🦞 <a href="https://github.com/datawhalechina/hello-claw">学习 OpenClaw</a> · 📖 <a href="#table-of-contents">查看目录</a></span>
</p>
<p align="center">
<a href="https://datawhalechina.github.io/easy-vibe/welcome.html">Bat dau doc</a> ·
<a href="https://datawhalechina.github.io/easy-vibe/welcome.html">Doc truc tuyen</a> ·
<a href="#-content-navigation">Lo trinh hoc</a><br>
<span style="font-size: 0.85em; color: #888;">
<a href="https://datawhalechina.github.io/easy-vibe/welcome.html">开始阅读</a> ·
<a href="#-内容导航">学习地图</a>
<a href="#-content-navigation">学习地图</a>
</span>
</p>
@@ -34,9 +36,9 @@
</p>
<p align="center">
<a href="../../README.md"><img alt="English" src="https://img.shields.io/badge/English-d9d9d9"></a>
<a href="../zh-CN/README.md"><img alt="简体中文" src="https://img.shields.io/badge/简体中文-d9d9d9"></a>
<a href="../zh-TW/README.md"><img alt="繁體中文" src="https://img.shields.io/badge/繁體中文-d9d9d9"></a>
<a href="../en-US/README.md"><img alt="English" src="https://img.shields.io/badge/English-d9d9d9"></a>
<a href="../ja-JP/README.md"><img alt="日本語" src="https://img.shields.io/badge/日本語-d9d9d9"></a>
<a href="../es-ES/README.md"><img alt="Español" src="https://img.shields.io/badge/Español-d9d9d9"></a>
<a href="../fr-FR/README.md"><img alt="Français" src="https://img.shields.io/badge/Français-d9d9d9"></a>
@@ -52,395 +54,357 @@
<td width="50%" valign="top" align="center">
<img src="../../assets/gif-header.png" width="100%">
<br>
<strong>新手专属学习地图</strong>
<strong>Lo trinh hoc cho nguoi moi</strong>
<br>
<sub>零基础专属指引,清晰规划路径,告别“学了忘”</sub>
<sub>Huong dan ro rang tu con so khong, giup ban ngung "hoc roi quen"</sub>
</td>
<td width="50%" valign="top" align="center">
<img src="../../assets/gif-tutorial.png" width="100%">
<br>
<strong>手把手图文教程</strong>
<strong>Huong dan truc quan tung buoc</strong>
<br>
<sub>保姆级图文详解,如同私教在旁,跟着做就能学会</sub>
<sub>Chi tiet tung buoc nhu hoc voi gia su rieng</sub>
</td>
</tr>
<tr>
<td width="50%" valign="top" align="center">
<img src="../../assets/gif-ide.gif" width="100%">
<br>
<strong>沉浸式模拟编程</strong>
<strong>Lap trinh mo phong hap dan</strong>
<br>
<sub>虚拟鼠标自动导览,带你快速上手 IDE 核心用法</sub>
<sub>Chuot ao huong dan giup ban nhanh chong lam quen voi quy trinh IDE co ban</sub>
</td>
<td width="50%" valign="top" align="center">
<img src="../../assets/gif-diffusion.gif" width="100%">
<br>
<strong>看得见的 AI 原理</strong>
<strong>Nguyen ly AI co the nhin thay</strong>
<br>
<sub>算法原理动画化,一眼看懂 AI 如何“画”出图片</sub>
<sub>Giai thich bang hoat anh giup ban de hieu cach AI tao hinh anh</sub>
</td>
</tr>
<tr>
<td width="50%" valign="top" align="center">
<img src="../../assets/gif-rag.gif" width="100%">
<br>
<strong>像玩游戏一样学 RAG</strong>
<strong>Hoc RAG nhu choi game</strong>
<br>
<sub>独家交互组件,点击即可看清 RAG 数据流向</sub>
<sub>Thanh phan tuong tac giup ban click qua toan bo luong du lieu RAG</sub>
</td>
<td width="50%" valign="top" align="center">
<img src="../../assets/git-terminal.gif" width="100%">
<br>
<strong>可视化终端原理</strong>
<strong>Khai niem terminal truc quan</strong>
<br>
<sub>命令行操作可视化,直观展示后台逻辑与原理</sub>
<sub>Hanh vi dong lenh tro nen truc quan khi logic ben duoi duoc hinh hoa</sub>
</td>
</tr>
</table>
<div align="center">
<h3>⭐ 欢迎 <a href="https://github.com/datawhalechina/easy-vibe" style="color: #d0cd16ff;">点击此处Star</a> 加速更新 ❤️</h3>
<h3>⭐ <a href="https://github.com/datawhalechina/easy-vibe" style="color: #d0cd16ff;">Nhan Star cho repo tai day</a> de giup tang toc cap nhat ❤️</h3>
</div>
<div align="center" style="margin: 30px 0;">
<a href="https://github.com/datawhalechina/easy-vibe/issues/new?template=story_submission.md">
<img src="https://raw.githubusercontent.com/datawhalechina/easy-vibe/main/assets/stories_image.png" alt="Share Your Vibe Story" width="80%" style="border-radius: 10px; box-shadow: 0 4px 12px rgba(0,0,0,0.15);">
<img src="https://raw.githubusercontent.com/datawhalechina/easy-vibe/main/assets/stories_image.png" alt="Chia se cau chuyen Vibe cua ban" width="80%" style="border-radius: 10px; box-shadow: 0 4px 12px rgba(0,0,0,0.15);">
</a>
<p style="margin-top: 15px; font-size: 1.1em; color: #666;">
📝 <strong>Have your own vibe coding story?</strong>
Submit it here and inspire others!
📝 <strong>Ban co cau chuyen vibe coding rieng?</strong>
Gui tai day va truyen cam hung cho nguoi khac!
</p>
</div>
## 为什么需要 Easy-Vibe
## Muc luc
Muốn làm app ghi chép thu chi? Chỉ cần nói ra.
- [Tai sao can Easy-Vibe](#tai-sao-can-easy-vibe)
- [Tin tuc](#-tin-tuc)
- [Danh cho ai](#danh-cho-ai)
- [Lo trinh hoc cua ban](#lo-trinh-hoc-cua-ban)
- [Loi khuyen hoc](#loi-khuyen-hoc)
- [I. Nhap mon nguoi moi](#i-nhap-mon-nguoi-moi)
- [II. Lap trinh vien trung cap](#ii-lap-trinh-vien-trung-cap)
- [III. Lap trinh vien cao cap](#iii-lap-trinh-vien-cao-cap)
- [Phu luc Co so kien thuc](#-phu-luc-co-so-kien-thuc)
- [Cach hoc](#-cach-hoc)
- [Chay cuc bo](#-chay-cuc-bo)
- [Cac khoa hoc khac](#cac-khoa-hoc-khac)
- [Dong gop & Nguoi dong gop](#dong-gop--nguoi-dong-gop)
- [LICENSE](#-license)
Cần một hệ thống đặt lịch có đăng nhập WeChat? Chỉ cn nói ra.
## Tai sao can Easy-Vibe
Mun có blog kèm bình luận? Ch cn nói ra.
Muon lam app ghi chep thu chi? Chi can noi ra.
Trong thời đại AI, lập trình bắt đầu từ việc mô tả điều bạn muốn.
Can mot he thong dat lich co dang nhap WeChat? Chi can noi ra.
Easy-Vibe giúp bạn biến điều đó thành một sản phẩm thật.
Muon co blog kem binh luan? Chi can noi ra.
Trong thoi dai AI, lap trinh bat dau tu viec mo ta dieu ban muon.
Easy-Vibe giup ban bien dieu do thanh mot san pham that.
## 🔥 News
- **[2026-03-29]** ✨ **Ra mắt mục câu chuyện ngưởi dùng và cập nhật bằng 4 trường hợp có thật**: Chúng tôi thêm carousel tương tác và các trang câu chuyện riêng trên trang chủ, rồi thay nội dung tạm bằng bốn câu chuyện thật từ một giáo viên tiểu học vùng quê, một sinh viên đại học, một giáo viên CNTT trung học và một tài xế xe tải đã dùng AI để làm ra sản phẩm thật. [👉 View the stories](https://datawhalechina.github.io/easy-vibe/zh-cn/vibe-stories/story-1.html)
- **[2026-03-26]** 🚀 **Cập nhật thực hành Giai đoạn 2 lớn**: Dự án tốt nghiệp SaaS "[Ứng dụng full-stack SaaS đầu tiên: Trang web tạo nội dung](https://datawhalechina.github.io/easy-vibe/en/stage-2/assignments/fullstack-app/)" đã hoàn thành và phần "[Cách tích hợp Stripe và hệ thống thanh toán](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/stripe-payment/)" được mở rộng đáng kể.
- **[2026-03-25]** 📚 **Phụ lục mới: Nghiên cứu ngưởi dùng và xác thực yêu cầu**: Thêm bốn bài viết mới về tìm kiếm ý tưởng, mô hình Double Diamond, Jobs to Be Done và The Mom Test để giúp ngưởi mới bắt đầu khám phá và xác thực ý tưởng sản phẩm. [👉 Đọc phụ lục](https://datawhalechina.github.io/easy-vibe/en/appendix/)
- **[2026-03-25]** 📚 **Tài liệu tiếng Anh được cập nhật đầy đủ**: Giai đoạn 2 (Phát triển full-stack) và Giai đoạn 3 (Phát triển nâng cao) hiện đã có đầy đủ bằng tiếng Anh. [👉 Bắt đầu học](https://datawhalechina.github.io/easy-vibe/en/stage-2/)
- **[2026-03-02]** 🦞 **Hỗ trợ thân thiện cho OpenClaw và AI Agent**: Thêm `llms.txt` để OpenClaw, Claude, Cursor, Trae và các AI Agent khác có thể nhanh chóng hiểu cấu trúc kho lưu trữ và tìm đúng nội dung hướng dẫn.
- **[2026-03-01]** Phần [Phát triển Nâng cao](https://datawhalechina.github.io/easy-vibe/en/stage-3/) đã được nâng cấp toàn diện với hướng dẫn sâu về Claude Code, bao gồm MCP, Skills, Agent Teams và hơn thế nữa, cùng với tám hướng dẫn dự án đa nền tảng.
- **[2026-02-25]** Cập nhật [Cơ sở kiến thức Phụ lục](https://datawhalechina.github.io/easy-vibe/en/appendix/), hiện bao gồm 9 lĩnh vực kiến thức và hơn 80 chủ đề tương tác.
- **[2026-01-27]** Thêm hướng dẫn phát triển ứng dụng cho Android và iOS.
- **[2026-01-19]** Phát hành các bản demo tương tác cho Prompt Engineering, lịch sử AI, thiết kế xác thực, nguyên lý Git và hơn thế nữa.
## 🔥 Tin tuc
- **[2026-03-29]** ✨ **Ra mat muc cau chuyen nguoi dung va nang cap voi nhung hanh trinh nguoi dung that**: Da them phan Vibe Stories moi tren trang chu voi carousel tuong tac va cac trang story rieng, sau do thay the noi dung tam bang bon cau chuyen that tu mot giao vien tieu hoc vung que, mot sinh vien dai hoc, mot giao vien CNTT trung hoc va mot tai xe xe tai da xay dung san pham that voi AI. [👉 Xem cau chuyen](https://datawhalechina.github.io/easy-vibe/zh-cn/vibe-stories/story-1.html)
- **[2026-03-26]** 🚀 **Cap nhat thuc hanh Giai doan 2 lon**: Hoan thanh du an SaaS tot nghiep "[Ung dung Full-stack SaaS dau tien: Trang web tao noi dung](https://datawhalechina.github.io/easy-vibe/en/stage-2/assignments/fullstack-app/)" va mo rang dang ke phan "[Cach tich hop Stripe va he thong thanh toan](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/stripe-payment/)", cung nhu noi dung quan trong ve UI da san pham va quy trinh backend WeChat Mini Program.
- **[2026-03-25]** 📚 **Phu luc moi: Nghien cuu nguoi dung va Xac thuc yeu cau**: Them bon bai viet moi ve tim kiem y tuong, mo hinh Double Diamond, Jobs to Be Done va The Mom Test giup nguoi moi bat dau kham pha va xac thuc y tuong san pham. [👉 Doc phu luc](https://datawhalechina.github.io/easy-vibe/en/appendix/)
- **[2026-03-25]** 📚 **Tai lieu tieng Anh duoc cap nhat day du**: Giai doan 2 (Phat trien full-stack) va Giai doan 3 (Phat trien nang cao) hien da co day du bang tieng Anh. [👉 Bat dau hoc](https://datawhalechina.github.io/easy-vibe/en/stage-2/)
<details>
<summary>Tin tc Trước đây</summary>
<summary>Tin tuc truoc day</summary>
- **[2026-01-16]** Tái cấu trúc cấu trúc dự án và thiết lập chính thức chương nhập môn cho ngưởi mới bắt đầu.
- **[2026-01-14]** Hoàn thành cập nhật lớn cho tài liệu xây dựng nguyên mẫu sản phẩm Giai đoạn 1.
- **[2026-01-13]** Tái cấu trúc kiến trúc tài liệu và kích hoạt đầy đủ hỗ trợ đa ngôn ngữ (i18n).
- **[2026-01-01]** Phát hành bản đồ học tập cốt lõi của dự án.
- **[2026-03-02]** 🦞 **Ho tro than thien cho OpenClaw va AI Agent**: Da them `llms.txt` de OpenClaw, Claude, Cursor, Trae va cac AI Agent khac co the nhanh chong hieu cau truc kho luu tru va tim dung noi dung huong dan.
- **[2026-03-01]** Phan [Phat trien Nang cao](https://datawhalechina.github.io/easy-vibe/en/stage-3/) da duoc nang cap toan dien voi huong dan sau ve Claude Code, bao gom MCP, Skills, Agent Teams va hon the nua, cung voi tam huong dan du an da nen tang.
- **[2026-02-25]** Cap nhat [Co so kien thuc Phu luc](https://datawhalechina.github.io/easy-vibe/en/appendix/), hien bao gom 9 linh vuc kien thuc va hon 80 chu de tuong tac.
- **[2026-01-27]** Them huong dan phat trien ung dung Android va iOS.
- **[2026-01-19]** Phat hanh cac ban demo tuong tac cho Prompt Engineering, lich su AI, thiet ke xac thuc, nguyen ly Git va hon the nua.
- **[2026-01-16]** Tai cau truc cau truc du an va thiet lap chinh thuc lo trinh nhap mon cho nguoi moi.
- **[2026-01-14]** Hoan thanh cap nhat lon cho tai lieu xay dung nguyen mau san pham Giai doan 1.
- **[2026-01-13]** Tai cau truc kien truc tai lieu va kich hoat day du ho tro da ngon ngu.
- **[2026-01-01]** Phat hanh ban do hoc tap cot loi cua du an.
</details>
## 适合谁
## Danh cho ai
- **零基础爱好者**:先做出第一个作品,再理解怎么做
- **产品经理 / 创业者**:快速验证想法,低成本做 MVP
- **学生**:建立 AI 时代的实战技能
- **初级开发者**:补齐从想法到上线的完整开发链路
- **中高级开发者**:掌握 AI 协作开发、复杂项目实战与效率升级
- **Nguoi moi bat dau hoan toan**: Lam san pham dau tien truoc, roi hieu cach no hoat dong
- **Quan ly san pham / nguoi khoi nghiep**: Xac thuc y tuong nhanh va xay dung MVP voi chi phi thap
- **Hoc sinh, sinh vien**: Phat trien ky nang thuc te cho thoi dai AI
- **Lap trinh vien junior**: Hoc toan bo lo trinh tu y tuong den san pham that
- **Lap trinh vien trung va cao cap**: Nang cap quy trinh lam viec voi AI cho cac du an phuc tap
## 你的学习路径
## Lo trinh hoc cua ban
### 🎮 我想先试试(5分钟体验)
**适合人群**:所有人
**学什么**AI 编程初体验、贪吃蛇小游戏
**你会得到**5 分钟做出第一个 AI 应用
### 🎮 Toi muon trai nghiem nhanh
**Phu hop voi**: Moi nguoi
**Ban se hoc**: Cam giac thuc su ve AI coding qua mot vi du thuc hanh don gian, cu the
**Ban se nhan duoc**: An tuong dau tien ro rang ve vibe coding va cach lam viec voi AI thong qua hoi thoai
[开始体验](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/learning-map/)
[Bat dau tai day](https://datawhalechina.github.io/easy-vibe/en/stage-1/ai-capabilities-through-games/)
### 💡 我有个想法要实现
**适合人群**:零基础/产品经理/创业者
**学什么**:AI IDE 工具、需求拆解、页面设计、功能规划、提示词写法、原型迭代
**你会得到**:一个可演示的产品原型
### 💡 Toi muon bien y tuong thanh nguyen mau san pham
**Phu hop voi**: Nguoi moi / quan ly san pham / nguoi khoi nghiep
**Ban se hoc**: Lo trinh hoc, cong cu AI IDE, xac thuc y tuong, tao nguyen mau, tich hop kha nang AI va lap day du demo
**Ban se nhan duoc**: Mot nguyen mau san pham AI co the trinh bay cho nguoi dung hoac dong doi
[开始学习](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/learning-map/)
[Bat dau hoc](https://datawhalechina.github.io/easy-vibe/en/stage-1/learning-map/)
### 🚀 我想系统学习
**适合人群**:开发者/进阶学习者
**学什么**:前端、后端、数据库、AI 集成、部署运维、Claude Code 开发技巧
**你会得到**:独立完成一个可上线的全栈 AI 应用
### 🚀 Toi muon xay dung san pham full-stack tron ven
**Phu hop voi**: Lap trinh vien junior / indie hacker / nguoi hoc nang cao
**Ban se hoc**: Quy trinh frontend, design-to-code, co so du lieu, backend API, trien khai, thanh toan va du an lon
**Ban se nhan duoc**: Kha nang doc lap trien khai ung dung web AI hien dai
[开始学习](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/)
[Bat dau hoc](https://datawhalechina.github.io/easy-vibe/en/stage-2/)
### 🦞 我想构建 AI Agent
**适合人群**:对 AI Agent 感兴趣的开发者
**学什么**OpenClaw AI 助理、Skills 系统、自动化工作流
**你会得到**:一个属于你的命令行 AI 助理
### AI-Native: Toi muon quy trinh Claude Code va agent nang cao
**Phu hop voi**: Lap trinh vien quan tam den ky thuat AI-native
**Ban se hoc**: Claude Code, MCP, Skills, Agent Teams, tac vu chay dai, Spec Coding va giao phan ung dung da nen tang
**Ban se nhan duoc**: Quy trinh manh me hon cho phat trien co tro giup AI va tu dong hoa
[开始学习](https://github.com/datawhalechina/hello-claw)
[Den phat trien nang cao](https://datawhalechina.github.io/easy-vibe/en/stage-3/)
### 📚 我想查资料
**适合人群**:所有人
**学什么**:计算机基础、AI 原理、9 大知识领域
**你会得到**80+ 交互式专题资料
### 📚 Toi muon tai lieu tham khao va kien thuc co ban
**Phu hop voi**: Moi nguoi
**Ban se hoc**: Co ban tin hoc, co ban frontend/backend, ha tang, nguyen ly AI va thuc tien ky thuat
**Ban se nhan duoc**: Co so tai lieu tham khao dai han bao gom 9 linh vuc kien thuc lon
[查看知识库](https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/)
[Duyet co so kien thuc](https://datawhalechina.github.io/easy-vibe/en/appendix/)
## 学习建议
## Loi khuyen hoc
- 零基础、产品经理、创业者:从 [第一阶段](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/learning-map/) 开始
- 有开发经验:从 [第二阶段](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/) 开始
- 想直接做复杂项目:进入 [第三阶段](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/)
- 想学 AI Agent:看 [Hello Claw](https://github.com/datawhalechina/hello-claw)
- Neu ban la nguoi moi, quan ly san pham hoac nguoi khoi nghiep, bat dau voi [Giai doan 1](https://datawhalechina.github.io/easy-vibe/en/stage-1/learning-map/)
- Neu ban muon chuyen tu nguyen mau sang trien khai full-stack, bat dau voi [Giai doan 2](https://datawhalechina.github.io/easy-vibe/en/stage-2/)
- Neu ban muon quy trinh Claude Code nang cao hoac du an da nen tang, den [Giai doan 3](https://datawhalechina.github.io/easy-vibe/en/stage-3/)
- Neu ban bi chan boi khai niem hoac thieu kien thuc nen tang, su dung [Phu luc Co so kien thuc](https://datawhalechina.github.io/easy-vibe/en/appendix/)
### 📖 内容导航
### 📖 Dieu huong noi dung
<div align="center">
<img src="../../assets/readme-image1.png" alt="Learning Map" width="70%" style="border-radius: 10px; box-shadow: 0 8px 20px rgba(45,55,72,0.3); margin: 15px 0;"/>
<img src="../../assets/readme-image1.png" alt="Lo trinh hoc" width="70%" style="border-radius: 10px; box-shadow: 0 8px 20px rgba(45,55,72,0.3); margin: 15px 0;"/>
</div>
### 一、零基础入门
### I. Nhap mon nguoi moi
| 章节 | 关键内容 |
| :----------------------------------------------------------------------------------- | :------------------------------------------------ |
| [学习地图](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/learning-map/) | 整体学习路径导览 |
| [AI 时代,会说话就会编程](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/ai-capabilities-through-games/) | 通过贪吃蛇等案例初步感受 AI 编程的能力 |
| [寻找好想法](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/finding-great-idea/) | 学会寻找和验证产品想法,找到值得做的项目 |
| [认识 AI IDE 工具](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/introduction-to-ai-ide/) | 学会使用 IDE,在本地制作小游戏 |
| [动手做出原型](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/building-prototype/) | 从需求分析、AI 生成单页面,再到生成多页面产品原型 |
| [给原型加上 AI 能力](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/integrating-ai-capabilities/) | 学会接入常见 AI 能力(文本、图片、视频) |
| [完整项目实战](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/complete-project-practice/) | 模拟真实场景、接受用户反馈迭代,完整化项目 |
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Ban do hoc tap](https://datawhalechina.github.io/easy-vibe/en/stage-1/learning-map/) | Tong quan huong dan toan bo hanh trinh hoc |
| [Thoi dai AI: Biet noi la biet code](https://datawhalechina.github.io/easy-vibe/en/stage-1/ai-capabilities-through-games/) | Cam nhan dau tien ve AI coding qua cac vi du nhu Snake |
| [Lam chu cong cu lap trinh AI](https://datawhalechina.github.io/easy-vibe/en/stage-1/introduction-to-ai-ide/) | Hoc cach hoat dong cua cac cong cu AI IDE va xay dung du an cuc bo don gian |
| [Tim y tuong hay](https://datawhalechina.github.io/easy-vibe/en/stage-1/finding-great-idea/) | Hoc cach kham pha va xac thuc y tuong san pham dang lam |
| [Xay dung nguyen mau san pham](https://datawhalechina.github.io/easy-vibe/en/stage-1/building-prototype/) | Di tu yeu cau den nguyen mau san pham mot trang va nhieu trang |
| [Tich hop kha nang AI](https://datawhalechina.github.io/easy-vibe/en/stage-1/integrating-ai-capabilities/) | Tich hop tinh nang AI van ban, hinh anh va video |
| [Thuc hanh du an hoan chinh](https://datawhalechina.github.io/easy-vibe/en/stage-1/complete-project-practice/) | Mo phong tinh huong that, thu thap phan hoi nguoi dung va lap du an hoan chinh |
#### 附录:业务思维
#### Phu luc: Tu duy san pham va kinh doanh
| 章节 | 关键内容 |
| :----------------------------------------------------------------------------------- | :----------------------------------------- |
| [产品思维与方案设计](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/appendix-a-product-thinking/) | 从零到一做产品需要考虑的思维框架 |
| [AI 行业应用场景参考 (B)](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/appendix-industry-scenarios/) | 了解 AI 在不同产业的应用场景 |
| [AI 消费场景灵感参考 (C端)](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/appendix-c-consumer-scenarios/) | 探索 AI 在消费级产品中的应用场景 |
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Tu duy san pham va thiet ke phuong an](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-a-product-thinking/) | Khung tu duy co ban tu khong den mot voi san pham |
| [Cac kich ban ung dung AI trong nganh (B2B)](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-industry-scenarios/) | Hieu cach AI duoc ung dung trong cac nganh nghe |
| [Cam hung kich ban tieu dung AI (B2C)](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-c-consumer-scenarios/) | Kham pha co hoi san pham trong AI tieu dung |
#### 附录:技术方案
#### Phu luc: Nghien cuu nguoi dung va Xac thuc yeu cau
| 章节 | 关键内容 |
| :---------------------------------------------------------------------------------------------------------------------- | :----------------------------------------- |
| [写代码时遇到错误怎么办](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/appendix-b-common-errors/) | vibe coding 中的常见错误及排查方法 |
| [七款 AI 编程工具对比](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial) | 对比测试主流 AI 编程平台 |
| [用设计和编程 Agent 设计网站](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents) | 学习如何使用 AI 智能体协同工作 |
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Tim y tuong o dau: 3 nguon tham khao tot nhat cho nguoi moi](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-idea-sources/) | Xay dung luong thong tin tin cay de tim co hoi san pham cu the |
| [Double Diamond: Lam dung truoc, roi lam tot](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-double-diamond/) | Su dung quy trinh co cau truc de di tu cam hung lac long den huong kha thi |
| [Dung Jobs to Be Done de tim dieu nguoi dung thuc su muon](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-jobs-to-be-done/) | Phan tich muc tieu nguoi dung qua nhiem vu that thay vi yeu cau tinh nang be mat |
| [The Mom Test: Phuong phong phong van de xac thuc nhu cau](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-mom-test/) | Hoc cach hoi cau hoi tot hon va tranh phan hoi sai tich cuc |
### 二、初中级开发工程师
#### Phu luc: Giai phap ky thuat
#### 前端部分
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Lam gi khi gap loi](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-b-common-errors/) | Cac van de vibe coding thuong gap va cach khac phuc |
| [So sanh bay cong cu lap trinh AI](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial) | So sanh cac nen tang AI coding chinh qua thu nghiem thuc hanh |
| [Thiet ke website voi Agents](https://datawhalechina.github.io/easy-vibe/en/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents) | Hoc hop tac da agent trong thuc hanh |
| 章节 | 关键内容 |
| :--------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------- |
| [从Lovart出发,搭建自己的素材生产Agent](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/lovart-assets/) | 从零开始,利用Nanobanana和Lovart批量生成高质量的设计素材,并动手构建一个能意图识别的绘图Agent |
| [Figma 与 MasterGo 入门](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/figma-mastergo/) | 用设计工具梳理信息架构和页面结构,为前端实现打基础 |
| [构建第一个现代应用程序-UI 设计](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/ui-design/) | 基于设计稿完成组件化界面,实现从设计到代码的第一条链路 |
| [参考 UI 设计规范与多产品 UI 设计](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/multi-product-ui/) | 围绕统一主视觉扩展多产品界面,练习系统化设计能力 |
| [用 LLM 和 Skills 让界面变好看](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/llm-skills-beautiful/) | 用提示词和 Skills 插件让 AI 生成美观独特的界面 |
| [一起做霍格沃茨画像](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/hogwarts-portraits/) | 从 0 到 1 做出接入 AI 能力的前端应用,串联设计与开发 |
| [从设计原型到项目代码](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/design-to-code/) | 三种路径将设计工具中的原型转化为前端代码 |
| [使用现代组件库更新你的界面](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/frontend/modern-component-library/) | 用组件库快速构建专业级界面,统一风格、提升开发效率 |
### II. Lap trinh vien trung cap
#### 后端开发部分
#### Frontend
| 章节 | 关键内容 |
| :------------------------------------------------------------------------------------------------- | :---------------------------------------------------------- |
| [从数据库到 Supabase](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/database-supabase/) | 在 Supabase 上落地数据库和 API,打通数据模型与前端页面 |
| [大模型辅助编写接口代码与接口文档](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/ai-interface-code/) | 用大模型协助生成接口与数据库文档及代码,实现可读可测的后端 |
| [Git 和 GitHub 工作流](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/git-workflow/) | 在 Git 工作流中管理代码,进行版本控制和协作 |
| [如何部署 Web 应用](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/zeabur-deployment/) | 使用 CloudBase、Vercel、Zeabur 等平台部署应用上线 |
| [CLI AI 编程工具](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/modern-cli/) | 使用 CLI 类 AI 编程工具加速开发与调试,形成个人工程化工作流 |
| [如何集成 Stripe 等收费系统](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/stripe-payment/) | 接入支付系统,完成收费链路与基础结算流程 |
| [大作业:构建第一个现代应用程序-全栈应用](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/assignments/copywriting-platform-supabase/) | 综合前端、后端与支付模块,完成可上线的全栈 Web 应用 |
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Frontend 0: Xay dung Agent san xuat tai san cua rieng ban voi Lovart](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/lovart-assets/) | Su dung Nanobanana va Lovart de tao hang loat tai san truc quan va xay dung agent ve voi nhan dien y dich |
| [Frontend 1: Co ban Figma & MasterGo](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/figma-mastergo/) | Hoc quy trinh tu ban thiet ke den tu duy UI chuan bi trien khai |
| [Frontend 2: Xay dung ung dung hien dai dau tien - Thiet ke UI](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/ui-design/) | Hoc nen tang thiet ke UI phia sau giao dien ung dung hien dai |
| [Frontend 3: Huong dan UI va Thiet ke da san pham](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/multi-product-ui/) | Cai thien tinh nhat quan va tham my tren nhieu san pham voi quy tac UI chung |
| [Frontend 4: Lam giao dien dep voi LLM va Skills](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/llm-skills-beautiful/) | Su dung prompt va plugin de AI tao giao dien tinh te va doc dao hon |
| [Frontend 4: Cung xay dung Chân dung Hogwarts](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/hogwarts-portraits/) | Xay dung du an frontend AI-hinh anh tuong tac tu dau |
| [Frontend 6: Tu nguyen mau thiet ke den ma du an](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/design-to-code/) | Bien nguyen mau thiet ke thanh ma frontend co the chay that trong trinh duyet |
| [Frontend 7: Nang cap UI voi thu vien thanh phan hien dai](https://datawhalechina.github.io/easy-vibe/en/stage-2/frontend/modern-component-library/) | Su dung thu vien thanh phan de xay dung giao dien chuyen nghiep nhanh hon |
#### AI 能力附录
#### Backend
| 章节 | 关键内容 |
| :------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- |
| [Dify 入门与知识库集成](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/ai-capabilities/dify-knowledge-base/) | 用 Dify Workflow 与基础 RAG 搭建工具类产品,为后续应用升级打样 |
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Backend 1: Hoc Git va GitHub](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/git-workflow/) | Lam chu cac thao tac dieu khien phien ban va quy trinh hop tac voi Git |
| [Backend 2: Tu Co so du lieu den Supabase](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/database-supabase/) | Hoc co ban co so du lieu quan he va su dung Supabase nhu nen tang BaaS hien dai |
| [Backend 3: Thiet ke va Phat trien Backend API](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/ai-interface-code/) | Su dung AI ho tro thiet ke API, tao ma backend va tai lieu API |
| [Backend 4: Trien khai nguyen mau san pham cua ban](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/zeabur-deployment/) | Trien khai nhanh ung dung full-stack len may chu voi Zeabur |
| [Backend 5: Tu IDE den Cong cu AI Coding CLI](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/modern-cli/) | Kham pha quy trinh AI coding dau tien terminal cho phat trien hien dai |
| [Backend 6: Tich hop Stripe va cac He thong Thanh toan khac](https://datawhalechina.github.io/easy-vibe/en/stage-2/backend/stripe-payment/) | Them kha nang thanh toan voi tinh nang thanh toan va hoa don |
### 三、高级开发工程师
#### Du an lon
#### Claude Code 核心技能
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Du an lon 1: Ung dung Full-stack SaaS dau tien - Trang web tao noi dung AI](https://datawhalechina.github.io/easy-vibe/en/stage-2/assignments/fullstack-app/) | Xay dung khong gian lam viec AI marketing copy voi dang nhap, tao, thanh toan va quan ly admin |
| [Du an lon 2: He thong Ky thi va Quan ly truc tuyen](https://datawhalechina.github.io/easy-vibe/en/stage-2/assignments/modern-frontend-trae/) | Xay dung he thong ky thi truc tuyen voi tao cau hoi, quy trinh lam bai va cong cu admin |
| 章节 | 关键内容 |
| :------------------------------------------------------------------------------------------------------ | :----------------------------------------------------------- |
| [Claude Code 快速上手](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/basics/) | 安装配置、基础操作、实用技巧和常用指令 |
| [Claude Code MCP 完全指南](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/mcp/) | 通过 MCP 让 Claude Code 连接 GitHub、数据库、API 等外部服务 |
| [Claude Code Skills 完全指南](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/skills/) | 将专业知识打包成可复用技能包,一次配置反复使用 |
| [Claude Code 工作流最佳实践](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/workflow/) | 日常开发、代码重构、Code Review 等场景的最佳实践 |
| [Claude Agent Teams 完全指南](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/agent-teams/) | 多 AI 实例协同工作,像真正的开发团队一样并行协作 |
| [Claude Code Superpowers 工程级开发](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/superpowers/) | 让 AI 写出工程级代码,遵循 TDD 和最佳实践 |
| [如何让 Claude Code 长时间工作](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/core-skills/long-running-tasks/) | 设计长时间运行的任务,让 Coding Tools 持续工作直到完成 |
#### Phu luc Kha nang AI
#### 多平台开发
| Phan | Noi dung chinh |
| :------ | :---------- |
| [AI 1: Co ban Dify & Tich hop Co so kien thuc](https://datawhalechina.github.io/easy-vibe/en/stage-2/ai-capabilities/dify-knowledge-base/) | Hoc xay dung ung dung AI voi Dify va tich hop co so kien thuc rieng |
| 章节 | 关键内容 |
| :------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------- |
| [如何构建微信小程序](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/wechat-miniprogram/) | 了解微信小程序生态,从官方模板到上线完成一个前端小程序 |
| [如何构建微信小程序-包含后端](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/wechat-miniprogram-backend/) | 在小程序中接入数据库与后端逻辑,打通完整业务闭环 |
| [如何构建安卓程序](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/android-app/) | 使用 Expo 等工具,完成 Web/原生一体化的安卓应用开发 |
| [如何构建 iOS 程序](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/ios-app/) | 使用 Expo 等工具,完成 Web/原生一体化的 iOS 应用开发 |
| [如何开发 PWA 本地应用](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/pwa-local-app/) | 让网页变成"真正的 App",支持离线、推送、桌面安装 |
| [如何开发浏览器 AI 助手插件](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/browser-ai-extension/) | 开发 Chrome 插件,一键总结任意网页,支持云端 API 和内置 AI |
| [如何开发 Electron 桌面程序](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/electron-voice-to-text/) | 用 Electron 构建语音转文字桌面应用,支持三平台安装运行 |
| [如何快速开发并铸造 NFT](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/nft-minting/) | 从零编写智能合约,部署到以太坊测试网,铸造自己的 NFT |
| [如何开发 VS Code 插件](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/vscode-extension/) | 开发 AI 项目助手插件,支持模板生成、代码对话、多文件问答 |
| [如何开发工业级 Qt 桌面应用](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/cross-platform/qt-industrial-hmi/) | 用 Qt 构建工业级水泵监控 HMI 系统,实时数据、趋势图、报警 |
### III. Lap trinh vien cao cap
#### AI 能力附录
#### Ky nang cot loi Claude Code
| 章节 | 关键内容 |
| :---------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------ |
| [什么是 RAG 以及它如何工作](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/ai-advanced/rag-introduction/) | 系统理解 RAG 原理与常见架构,为复杂应用提供知识检索基础 |
| [中高级 RAG 与工作流编排:以 LangGraph 为例](https://datawhalechina.github.io/easy-vibe/zh-cn/stage-3/ai-advanced/langgraph-advanced-rag/) | 使用 LangGraph 等工具设计多步工作流与中高级 RAG 系统 |
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Bat dau voi Claude Code](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/basics/) | Cai dat, thiet lap, co ban va lenh huu ich |
| [Huong dan Claude Code MCP](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/mcp/) | Ket noi Claude Code voi GitHub, co so du lieu, API va cac dich vu khac thong qua MCP |
| [Huong dan Claude Code Skills](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/skills/) | Dong goi chuyen mon thanh ky nang tai su dung dung lai nhieu lan |
| [Cach giu Claude Code lam viec voi tac vu chay dai](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/long-running-tasks/) | Thiet ke tac vu chay dai de cong cu coding co the tiep tuc lam viec cho den khi xong |
| [Huong dan Claude Agent Teams](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/agent-teams/) | Phoi hop nhieu instance AI nhu mot doi ngu phat trien that |
| [Claude Code Superpowers cho phat trien cap ky thuat](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/superpowers/) | Giup AI tao ma cap ky thuat voi TDD va best practices |
| [Best practices quy trinh Claude Code](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/workflow/) | Best practices cho refactor, code review va phat trien hang ngay |
| [Phat trien tu xa Claude Code tren di dong](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/mobile-development/) | Su dung Claude Code vuot ra ngoai desktop va xay dung quy trinh lam viec tu xa hieu qua tren thiet bi di dong |
| [Huong dan day du Claude Agent SDK](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/claude-agent-sdk/) | Xay dung quy trinh agent tuy chinh va tich hop Claude vao cong cu cua rieng ban voi SDK |
| [Tu vibe coding den spec coding](https://datawhalechina.github.io/easy-vibe/en/stage-3/core-skills/spec-coding/) | Chuyen tu prompt ad-hoc sang quy trinh phat trien AI co cau truc va huong quy cach hon |
### 📚 附录知识库
#### Phat trien da nen tang
> 涵盖 **9 大知识领域**、**80+ 交互式专题**,以动画和可视化组件帮助你直观理解从计算机底层到 AI 前沿的核心概念。
| Phan | Noi dung chinh |
| :------ | :---------- |
| [Cach chon nen tang phu hop cho ung dung cua ban](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/choose-platform/) | So sanh cac hinh thuc ung dung va chon nen tang phu hop dua tren nguoi dung, tinh huong va muc tieu giao pho |
| [Xay dung WeChat Mini Program](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/wechat-miniprogram/) | Hieu he sinh thai va giao pho mini program frontend tu template den ra mat |
| [Xay dung WeChat Mini Program voi backend](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/wechat-miniprogram-backend/) | Them logic backend va co so du lieu de hoan thanh vong lap kinh doanh day du |
| [Xay dung ung dung Android](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/android-app/) | Hoc phat trien ung dung Android voi quy trinh native hien dai |
| [Xay dung ung dung iOS](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/ios-app/) | Hoc phat trien ung dung iOS va cac quy uoc cua he sinh thai Apple |
| [Xay dung ung dung PWA cuc bo](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/pwa-local-app/) | Bien website thanh ung dung that voi ho tro offline, push va cai dat |
| [Xay dung tien ich tro ly AI trinh duyet](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/browser-ai-extension/) | Tao tien ich Chrome tom tat bat ky trang nao voi cloud API hoac AI tich hop |
| [Xay dung ung dung desktop Electron](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/electron-voice-to-text/) | Xay dung ung dung chuyen giong noi thanh van ban bang Electron cho ba nen tang |
| [Nhanh chong xay dung va dap NFT](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/nft-minting/) | Viet smart contract tu dau, trien khai va dap NFT rieng cua ban |
| [Xay dung tien ich mo rong VS Code](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/vscode-extension/) | Xay dung tro ly du an AI voi template, code chat va hoi dap da file |
| [Xay dung ung dung desktop Qt cap cong nghiep](https://datawhalechina.github.io/easy-vibe/en/stage-3/cross-platform/qt-industrial-hmi/) | Tao he thong Qt HMI thoi gian that voi xu huong, canh bao va giam sat |
#### Phu luc Kha nang AI
| Phan | Noi dung chinh |
| :------ | :---------- |
| [RAG la gi va no hoat dong nhu the nao](https://datawhalechina.github.io/easy-vibe/en/stage-3/ai-advanced/rag-introduction/) | Xay dung hieu biet he thong ve nguyen ly RAG va cac kien truc thuong gap |
| [Quy trinh RAG trung va cao cap voi LangGraph](https://datawhalechina.github.io/easy-vibe/en/stage-3/ai-advanced/langgraph-advanced-rag/) | Thiet ke quy trinh da buoc va he thong RAG nang cao hon |
### 📚 Phu luc Co so kien thuc
> Bao gom **9 linh vuc kien thuc lon** va **hon 80 chu de tuong tac**, phu luc nay su dung hoat anh va thanh phan truc quan giup ban hieu truc quan cac khai niem co ban tu co ban tin hoc den tien tien AI.
>
> 👉 [查看完整附录](https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/) · [AI 能力词典](https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/ai-capability-dictionary)
> 👉 [Xem phu luc day du](https://datawhalechina.github.io/easy-vibe/en/appendix/)
<table>
<tr>
<td valign="top" width="33%">
<strong>💻 计算机基础</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/1-computer-fundamentals/transistor-to-cpu.html">从晶体管到 CPU</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/1-computer-fundamentals/operating-systems.html">操作系统</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/1-computer-fundamentals/data-encoding-storage.html">数据的编码、存储与传输</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/1-computer-fundamentals/computer-networks.html">网络:两台电脑如何对话</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/1-computer-fundamentals/data-structures.html">数据结构</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/1-computer-fundamentals/algorithm-thinking.html">算法思维入门</a>
</td>
<td valign="top" width="33%">
<strong>🔧 开发工具</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/2-development-tools/git-version-control.html">Git:代码的时光机</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/2-development-tools/command-line-shell.html">命令行与 Shell 脚本</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/2-development-tools/package-managers.html">包管理器</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/2-development-tools/debugging-art/">调试的艺术</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/2-development-tools/regex.html">正则表达式</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/2-development-tools/environment-path.html">环境变量与 PATH</a>
</td>
<td valign="top" width="33%">
<strong>🌐 浏览器与前端</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/3-browser-and-frontend/javascript-deep-dive.html">JavaScript 语言深入</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/3-browser-and-frontend/browser-as-os-rendering.html">浏览器渲染管道</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/3-browser-and-frontend/frontend-frameworks.html">前端框架对比</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/3-browser-and-frontend/graphics-animation.html">图形与动画</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/3-browser-and-frontend/web-performance.html">网页性能的度量与优化</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/3-browser-and-frontend/frontend-engineering.html">前端工程化全貌</a>
</td>
</tr>
<tr>
<td valign="top" width="33%">
<strong>🖥️ 服务器与后端</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/4-server-and-backend/http-protocol.html">HTTP 协议</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/4-server-and-backend/api-design.html">API 设计哲学</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/4-server-and-backend/auth-authorization.html">认证与授权体系</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/4-server-and-backend/concurrency-async.html">并发、异步与多线程</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/4-server-and-backend/message-queues.html">消息队列与事件驱动</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/4-server-and-backend/backend-layered-architecture.html">后端分层架构</a>
</td>
<td valign="top" width="33%">
<strong>📊 数据</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/5-data/database-fundamentals.html">数据库原理与 SQL</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/5-data/database-fundamentals.html">数据库原理</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/5-data/data-tracking.html">数据埋点与用户行为采集</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/5-data/data-analysis.html">数据分析基础</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/5-data/ab-testing.html">A/B 测试与实验驱动</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/5-data/data-visualization.html">数据可视化与仪表盘</a>
</td>
<td valign="top" width="33%">
<strong>🏗️ 架构与系统设计</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/6-architecture-and-system-design/monolith-to-microservices.html">从单体到微服务的演进</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/6-architecture-and-system-design/distributed-systems.html">分布式系统的挑战</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/6-architecture-and-system-design/high-availability.html">高可用与容灾</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/6-architecture-and-system-design/system-design-methodology.html">系统设计方法论</a>
</td>
</tr>
<tr>
<td valign="top" width="33%">
<strong>☁️ 基础设施与运维</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/7-infrastructure-and-operations/docker-containers.html">Docker 容器化</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/7-infrastructure-and-operations/kubernetes.html">Kubernetes 编排</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/7-infrastructure-and-operations/ci-cd.html">CI / CD 自动化</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/7-infrastructure-and-operations/dns-https.html">域名、DNS 与 HTTPS</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/7-infrastructure-and-operations/monitoring-logging.html">监控、日志与告警</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/7-infrastructure-and-operations/infrastructure-as-code.html">基础设施即代码</a>
</td>
<td valign="top" width="33%">
<strong>🤖 人工智能</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/llm-principles.html">大语言模型的工作原理</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/transformer-attention.html">Transformer 与注意力机制</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/rag.html">RAG 架构</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/ai-agents.html">AI Agent 与工具调用</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/prompt-engineering.html">提示词工程</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/8-artificial-intelligence/image-generation.html">图像生成原理</a>
</td>
<td valign="top" width="33%">
<strong>🎯 工程素养</strong><br><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/9-engineering-excellence/code-quality-refactoring.html">代码质量与重构</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/9-engineering-excellence/testing-strategies.html">测试策略</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/9-engineering-excellence/design-patterns.html">设计模式</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/9-engineering-excellence/security-thinking.html">安全思维与攻防基础</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/9-engineering-excellence/technical-writing.html">技术文档写作</a><br>
• <a href="https://datawhalechina.github.io/easy-vibe/zh-cn/appendix/9-engineering-excellence/open-source-collaboration.html">开源协作</a>
</td>
</tr>
</table>
### 🎓 Cac khoa hoc khac
## 🛠️ 如何学习
- [Hands-on Modern RL](#cac-khoa-hoc-khac)
- [Learn Harness Engineering](#cac-khoa-hoc-khac)
- 根据个人能力,选择性地阅读和实践相关章节,如果有问题欢迎 issue 提问。
## 🛠️ Cach hoc
## 💻 本地启动本课件
- Doc va thuc hanh cac phan phu hop voi trinh do hien tai cua ban. Neu ban gap kho khan, cu thoai mai mo issue.
### 现代方案
## 💻 Chay cuc bo
在 AI IDE 对话框(vscode、cursor、trae 等)中,输入下列提示词启动本课件:
### Phuong phap hien dai
```
请你帮我运行这个项目的本地服务
Trong cua so chat AI IDE nhu VS Code, Cursor hoac Trae, ban chi can noi:
```text
Xin giup toi chay du an nay cuc bo.
```
### 旧方案
### Phuong phap truyen thong
1. npm install
2. npm run dev
3. 打开浏览器访问 `http://localhost:3000` 即可查看。
1. `npm install`
2. `npm run dev`
3. Mo `http://localhost:3000` trong trinh duyet cua ban.
## 🤝 参与贡献
## Cac khoa hoc khac
- 如果你发现了一些问题,或者觉得任何可以改进本项目的地方,可以提 Issue 进行反馈。如果提完没有人回复你可以联系[保姆团队](https://github.com/datawhalechina/DOPMC/blob/main/OP.md)的同学进行反馈跟进~
- 如果你想参与贡献本项目,可以提 Pull Request,如果提完没有人回复你可以联系[保姆团队](https://github.com/datawhalechina/DOPMC/blob/main/OP.md)的同学进行反馈跟进~
- 如果你对 Datawhale 很感兴趣并想要发起一个新的项目,请按照[Datawhale 开源项目指南](https://github.com/datawhalechina/DOPMC/blob/main/GUIDE.md)进行操作即可~
Nhom chung toi cung da tao cac khoa hoc khac! Kham pha ngay:
## 🙏 感谢每位贡献者
[![Hands-on Modern RL](https://img.shields.io/badge/HANDS--ON_MODERN_RL-0052cc?style=for-the-badge)](https://github.com/walkinglabs/hands-on-modern-rl)
- [散步-项目负责人](https://github.com/sanbuphy) (Datawhale成员)
- 方可-指导老师(Datawhale成员, 清华大学)
- [Yerim Kang](https://github.com/yerim25)(实践项目部分-清华大学)
- [赵芷霖](https://github.com/ChileenZ)(实践项目部分-清华大学)
- [李亦萱](https://yixuan20.github.io/)(页面美术设计-清华大学)
- 刘思怡(实践项目部分-清华大学)
- [刘丽欣](https://github.com/liulx25xx)(实践项目部分-清华大学)
- AI Vibe Coding 101 内测群完整给建议体验的小伙伴们
**Hands-on Modern RL**: Mot chuong trinh hoc thu cong ma nguon mo, noi cau khoang cach tu co ban RL den LLM alignment, RLVR va cac he thong Agentic nang cao.
### 特别感谢
[![Learn Harness Engineering](https://img.shields.io/badge/LEARN_HARNESS_ENGINEERING-0052cc?style=for-the-badge)](https://github.com/walkinglabs/learn-harness-engineering/tree/main)
- 感谢 [@Sm1les](https://github.com/Sm1les) 对本项目的帮助与支持
- 感谢所有为本项目做出贡献的开发者们和支持点赞的朋友们 ❤️
**Learn Harness Engineering**: Huong dan toan dien ve harness engineering.
## 🤝 Dong gop & Nguoi dong gop
- Neu ban tim thay van de hoac thay dieu gi co the cai thien, cu thoai mai mo issue. Neu khong ai tra loi, ban cung co the lien he [doi ngu ho tro Datawhale](https://github.com/datawhalechina/DOPMC/blob/main/OP.md).
- Neu ban muon dong gop, mo pull request. Neu khong ai tra loi, ban cung co the lien he [doi ngu ho tro Datawhale](https://github.com/datawhalechina/DOPMC/blob/main/OP.md).
- Neu ban muon bat dau du an ma nguon mo Datawhale moi, vui long lam theo [Huong dan Du an Ma nguon mo Datawhale](https://github.com/datawhalechina/DOPMC/blob/main/GUIDE.md).
### 🙏 Nguoi dong gop
- [Sanbu - Truong du an](https://github.com/sanbuphy) (Thanh vien Datawhale)
- Fang Ke - Menh hoat (Thanh vien Datawhale, Dai hoc Tsinghua)
- [Yerim Kang](https://github.com/yerim25) (Du an thuc hanh, Dai hoc Tsinghua)
- [Zhilin Zhao](https://github.com/ChileenZ) (Du an thuc hanh, Dai hoc Tsinghua)
- [Yixuan Li](https://yixuan20.github.io/) (Thiet ke truc quan, Dai hoc Tsinghua)
- Siyi Liu (Du an thuc hanh, Dai hoc Tsinghua)
- [Lixin Liu](https://github.com/liulx25xx) (Du an thuc hanh, Dai hoc Tsinghua)
- Moi nguoi trong nhom thu nghiem noi bo AI Vibe Coding 101 da chia se y kien va phan hoi
### Cam on dac biet
- Cam on [@Sm1les](https://github.com/Sm1les) da giup do va ho tro du an nay
- Cam on moi nguoi dong gop va tat ca nhung nguoi da ho tro du an bang phan hoi va star ❤️
<div align="center">
<a href="https://www.star-history.com/#datawhalechina/easy-vibe&type=timeline&legend=top-left">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=datawhalechina/easy-vibe&type=timeline&theme=dark&legend=top-left" />
@@ -460,19 +424,18 @@ Easy-Vibe giúp bạn biến điều đó thành một sản phẩm thật.
<div align="center">
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">
<img
alt="知识共享许可协议"
alt="Creative Commons License"
style="border-width:0"
src="https://img.shields.io/badge/license-CC%20BY--NC--SA%204.0-lightgrey"
/>
</a>
<br />
本作品采用
Tac pham nay duoc cap phep duoi
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">
知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议
</a>
进行许可。
Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License
</a>.
</div>
## Star History
## Lich su Star
[![Star History Chart](https://api.star-history.com/svg?repos=datawhalechina/easy-vibe&type=date&legend=top-left)](https://www.star-history.com/#datawhalechina/easy-vibe&type=date&legend=top-left)