refactor(docs): reorganize file structure and update content

fix(docs): correct links and paths in multiple files
style(docs): adjust formatting and alignment in README files
docs: update content in multiple markdown files
This commit is contained in:
sanbuphy
2026-02-10 17:23:27 +08:00
parent d166dc5b12
commit 8a7eda8014
28 changed files with 1137 additions and 637 deletions
+10 -10
View File
@@ -89,19 +89,19 @@
#### الملاحق: التفكير التجاري #### الملاحق: التفكير التجاري
| الفصل | المحتوى الرئيسي | الحالة | | الفصل | المحتوى الرئيسي | الحالة |
| :------------------------------------------------------------------------------------------ | :----------------------------------------------------------- | :----- | | :--------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------- | :----- |
| [الملحق A: التفكير في المنتج وتصميم الحل](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | أطر التفكير اللازمة لبناء منتج من الصفر إلى واحد | ✅ | | [الملحق A: التفكير في المنتج وتصميم الحل](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | أطر التفكير اللازمة لبناء منتج من الصفر إلى واحد | ✅ |
| [الملحق B: مرجع سيناريوهات تطبيق الذكاء الاصطناعي في الصناعة (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | فهم تطبيقات الذكاء الاصطناعي في مختلف الصناعات | ✅ | | [الملحق B: مرجع سيناريوهات تطبيق الذكاء الاصطناعي في الصناعة (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | فهم تطبيقات الذكاء الاصطناعي في مختلف الصناعات | ✅ |
| [الملحق C: مرجع إلهام سيناريوهات استهلاك الذكاء الاصطناعي (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | استكشاف تطبيقات الذكاء الاصطناعي في منتجات المستهلكين | ✅ | | [الملحق C: مرجع إلهام سيناريوهات استهلاك الذكاء الاصطناعي (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | استكشاف تطبيقات الذكاء الاصطناعي في منتجات المستهلكين | ✅ |
#### الملاحق: الحلول التقنية #### الملاحق: الحلول التقنية
| الفصل | المحتوى الرئيسي | الحالة | | الفصل | المحتوى الرئيسي | الحالة |
| :--------------------------------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------- | :----- | | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------- | :----- |
| [الملحق D: ماذا تفعل عند مواجهة أخطاء أثناء كتابة الكود](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | الأخطاء الشائعة في Vibe Coding وطرق استكشاف الأخطاء | ✅ | | [الملحق D: ماذا تفعل عند مواجهة أخطاء أثناء كتابة الكود](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | الأخطاء الشائعة في Vibe Coding وطرق استكشاف الأخطاء | ✅ |
| [الملحق E: مقارنة 7 أدوات برمجة الذكاء الاصطناعي](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | مقارنة واختبار منصات برمجة الذكاء الاصطناعي الرئيسية | ✅ | | [الملحق E: مقارنة 7 أدوات برمجة الذكاء الاصطناعي](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | مقارنة واختبار منصات برمجة الذكاء الاصطناعي الرئيسية | ✅ |
| [الملحق F: تصميم مواقع الويب باستخدام وكلاء التصميم والبرمجة](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | تعلم كيفية استخدام وكلاء الذكاء الاصطناعي بشكل تعاوني | ✅ | | [الملحق F: تصميم مواقع الويب باستخدام وكلاء التصميم والبرمجة](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | تعلم كيفية استخدام وكلاء الذكاء الاصطناعي بشكل تعاوني | ✅ |
### 2. مهندس تطوير مستوى المبتدئ-المتوسط ### 2. مهندس تطوير مستوى المبتدئ-المتوسط
+9 -9
View File
@@ -89,19 +89,19 @@ Wir glauben, dass durch die Beherrschung von Vibe Coding in Kombination mit syst
#### Anhänge: Geschäftsdenken #### Anhänge: Geschäftsdenken
| Kapitel | Schlüsselinhalt | Status | | Kapitel | Schlüsselinhalt | Status |
| :-------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------ | :----- | | :--------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------ | :----- |
| [Anhang A: Produktdenken und Lösungsdesign](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Denkrahmen, die für die Erstellung eines Produkts von Null auf Eins erforderlich sind | ✅ | | [Anhang A: Produktdenken und Lösungsdesign](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Denkrahmen, die für die Erstellung eines Produkts von Null auf Eins erforderlich sind | ✅ |
| [Anhang B: Referenz für KI-Branchenanwendungsszenarien (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Verstehen der KI-Anwendungen in verschiedenen Branchen | ✅ | | [Anhang B: Referenz für KI-Branchenanwendungsszenarien (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Verstehen der KI-Anwendungen in verschiedenen Branchen | ✅ |
| [Anhang C: Referenz für KI-Verbrauchsszenarien-Inspiration (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Erkunden der KI-Anwendungen in Verbraucherprodukten | ✅ | | [Anhang C: Referenz für KI-Verbrauchsszenarien-Inspiration (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Erkunden der KI-Anwendungen in Verbraucherprodukten | ✅ |
#### Anhänge: Technische Lösungen #### Anhänge: Technische Lösungen
| Kapitel | Schlüsselinhalt | Status | | Kapitel | Schlüsselinhalt | Status |
| :----------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------ | :----- | | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :----- |
| [Anhang D: Was Tun bei Fehlern beim Schreiben von Code](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Häufige Fehler in Vibe Coding und Methoden zur Fehlerbehebung | ✅ | | [Anhang D: Was Tun bei Fehlern beim Schreiben von Code](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Häufige Fehler in Vibe Coding und Methoden zur Fehlerbehebung | ✅ |
| [Anhang E: Vergleich von 7 KI-Programmierungstools](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Vergleich und Testen der wichtigsten KI-Programmierplattformen | ✅ | | [Anhang E: Vergleich von 7 KI-Programmierungstools](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Vergleich und Testen der wichtigsten KI-Programmierplattformen | ✅ |
| [Anhang F: Websites mit Design- und Programmieragenten Entwerfen](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Lernen der kollaborativen Nutzung von KI-Agenten | ✅ | | [Anhang F: Websites mit Design- und Programmieragenten Entwerfen](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Lernen der kollaborativen Nutzung von KI-Agenten | ✅ |
### 2. Entwicklungsingenieur auf Anfänger-Fortgeschrittenen-Niveau ### 2. Entwicklungsingenieur auf Anfänger-Fortgeschrittenen-Niveau
+10 -10
View File
@@ -92,19 +92,19 @@ We believe that by mastering Vibe Coding combined with systematic training, one
#### Appendix: Business Thinking #### Appendix: Business Thinking
| Chapter | Key Content | Status | | Chapter | Key Content | Status |
| :---------------------------------------------------------------------- | :--------------------------------------------------------------------- | :----- | | :------------------------------------------------------------------------------------------------------ | :------------------------------------------------------- | :----- |
| [Appendix A: Product Thinking and Solution Design](docs/en-us/stage-1/appendix-a-product-thinking/) | Thinking framework needed to build products from scratch | 🚧 | | [Appendix A: Product Thinking and Solution Design](docs/en-us/stage-1/appendix-a-product-thinking/) | Thinking framework needed to build products from scratch | 🚧 |
| [Appendix B: AI Industry Application Scenarios (B2B)](docs/en-us/stage-1/appendix-industry-scenarios/) | Understand AI applications in different industries | 🚧 | | [Appendix B: AI Industry Application Scenarios (B2B)](docs/en-us/stage-1/appendix-industry-scenarios/) | Understand AI applications in different industries | 🚧 |
| [Appendix C: AI Consumer Scenario Inspiration (B2C)](docs/en-us/stage-1/appendix-c-consumer-scenarios/) | Explore AI applications in consumer products | 🚧 | | [Appendix C: AI Consumer Scenario Inspiration (B2C)](docs/en-us/stage-1/appendix-c-consumer-scenarios/) | Explore AI applications in consumer products | 🚧 |
#### Appendix: Technical Solutions #### Appendix: Technical Solutions
| Chapter | Key Content | Status | | Chapter | Key Content | Status |
| :---------------------------------------------------------------------- | :--------------------------------------------------------------------- | :----- | | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------- | :----- |
| [Appendix D: What to Do When Encountering Errors](docs/en-us/stage-1/appendix-b-common-errors/) | Common errors in vibe coding and troubleshooting methods | 🚧 | | [Appendix D: What to Do When Encountering Errors](docs/en-us/stage-1/appendix-b-common-errors/) | Common errors in vibe coding and troubleshooting methods | 🚧 |
| [Appendix E: Comparison of Seven AI Programming Tools](docs/en-us/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Compare and test mainstream AI programming platforms | 🚧 | | [Appendix E: Comparison of Seven AI Programming Tools](docs/en-us/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Compare and test mainstream AI programming platforms | 🚧 |
| [Appendix F: Designing Websites with Design and Programming Agents](docs/en-us/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Learn how to use AI agents collaboratively | 🚧 | | [Appendix F: Designing Websites with Design and Programming Agents](docs/en-us/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Learn how to use AI agents collaboratively | 🚧 |
### Stage 2: Intermediate Developer ### Stage 2: Intermediate Developer
+10 -10
View File
@@ -89,19 +89,19 @@ Creemos que al dominar Vibe Coding y combinarlo con entrenamiento sistemático,
#### Apéndices: Pensamiento de Negocio #### Apéndices: Pensamiento de Negocio
| Capítulo | Contenido clave | Estado | | Capítulo | Contenido clave | Estado |
| :--------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------- | :----- | | :---------------------------------------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------- | :----- |
| [Apéndice A: Pensamiento de Producto y Diseño de Solución](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Marcos de pensamiento necesarios para crear un producto de cero a uno | ✅ | | [Apéndice A: Pensamiento de Producto y Diseño de Solución](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Marcos de pensamiento necesarios para crear un producto de cero a uno | ✅ |
| [Apéndice B: Referencia de Escenarios de Aplicación de AI en la Industria (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Comprender las aplicaciones de AI en diferentes industrias | ✅ | | [Apéndice B: Referencia de Escenarios de Aplicación de AI en la Industria (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Comprender las aplicaciones de AI en diferentes industrias | ✅ |
| [Apéndice C: Referencia de Inspiración de Escenarios de Consumo de AI (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Explorar las aplicaciones de AI en productos de consumo | ✅ | | [Apéndice C: Referencia de Inspiración de Escenarios de Consumo de AI (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Explorar las aplicaciones de AI en productos de consumo | ✅ |
#### Apéndices: Soluciones Técnicas #### Apéndices: Soluciones Técnicas
| Capítulo | Contenido clave | Estado | | Capítulo | Contenido clave | Estado |
| :------------------------------------------------------------------------------------------------------------------------------------------------------------ | :--------------------------------------------------------------------- | :----- | | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------- | :----- |
| [Apéndice D: Qué Hacer Cuando se Encuentran Errores al Escribir Código](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Errores comunes en Vibe Coding y métodos de solución de problemas | ✅ | | [Apéndice D: Qué Hacer Cuando se Encuentran Errores al Escribir Código](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Errores comunes en Vibe Coding y métodos de solución de problemas | ✅ |
| [Apéndice E: Comparación de 7 Herramientas de Programación AI](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Comparar y probar las principales plataformas de programación AI | ✅ | | [Apéndice E: Comparación de 7 Herramientas de Programación AI](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Comparar y probar las principales plataformas de programación AI | ✅ |
| [Apéndice F: Diseñar Sitios Web con Agentes de Diseño y Programación](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Aprender a usar agentes AI de forma colaborativa | ✅ | | [Apéndice F: Diseñar Sitios Web con Agentes de Diseño y Programación](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Aprender a usar agentes AI de forma colaborativa | ✅ |
### 2. Ingeniero de Desarrollo de Nivel Principiante-Intermedio ### 2. Ingeniero de Desarrollo de Nivel Principiante-Intermedio
+10 -10
View File
@@ -89,19 +89,19 @@ Nous croyons qu'en maîtrisant Vibe Coding et en le combinant avec un entraînem
#### Annexes : Pensée Business #### Annexes : Pensée Business
| Chapitre | Contenu clé | Statut | | Chapitre | Contenu clé | Statut |
| :--------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------- | :----- | | :------------------------------------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------- | :----- |
| [Annexe A : Pensée Produit et Conception de Solution](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Cadres de pensée nécessaires pour créer un produit de zéro à un | ✅ | | [Annexe A : Pensée Produit et Conception de Solution](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Cadres de pensée nécessaires pour créer un produit de zéro à un | ✅ |
| [Annexe B : Référence des Scénarios d'Application AI dans l'Industrie (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Comprendre les applications AI dans différentes industries | ✅ | | [Annexe B : Référence des Scénarios d'Application AI dans l'Industrie (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Comprendre les applications AI dans différentes industries | ✅ |
| [Annexe C : Référence d'Inspiration des Scénarios de Consommation AI (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Explorer les applications AI dans les produits grand public | ✅ | | [Annexe C : Référence d'Inspiration des Scénarios de Consommation AI (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Explorer les applications AI dans les produits grand public | ✅ |
#### Annexes : Solutions Techniques #### Annexes : Solutions Techniques
| Chapitre | Contenu clé | Statut | | Chapitre | Contenu clé | Statut |
| :------------------------------------------------------------------------------------------------------------------------------------------------------------ | :--------------------------------------------------------------------- | :----- | | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | :----------------------------------------------------------------- | :----- |
| [Annexe D : Que Faire en Cas d'Erreur lors de l'Écriture de Code](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Erreurs courantes en Vibe Coding et méthodes de dépannage | ✅ | | [Annexe D : Que Faire en Cas d'Erreur lors de l'Écriture de Code](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Erreurs courantes en Vibe Coding et méthodes de dépannage | ✅ |
| [Annexe E : Comparaison de 7 Outils de Programmation AI](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Comparer et tester les principales plateformes de programmation AI | ✅ | | [Annexe E : Comparaison de 7 Outils de Programmation AI](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | Comparer et tester les principales plateformes de programmation AI | ✅ |
| [Annexe F : Concevoir des Sites Web avec des Agents de Design et de Programmation](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Apprendre à utiliser les agents AI de manière collaborative | ✅ | | [Annexe F : Concevoir des Sites Web avec des Agents de Design et de Programmation](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Apprendre à utiliser les agents AI de manière collaborative | ✅ |
### 2. Ingénieur de Développement Niveau Débutant-Intermédiaire ### 2. Ingénieur de Développement Niveau Débutant-Intermédiaire
+10 -10
View File
@@ -89,19 +89,19 @@ AI でコードを書こうとしてエラーが続き、諦めかけたくな
#### 付録:ビジネス思考 #### 付録:ビジネス思考
| 章 | 主要内容 | 状態 | | 章 | 主要内容 | 状態 |
| :--------------------------------------------------------------------------------------- | :--------------------------------------------------------------- | :--- | | :--------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------- | :--- |
| [付録 A:プロダクト思考とソリューション設計](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | ゼロからイチまでプロダクトを作る際に必要な思考フレームワーク | ✅ | | [付録 A:プロダクト思考とソリューション設計](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | ゼロからイチまでプロダクトを作る際に必要な思考フレームワーク | ✅ |
| [付録 B:AI 業界アプリケーションシナリオ参考 (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | さまざまな業界での AI 応用事例を理解する | ✅ | | [付録 B:AI 業界アプリケーションシナリオ参考 (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | さまざまな業界での AI 応用事例を理解する | ✅ |
| [付録 C:AI 消費シナリオインスピレーション参考 (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | 消費者向け製品での AI 応用事例を探索する | ✅ | | [付録 C:AI 消費シナリオインスピレーション参考 (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | 消費者向け製品での AI 応用事例を探索する | ✅ |
#### 付録:技術ソリューション #### 付録:技術ソリューション
| 章 | 主要内容 | 状態 | | 章 | 主要内容 | 状態 |
| :------------------------------------------------------------------------------------------------------------------------------------------------------ | :--------------------------------------------------------------- | :--- | | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :--- |
| [付録 D:コード作成時にエラーが発生した場合の対処法](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Vibe Coding における一般的なエラーとトラブルシューティング方法 | ✅ | | [付録 D:コード作成時にエラーが発生した場合の対処法](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Vibe Coding における一般的なエラーとトラブルシューティング方法 | ✅ |
| [付録 E:7 つの AI プログラミングツール比較](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | 主流の AI プログラミングプラットフォームの比較テスト | ✅ | | [付録 E:7 つの AI プログラミングツール比較](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | 主流の AI プログラミングプラットフォームの比較テスト | ✅ |
| [付録 F:デザインとプログラミングエージェントでウェブサイトを設計](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | AI エージェントの協調的な使用方法を学ぶ | ✅ | | [付録 F:デザインとプログラミングエージェントでウェブサイトを設計](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | AI エージェントの協調的な使用方法を学ぶ | ✅ |
### 二、初中級開発エンジニア ### 二、初中級開発エンジニア
+9 -9
View File
@@ -89,19 +89,19 @@ AI로 코드를 작성하려고 할 때 오류가 계속 발생하고, 포기하
#### 부록: 비즈니스 사고 #### 부록: 비즈니스 사고
| 장 | 주요 내용 | 상태 | | 장 | 주요 내용 | 상태 |
| :-------------------------------------------------------------------------------------------------- | :------------------------------------------- | :--- | | :---------------------------------------------------------------------------------------------------- | :-------------------------------------------------- | :--- |
| [부록 A: 프로덕트 사고 및 솔루션 설계](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | 0에서 1까지 프로덕트 만들 때 필요한 사고 프레임워크 | ✅ | | [부록 A: 프로덕트 사고 및 솔루션 설계](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | 0에서 1까지 프로덕트 만들 때 필요한 사고 프레임워크 | ✅ |
| [부록 B: AI 산업 적용 시나리오 참조 (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | 다양한 산업에서 AI 적용 사례 이해 | ✅ | | [부록 B: AI 산업 적용 시나리오 참조 (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | 다양한 산업에서 AI 적용 사례 이해 | ✅ |
| [부록 C: AI 소비 시나리오 영감 참조 (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | 소비자 제품에서 AI 적용 사례 탐색 | ✅ | | [부록 C: AI 소비 시나리오 영감 참조 (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | 소비자 제품에서 AI 적용 사례 탐색 | ✅ |
#### 부록: 기술 솔루션 #### 부록: 기술 솔루션
| 장 | 주요 내용 | 상태 | | 장 | 주요 내용 | 상태 |
| :------------------------------------------------------------------------------------------------------------------------------------------------------ | :------------------------------------------- | :--- | | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :-------------------------------------------- | :--- |
| [부록 D: 코드 작성 시 오류 발생 시 대처 방법](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Vibe Coding의 일반적인 오류 및 문제 해결 방법 | ✅ | | [부록 D: 코드 작성 시 오류 발생 시 대처 방법](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Vibe Coding의 일반적인 오류 및 문제 해결 방법 | ✅ |
| [부록 E: 7가지 AI 프로그래밍 도구 비교](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | 주요 AI 프로그래밍 플랫폼 비교 테스트 | ✅ | | [부록 E: 7가지 AI 프로그래밍 도구 비교](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | 주요 AI 프로그래밍 플랫폼 비교 테스트 | ✅ |
| [부록 F: 디자인 및 프로그래밍 에이전트로 웹사이트 설계](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | AI 에이전트 협업 사용 방법 학습 | ✅ | | [부록 F: 디자인 및 프로그래밍 에이전트로 웹사이트 설계](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | AI 에이전트 협업 사용 방법 학습 | ✅ |
### 2. 초중급 개발 엔지니어 ### 2. 초중급 개발 엔지니어
+9 -9
View File
@@ -89,18 +89,18 @@ Chúng tôi tin rằng thông qua việc làm chủ Vibe Coding kết hợp vớ
#### Phụ lục: Tư duy Kinh doanh #### Phụ lục: Tư duy Kinh doanh
| Chương | Nội dung chính | Trạng thái | | Chương | Nội dung chính | Trạng thái |
| :------------------------------------------------------------------------------------------- | :---------------------------------------------------------- | :--------- | | :--------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :--------- |
| [Phụ lục A: Tư duy Sản phẩm và Thiết kế Giải pháp](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Các khung tư duy cần thiết để tạo sản phẩm từ số không đến một | ✅ | | [Phụ lục A: Tư duy Sản phẩm và Thiết kế Giải pháp](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | Các khung tư duy cần thiết để tạo sản phẩm từ số không đến một | ✅ |
| [Phụ lục B: Tham khảo Ứng dụng AI trong Ngành (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Hiểu các ứng dụng AI trong các ngành khác nhau | ✅ | | [Phụ lục B: Tham khảo Ứng dụng AI trong Ngành (B2B)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | Hiểu các ứng dụng AI trong các ngành khác nhau | ✅ |
| [Phụ lục C: Tham khảo Cảm hứng Kịch bản Tiêu dùng AI (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Khám phá các ứng dụng AI trong sản phẩm tiêu dùng | ✅ | | [Phụ lục C: Tham khảo Cảm hứng Kịch bản Tiêu dùng AI (B2C)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | Khám phá các ứng dụng AI trong sản phẩm tiêu dùng | ✅ |
#### Phụ lục: Giải pháp Kỹ thuật #### Phụ lục: Giải pháp Kỹ thuật
| Chương | Nội dung chính | Trạng thái | | Chương | Nội dung chính | Trạng thái |
| :---------------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------- | :--------- | | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------- | :--------- |
| [Phụ lục D: Làm gì khi Gặp lỗi khi Viết Code](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Các lỗi phổ biến trong Vibe Coding và phương pháp khắc phục | ✅ | | [Phụ lục D: Làm gì khi Gặp lỗi khi Viết Code](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | Các lỗi phổ biến trong Vibe Coding và phương pháp khắc phục | ✅ |
| [Phụ lục E: So sánh 7 Công cụ Lập trình AI](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | So sánh và thử nghiệm các nền tảng lập trình AI chính | ✅ | | [Phụ lục E: So sánh 7 Công cụ Lập trình AI](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | So sánh và thử nghiệm các nền tảng lập trình AI chính | ✅ |
| [Phụ lục F: Thiết kế Website với Agent Thiết kế và Lập trình](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Học cách sử dụng AI Agent cộng tác | ✅ | | [Phụ lục F: Thiết kế Website với Agent Thiết kế và Lập trình](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | Học cách sử dụng AI Agent cộng tác | ✅ |
### 2. Kỹ sư phát triển cấp sơ-trung ### 2. Kỹ sư phát triển cấp sơ-trung
-237
View File
@@ -1,237 +0,0 @@
<!-- trigger vercel build -->
<div align="center">
<pre style="font-family: 'Courier New', monospace; font-size: 16px; color: #000000; margin: 0; padding: 0; line-height: 1.2; transform: skew(-1deg, 0deg); display: block;">
███████╗ █████╗ ███████╗██╗ ██╗ ██╗ ██╗██╗██████╗ ███████╗
██╔════╝██╔══██╗██╔════╝╚██╗ ██╔╝ ██║ ██║██║██╔══██╗██╔════╝
█████╗ ███████║███████╗ ╚████╔╝ ██║ ██║██║██████╔╝█████╗
██╔══╝ ██╔══██║╚════██║ ╚██╔╝ ╚██╗ ██╔╝██║██╔══██╗██╔══╝
███████╗██║ ██║███████║ ██║ ╚████╔╝ ██║██████╔╝███████╗
╚══════╝╚═╝ ╚═╝╚══════╝ ╚═╝ ╚═══╝ ╚═╝╚═════╝ ╚══════╝</pre>
# Easy-Vibe: Learn Vibe Coding from 0 to 1
### _零基础、项目制学习、构建第一个 AI 产品_
<p align="center">
📌 <a href="https://datawhalechina.github.io/easy-vibe/">开始在线阅读 (Start Reading Online)</a>
</p>
<p align="center">
<a href="https://datawhalechina.github.io/easy-vibe/">在线阅读</a> ·
<a href="#-内容导航">学习地图</a> ·
<a href="#contact">社区交流</a>
</p>
<p align="center">
<a href="https://github.com/datawhalechina/easy-vibe/stargazers" target="_blank">
<img src="https://img.shields.io/github/stars/datawhalechina/easy-vibe?color=660874&style=for-the-badge&logo=star&logoColor=white&labelColor=1a1a2e" alt="Stars"></a>
<a href="https://github.com/datawhalechina/easy-vibe/network/members" target="_blank">
<img src="https://img.shields.io/github/forks/datawhalechina/easy-vibe?color=660874&style=for-the-badge&logo=git-fork&logoColor=white&labelColor=1a1a2e" alt="Forks"></a>
<a href="LICENSE" target="_blank">
<img src="https://img.shields.io/badge/License-CC_BY_NC_SA_4.0-4ecdc4?style=for-the-badge&logo=creative-commons&logoColor=white&labelColor=1a1a2e" alt="License"></a>
</p>
<p align="center">
<a href="./README.md"><img alt="简体中文" src="https://img.shields.io/badge/简体中文-d9d9d9"></a>
<a href="./README_CHT.md"><img alt="繁體中文" src="https://img.shields.io/badge/繁體中文-d9d9d9"></a>
<a href="./README_EN.md"><img alt="English" src="https://img.shields.io/badge/English-d9d9d9"></a>
<a href="./README_JA.md"><img alt="日本語" src="https://img.shields.io/badge/日本語-d9d9d9"></a>
<a href="./README_ES.md"><img alt="Español" src="https://img.shields.io/badge/Español-d9d9d9"></a>
<a href="./README_FR.md"><img alt="Français" src="https://img.shields.io/badge/Français-d9d9d9"></a>
<a href="./README_KL.md"><img alt="Klingon" src="https://img.shields.io/badge/Klingon-d9d9d9"></a>
<a href="./README_KO.md"><img alt="한국어" src="https://img.shields.io/badge/한국어-d9d9d9"></a>
<a href="./README_AR.md"><img alt="العربية" src="https://img.shields.io/badge/العربية-d9d9d9"></a>
<a href="./README_TR.md"><img alt="Türkçe" src="https://img.shields.io/badge/Türkçe-d9d9d9"></a>
<a href="./README_VI.md"><img alt="Tiếng_Việt" src="https://img.shields.io/badge/Tiếng_Việt-d9d9d9"></a>
<a href="./README_DE.md"><img alt="Deutsch" src="https://img.shields.io/badge/Deutsch-d9d9d9"></a>
<a href="./README_BN.md"><img alt="বাংলা" src="https://img.shields.io/badge/বাংলা-d9d9d9"></a>
</p>
</div>
## 🚀 项目介绍
当你尝试用AI写代码,出错不断,时常想放弃,不清楚如何将程序真正上线 😢。
本教程专门设计,从0到1,带你逐步掌握 Vibe Coding 技巧:
- **第一阶段**:从**小游戏入门**到**Web 应用原型**,掌握 AI 编程基础与产品思维
- **第二阶段**:学习**前后端开发与 AI 能力**相关的 vibecoding 技巧,完成完整应用
- **第三阶段**:掌握**多平台复杂应用**的构建方案,走向生产级应用
我们相信,掌握Vibe Coding并配合系统化训练,一个人就能成为集前后端开发、AI 能力集成、产品设计于一身的开发者。
> **本项目主要面向三类学习者:**
>
> - **新手(普通人 / 产品与运营侧)**:帮助非技术入门学习者听懂关键概念,完成第一个产品原型。
> - **初中级开发者(有一定基础的学生和开发者)**:掌握前后端 vibe coding 与 AI 能力知识。
> - **高级开发者(公司与初创、开源与独立开发者)**:高级开发技巧、多平台开发。
### 📖 内容导航
<div align="center">
<img src="assets/readme-image1.png" alt="Learning Map" width="100%" style="border-radius: 10px; box-shadow: 0 8px 20px rgba(45,55,72,0.3); margin: 15px 0;"/>
</div>
### 总附录
[AI 能力词典:常见 AI 核心概念与名词、场景解释](docs/zh-cn/appendix/ai-capability-dictionary.md)
### 一、新手入门 & PM - 从游戏到 Web 应用原型
| 章节 | 关键内容 | 状态 |
| :--------------------------------------------------------------------------------------------------- | :------------------------------------------------ | :--- |
| [前言:学习地图](docs/zh-cn/stage-0/0.1-learning-map/index.md) | 整体学习路径导览 | ✅ |
| [初级一:AI 时代,会说话就会编程](docs/zh-cn/stage-0/0.2-ai-capabilities-through-games/index.md) | 通过贪吃蛇等案例初步感受 AI 编程的能力 | ✅ |
| [初级二:寻找好想法](docs/zh-cn/stage-1/1.0-finding-great-idea/index.md) | 学会寻找和验证产品想法,找到值得做的项目 | ✅ |
| [初级三:认识 AI IDE 工具](docs/zh-cn/stage-1/1.1-introduction-to-ai-ide/index.md) | 学会使用 IDE,在本地制作小游戏 | ✅ |
| [初级四:动手做出原型](docs/zh-cn/stage-1/1.2-building-prototype/index.md) | 从需求分析、AI 生成单页面,再到生成多页面产品原型 | ✅ |
| [初级五:给原型加上 AI 能力](docs/zh-cn/stage-1/1.3-integrating-ai-capabilities/index.md) | 学会接入常见 AI 能力(文本、图片、视频) | ✅ |
| [初级六:完整项目实战](docs/zh-cn/stage-1/1.4-complete-project-practice/index.md) | 模拟真实场景、接受用户反馈迭代,完整化项目 | ✅ |
#### 附录:业务思维
| 章节 | 关键内容 | 状态 |
| :----------------------------------------------------------------------------------------- | :----------------------------------------- | :--- |
| [附录A:产品思维与方案设计](docs/zh-cn/stage-1/appendix-a-product-thinking/index.md) | 从零到一做产品需要考虑的思维框架 | ✅ |
| [附录B:AI 行业应用场景参考 (B端)](docs/zh-cn/stage-1/appendix-industry-scenarios/index.md) | 了解 AI 在不同产业的应用场景 | ✅ |
| [附录C:AI 消费场景灵感参考 (C端)](docs/zh-cn/stage-1/appendix-c-consumer-scenarios/index.md) | 探索 AI 在消费级产品中的应用场景 | ✅ |
#### 附录:技术方案
| 章节 | 关键内容 | 状态 |
| :-------------------------------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------- | :--- |
| [附录D:写代码时遇到错误怎么办](docs/zh-cn/stage-1/appendix-b-common-errors/index.md) | vibe coding 中的常见错误及排查方法 | ✅ |
| [附录E:七款 AI 编程工具对比](docs/zh-cn/stage-1/appendix-articles/example0-1/vibe-coding-tools-snake-game-tutorial.md) | 对比测试主流 AI 编程平台 | ✅ |
| [附录F:用设计和编程 Agent 设计网站](docs/zh-cn/stage-1/appendix-articles/example0-2/vibe-coding-tools-build-website-with-ai-coding-and-design-agents.md) | 学习如何使用 AI 智能体协同工作 | ✅ |
### 二、初中级开发工程师
#### 前端部分
| 章节 | 关键内容 | 状态 |
| :------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------- | :--- |
| [前端零:使用 lovart 生产素材](docs/zh-cn/stage-2/frontend/2.0-lovart-assets/) | 学会用 lovart 批量生成人物、场景等视觉素材,为 UI 设计和前端开发提供素材基础 | 🚧 |
| [前端一:Figma 与 MasterGo 入门](docs/zh-cn/stage-2/frontend/2.1-figma-mastergo/) | 用设计工具梳理信息架构和页面结构,为前端实现打基础 | 🚧 |
| [前端二:构建第一个现代应用程序-UI 设计](docs/zh-cn/stage-2/frontend/2.2-ui-design/) | 基于设计稿完成组件化界面,实现从设计到代码的第一条链路 | 🚧 |
| [前端三:参考 UI 设计规范与多产品 UI 设计](docs/zh-cn/stage-2/frontend/2.3-multi-product-ui/) | 围绕统一主视觉扩展多产品界面,练习系统化设计能力 | 🚧 |
| [前端四:一起做霍格沃茨画像](docs/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/chapter4-lets-build-hogwarts-portraits.md) | 从 0 到 1 做出接入 AI 能力的前端应用,串联设计与开发 | ✅ |
#### 后端与全栈部分
| 章节 | 关键内容 | 状态 |
| :-------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------ | :--- |
| [后端一:什么是 API](docs/zh-cn/stage-2/backend/2.1-what-is-api/extra2/extra2-what-is-api.md) | 理解 HTTP 接口与请求响应模型,为后端集成与联调做准备 | ✅ |
| [后端二:从数据库到 Supabase](docs/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/chapter5-from-database-to-supabase.md) | 在 Supabase 上落地数据库和 API,打通数据模型与前端页面 | ✅ |
| [后端三:大模型辅助编写接口代码与接口文档](docs/zh-cn/stage-2/backend/2.3-ai-interface-code/) | 用大模型协助生成接口与数据库文档及代码,实现可读可测的后端 | 🚧 |
| [后端四:Git 工作流](docs/zh-cn/stage-2/backend/2.4-git-workflow/extra1/extra1-what-is-git-and-what-is-github.md) | 在 Git 工作流中管理代码,进行版本控制和协作 | ✅ |
| [后端五:Zeabur 部署](docs/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications.md) | 将应用部署到 Zeabur 上线 | ✅ |
| [后端六:现代 CLI 开发工具](docs/zh-cn/stage-2/backend/2.6-modern-cli/extra7/extra7-cli-ai-coding-tools-and-the-principles-of-test-driven-development.md) | 使用 CLI 类 AI 编程工具加速开发与调试,形成个人工程化工作流 | ✅ |
| [后端七:如何集成 Stripe 等收费系统](docs/zh-cn/stage-2/backend/2.7-stripe-payment/) | 接入支付系统,完成收费链路与基础结算流程 | 🚧 |
| [大作业 1:构建第一个现代应用程序-全栈应用](docs/zh-cn/stage-2/assignments/2.1-fullstack-app/) | 综合前端、后端与支付模块,完成可上线的全栈 Web 应用 | 🚧 |
| [大作业 2:现代前端组件库 + Trae 实战](docs/zh-cn/stage-2/assignments/2.2-modern-frontend-trae/) | 使用现代前端组件库与 Trae,独立完成可登录注册并支持收费的产品 | 🚧 |
#### AI 能力附录
| 章节 | 关键内容 | 状态 |
| :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :--- |
| [AI 一:Dify 入门与知识库集成](docs/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/chapter3-getting-started-with-dify-and-its-knowledge-base-integration.md) | 用 Dify Workflow 与基础 RAG 搭建工具类产品,为后续应用升级打样 | ✅ |
| [AI 二:学会查询 AI 词典与集成多模态 API](docs/zh-cn/stage-2/ai-capabilities/2.2-multimodal-api/extra3/extra3-ai-capability-starter-handbook.md) | 学会查找合适的模型与 API,并把文本、图像等多模态能力接入产品 | 🚧 |
### 三、高级开发工程师
| 章节 | 关键内容 | 状态 |
| :------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------- | :--- |
| [高级一:MCP 与 ClaudeCode Skills](docs/zh-cn/stage-3/core-skills/3.1-mcp-claudecode-skills/) | 通过 MCP 与 Skills 扩展 IDE 能力,把外部服务接成工具 | 🚧 |
| [高级二:如何让 Coding Tools 长时间工作](docs/zh-cn/stage-3/core-skills/3.2-long-running-tasks/) | 设计和配置长时间运行的任务,让 Coding Tools 更稳定可靠 | 🚧 |
| [高级三:多平台开发:如何构建微信小程序](docs/zh-cn/stage-3/cross-platform/3.3-wechat-miniprogram/) | 了解微信小程序生态,从官方模板到上线完成一个前端小程序 | ✅ |
| [高级四:多平台开发:如何构建微信小程序-包含后端](docs/zh-cn/stage-3/cross-platform/3.4-wechat-miniprogram-backend/) | 在小程序中接入数据库与后端逻辑,打通完整业务闭环 | 🚧 |
| [高级五:多平台开发:如何构建安卓程序](docs/zh-cn/stage-3/cross-platform/3.5-android-app/) | 使用 Expo 等工具,完成 Web/原生一体化的安卓应用开发 | 🚧 |
| [高级六:多平台开发:如何构建 iOS 程序](docs/zh-cn/stage-3/cross-platform/3.6-ios-app/) | 使用 Expo 等工具,完成 Web/原生一体化的 iOS 应用开发 | 🚧 |
| [高级七:如何构建属于自己的个人网页与学术博客](docs/zh-cn/stage-3/personal-brand/3.7-personal-website-blog/) | 从选型、搭建到部署,构建展示个人项目与学术成果的长久在线主页 | 🚧 |
#### AI 能力附录
| 章节 | 关键内容 | 状态 |
| :-------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------ | :--- |
| [高级 AI 一:什么是 RAG 以及它如何工作](docs/zh-cn/stage-3/ai-advanced/3.a1-rag-introduction/extra5-what-is-rag-and-how-does-it-work-and-future.md) | 系统理解 RAG 原理与常见架构,为复杂应用提供知识检索基础 | ✅ |
| [高级 AI 二:中高级 RAG 与工作流编排:以 LangGraph 为例](docs/zh-cn/stage-3/ai-advanced/3.a2-langgraph-advanced-rag/) | 使用 LangGraph 等工具设计多步工作流与中高级 RAG 系统 | 🚧 |
## 🛠️ 如何学习
- 根据个人能力,选择性地阅读和实践相关章节,如果有问题欢迎 issue 提问。
## 💻 本地启动本课件
### 现代方案
在 AI IDE 对话框(vscode、cursor、trae 等)中,输入下列提示词启动本课件:
```
请你帮我运行这个项目的本地服务
```
### 旧方案
1. npm install
2. npm run dev
3. 打开浏览器访问 `http://localhost:3000` 即可查看。
## 🤝 参与贡献
- 如果你发现了一些问题,或者觉得任何可以改进本项目的地方,可以提 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)进行操作即可~
## 🙏 感谢每位贡献者
- [散步-项目负责人](https://github.com/sanbuphy) (Datawhale成员)
- 方可-指导老师(Datawhale成员, 清华大学)
- [Yerim Kang](https://github.com/yerim25)(实践项目部分-清华大学)
- 赵芷霖(实践项目部分-清华大学)
- [李亦萱](https://yixuan20.github.io/)(页面美术设计-清华大学)
- AI Vibe Coding 101 内测群完整给建议体验的小伙伴们
### 特别感谢
- 感谢 [@Sm1les](https://github.com/Sm1les) 对本项目的帮助与支持
- 感谢所有为本项目做出贡献的开发者们 ❤️
<div align=center style="margin-top: 30px;">
<a href="https://github.com/datawhalechina/easy-vibe/graphs/contributors">
<img src="https://contrib.rocks/image?repo=datawhalechina/easy-vibe" />
</a>
</div>
## <span id="contact">📧 联系我们</span>
<div align=center>
<p>如果有问题提建议吐槽,或者想要一起交流,请扫描下方二维码</p>
<img src="assets/wechat.png" width="280">
<p>扫描下方二维码关注公众号:Datawhale</p>
<img src="https://raw.githubusercontent.com/datawhalechina/pumpkin-book/master/res/qrcode.jpeg" width="180" height="180">
</div>
## 📄 LICENSE
<div align="center">
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">
<img
alt="知识共享许可协议"
style="border-width:0"
src="https://img.shields.io/badge/license-CC%20BY--NC--SA%204.0-lightgrey"
/>
</a>
<br />
本作品采用
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">
知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议
</a>
进行许可。
</div>
## Star History
[![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)
+17 -17
View File
@@ -372,7 +372,7 @@ export default defineConfig({
}, },
{ {
text: '前端四:一起做霍格沃茨画像', text: '前端四:一起做霍格沃茨画像',
link: '/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/chapter4-lets-build-hogwarts-portraits' link: '/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/'
} }
] ]
}, },
@@ -382,11 +382,11 @@ export default defineConfig({
items: [ items: [
{ {
text: '后端一:什么是 API', text: '后端一:什么是 API',
link: '/zh-cn/stage-2/backend/2.1-what-is-api/extra2/extra2-what-is-api' link: '/zh-cn/stage-2/backend/2.1-what-is-api/extra2/'
}, },
{ {
text: '后端二:从数据库到 Supabase', text: '后端二:从数据库到 Supabase',
link: '/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/chapter5-from-database-to-supabase' link: '/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/'
}, },
{ {
text: '后端三:大模型辅助编写接口代码与接口文档', text: '后端三:大模型辅助编写接口代码与接口文档',
@@ -394,15 +394,15 @@ export default defineConfig({
}, },
{ {
text: '后端四:Git 工作流', text: '后端四:Git 工作流',
link: '/zh-cn/stage-2/backend/2.4-git-workflow/extra1/extra1-what-is-git-and-what-is-github' link: '/zh-cn/stage-2/backend/2.4-git-workflow/extra1/'
}, },
{ {
text: '后端五:如何部署 Web 应用', text: '后端五:如何部署 Web 应用',
link: '/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications' link: '/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/'
}, },
{ {
text: '后端六:现代 CLI 开发工具', text: '后端六:现代 CLI 开发工具',
link: '/zh-cn/stage-2/backend/2.6-modern-cli/extra7/extra7-cli-ai-coding-tools-and-the-principles-of-test-driven-development' link: '/zh-cn/stage-2/backend/2.6-modern-cli/extra7/'
}, },
{ {
text: '后端七:如何集成 Stripe 等收费系统', text: '后端七:如何集成 Stripe 等收费系统',
@@ -430,11 +430,11 @@ export default defineConfig({
items: [ items: [
{ {
text: 'AI 一:Dify 入门与知识库集成', text: 'AI 一:Dify 入门与知识库集成',
link: '/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/chapter3-getting-started-with-dify-and-its-knowledge-base-integration' link: '/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/'
}, },
{ {
text: 'AI 二:学会查询 AI 词典与集成多模态 API', text: 'AI 二:学会查询 AI 词典与集成多模态 API',
link: '/zh-cn/stage-2/ai-capabilities/2.2-multimodal-api/extra3/extra3-ai-capability-starter-handbook' link: '/zh-cn/stage-2/ai-capabilities/2.2-multimodal-api/extra3/'
} }
] ]
} }
@@ -492,7 +492,7 @@ export default defineConfig({
items: [ items: [
{ {
text: '高级 AI 一:什么是 RAG 以及它如何工作', text: '高级 AI 一:什么是 RAG 以及它如何工作',
link: '/zh-cn/stage-3/ai-advanced/3.a1-rag-introduction/extra5-what-is-rag-and-how-does-it-work-and-future' link: '/zh-cn/stage-3/ai-advanced/3.a1-rag-introduction/'
}, },
{ {
text: '高级 AI 二:中高级 RAG 与工作流编排 - 以 LangGraph 为例', text: '高级 AI 二:中高级 RAG 与工作流编排 - 以 LangGraph 为例',
@@ -513,23 +513,23 @@ export default defineConfig({
items: [ items: [
{ {
text: 'Extra 1: Git & GitHub', text: 'Extra 1: Git & GitHub',
link: '/zh-cn/extra/extra1/extra1-what-is-git-and-what-is-github' link: '/zh-cn/stage-2/backend/2.4-git-workflow/extra1/'
}, },
{ {
text: 'Extra 2: What is API', text: 'Extra 2: What is API',
link: '/zh-cn/extra/extra2/extra2-what-is-api' link: '/zh-cn/stage-2/backend/2.1-what-is-api/extra2/'
}, },
{ {
text: 'Extra 5: What is RAG', text: 'Extra 5: What is RAG',
link: '/zh-cn/extra/extra5/extra5-what-is-rag-and-how-does-it-work-and-future' link: '/zh-cn/stage-3/ai-advanced/3.a1-rag-introduction/'
}, },
{ {
text: 'Extra 6: Zeabur Deployment', text: 'Extra 6: Zeabur Deployment',
link: '/zh-cn/extra/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications' link: '/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/'
}, },
{ {
text: 'Extra 7: CLI AI Tools & TDD', text: 'Extra 7: CLI AI Tools & TDD',
link: '/zh-cn/extra/extra7/extra7-cli-ai-coding-tools-and-the-principles-of-test-driven-development' link: '/zh-cn/stage-2/backend/2.6-modern-cli/extra7/'
} }
] ]
} }
@@ -555,15 +555,15 @@ export default defineConfig({
items: [ items: [
{ {
text: '前端四:霍格沃茨画像', text: '前端四:霍格沃茨画像',
link: '/zh-cn/project/chapter4/chapter4-lets-build-hogwarts-portraits' link: '/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/'
}, },
{ {
text: '后端二:Supabase 数据库', text: '后端二:Supabase 数据库',
link: '/zh-cn/project/chapter5/chapter5-from-database-to-supabase' link: '/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/'
}, },
{ {
text: 'AI 一:Dify & Knowledge Base', text: 'AI 一:Dify & Knowledge Base',
link: '/zh-cn/project/chapter3/chapter3-getting-started-with-dify-and-its-knowledge-base-integration' link: '/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/'
} }
] ]
} }
+6 -6
View File
@@ -39,7 +39,7 @@
</div> </div>
</a> </a>
<a href="/ja-jp/stage-2/frontend/2.4-hogwarts-portraits/chapter4-lets-build-hogwarts-portraits" class="card-link"> <a href="/ja-jp/stage-2/frontend/2.4-hogwarts-portraits/" class="card-link">
<div class="content-card"> <div class="content-card">
<div class="card-header"> <div class="card-header">
<span class="card-icon">🧙</span> <span class="card-icon">🧙</span>
@@ -55,7 +55,7 @@
API設計、データベース管理、アプリケーションデプロイメント戦略を学ぶ: API設計、データベース管理、アプリケーションデプロイメント戦略を学ぶ:
<NavGrid> <NavGrid>
<a href="/ja-jp/stage-2/backend/2.2-database-supabase/chapter5/chapter5-from-database-to-supabase" class="card-link"> <a href="/ja-jp/stage-2/backend/2.2-database-supabase/chapter5/" class="card-link">
<div class="content-card"> <div class="content-card">
<div class="card-header"> <div class="card-header">
<span class="card-icon">🗄️</span> <span class="card-icon">🗄️</span>
@@ -75,7 +75,7 @@ API設計、データベース管理、アプリケーションデプロイメ
</div> </div>
</a> </a>
<a href="/ja-jp/stage-2/backend/2.4-git-workflow/extra1/extra1-what-is-git-and-what-is-github" class="card-link"> <a href="/ja-jp/stage-2/backend/2.4-git-workflow/extra1/" class="card-link">
<div class="content-card"> <div class="content-card">
<div class="card-header"> <div class="card-header">
<span class="card-icon">🌿</span> <span class="card-icon">🌿</span>
@@ -85,7 +85,7 @@ API設計、データベース管理、アプリケーションデプロイメ
</div> </div>
</a> </a>
<a href="/ja-jp/stage-2/backend/2.5-zeabur-deployment/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications" class="card-link"> <a href="/ja-jp/stage-2/backend/2.5-zeabur-deployment/extra6/" class="card-link">
<div class="content-card"> <div class="content-card">
<div class="card-header"> <div class="card-header">
<span class="card-icon">🚀</span> <span class="card-icon">🚀</span>
@@ -95,7 +95,7 @@ API設計、データベース管理、アプリケーションデプロイメ
</div> </div>
</a> </a>
<a href="/ja-jp/stage-2/backend/2.6-modern-cli/extra7/extra7-cli-ai-coding-tools-and-the-principles-of-test-driven-development" class="card-link"> <a href="/ja-jp/stage-2/backend/2.6-modern-cli/extra7/" class="card-link">
<div class="content-card"> <div class="content-card">
<div class="card-header"> <div class="card-header">
<span class="card-icon">💻</span> <span class="card-icon">💻</span>
@@ -135,7 +135,7 @@ API設計、データベース管理、アプリケーションデプロイメ
### AI機能拡張 ### AI機能拡張
<NavGrid> <NavGrid>
<a href="/ja-jp/stage-2/ai-capabilities/2.2-multimodal-api/extra3/extra3-ai-capability-starter-handbook" class="card-link"> <a href="/ja-jp/stage-2/ai-capabilities/2.2-multimodal-api/extra3/" class="card-link">
<div class="content-card"> <div class="content-card">
<div class="card-header"> <div class="card-header">
<span class="card-icon">🎭</span> <span class="card-icon">🎭</span>
File diff suppressed because it is too large Load Diff
+3 -3
View File
@@ -53,14 +53,14 @@
| 前端一:Figma 与 MasterGo 入门 | 用设计工具梳理信息架构和页面结构,为前端实现打基础 | 🚧 | | 前端一:Figma 与 MasterGo 入门 | 用设计工具梳理信息架构和页面结构,为前端实现打基础 | 🚧 |
| 前端二:构建第一个现代应用程序-UI 设计 | 基于设计稿完成组件化界面,实现从设计到代码的第一条链路 | 🚧 | | 前端二:构建第一个现代应用程序-UI 设计 | 基于设计稿完成组件化界面,实现从设计到代码的第一条链路 | 🚧 |
| 前端三:参考 UI 设计规范与多产品 UI 设计 | 围绕统一主视觉扩展多产品界面,练习系统化设计能力 | 🚧 | | 前端三:参考 UI 设计规范与多产品 UI 设计 | 围绕统一主视觉扩展多产品界面,练习系统化设计能力 | 🚧 |
| [前端四:一起做霍格沃茨画像](/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/chapter4-lets-build-hogwarts-portraits) | 从 0 到 1 做出接入 AI 能力的前端应用,串联设计与开发 | 🚧 | | [前端四:一起做霍格沃茨画像](/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/) | 从 0 到 1 做出接入 AI 能力的前端应用,串联设计与开发 | 🚧 |
#### 后端与全栈部分 #### 后端与全栈部分
| 章节 | 关键内容 | 状态 | | 章节 | 关键内容 | 状态 |
| :---------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------ | :--- | | :---------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------ | :--- |
| 后端一:什么是 API | 理解 HTTP 接口与请求响应模型,为后端集成与联调做准备 | 🚧 | | 后端一:什么是 API | 理解 HTTP 接口与请求响应模型,为后端集成与联调做准备 | 🚧 |
| [后端二:从数据库到 Supabase](/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/chapter5-from-database-to-supabase) | 在 Supabase 上落地数据库和 API,打通数据模型与前端页面 | 🚧 | | [后端二:从数据库到 Supabase](/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/) | 在 Supabase 上落地数据库和 API,打通数据模型与前端页面 | 🚧 |
| 后端三:大模型辅助编写接口代码与接口文档 | 用大模型协助生成接口与数据库文档及代码,实现可读可测的后端 | 🚧 | | 后端三:大模型辅助编写接口代码与接口文档 | 用大模型协助生成接口与数据库文档及代码,实现可读可测的后端 | 🚧 |
| 后端四:Git 工作流与 Zeabur 部署 | 在 Git 工作流中管理代码,并将应用部署到 Zeabur 上线 | 🚧 | | 后端四:Git 工作流与 Zeabur 部署 | 在 Git 工作流中管理代码,并将应用部署到 Zeabur 上线 | 🚧 |
| 后端五:现代 CLI 开发工具 | 使用 CLI 类 AI 编程工具加速开发与调试,形成个人工程化工作流 | 🚧 | | 后端五:现代 CLI 开发工具 | 使用 CLI 类 AI 编程工具加速开发与调试,形成个人工程化工作流 | 🚧 |
@@ -72,7 +72,7 @@
| 章节 | 关键内容 | 状态 | | 章节 | 关键内容 | 状态 |
| :-------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :--- | | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :--- |
| [AI 一:Dify 入门与知识库集成](/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/chapter3-getting-started-with-dify-and-its-knowledge-base-integration) | 用 Dify Workflow 与基础 RAG 搭建工具类产品,为后续应用升级打样 | 🚧 | | [AI 一:Dify 入门与知识库集成](/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/) | 用 Dify Workflow 与基础 RAG 搭建工具类产品,为后续应用升级打样 | 🚧 |
| AI 二:学会查询 AI 词典与集成多模态 API | 学会查找合适的模型与 API,并把文本、图像等多模态能力接入产品 | 🚧 | | AI 二:学会查询 AI 词典与集成多模态 API | 学会查找合适的模型与 API,并把文本、图像等多模态能力接入产品 | 🚧 |
### 三、高级开发工程师 ### 三、高级开发工程师
+6 -6
View File
@@ -29,14 +29,14 @@
<NavGrid> <NavGrid>
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-1/1.0-finding-great-idea/" href="/easy-vibe/zh-cn/stage-1/1.1-introduction-to-ai-ide/"
title="1. 找到好点子" title="1. 学会 AI 编程工具"
description="学会寻找和验证产品想法,找到值得做的项目。" description="了解当前主流的 AI 编程工具,选择最适合你的开发搭档。"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-1/1.1-introduction-to-ai-ide/" href="/easy-vibe/zh-cn/stage-1/1.0-finding-great-idea/"
title="2. 学会 AI 编程工具" title="2. 找到好点子"
description="了解当前主流的 AI 编程工具,选择最适合你的开发搭档。" description="学会寻找和验证产品想法,找到值得做的项目。"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-1/1.2-building-prototype/" href="/easy-vibe/zh-cn/stage-1/1.2-building-prototype/"
@@ -484,7 +484,69 @@ const duration = '约 <strong>3 小时</strong>'
这一节,我们将学习如何从普通想法中发现真实痛点。 这一节,我们将学习如何从普通想法中发现真实痛点。
### 2.1 案例:从"卡路里测量"中发现痛点 ### 2.1 从爱好出发——找到你真正热爱的领域
在寻找创业点子时,有一个被严重低估的方法:<strong>从你自己的爱好出发</strong>。
::: tip 为什么爱好是最好的起点?
**1. 你天然理解这个群体**
- 你自己就是用户,你知道这个群体的真实痛点
- 你了解他们的语言、习惯、情感诉求
- 你不需要做大量的用户调研,因为你就在其中
**2. 热情是最好的驱动力**
- 创业是漫长而艰难的旅程,热爱让你能坚持更久
- 你会愿意花时间去深入了解,不断打磨产品
- 即使遇到困难,热情也会推动你找到解决方案
**3. 天然的用户共情能力**
- 你能感同身受地理解用户的 frustrations
- 你知道什么功能真正重要,什么是锦上添花
- 你的产品决策会更贴近真实需求
:::
::: info 案例:从爱好中诞生的成功产品
**案例一:Strava(运动社交平台)**
- 创始人是狂热的自行车爱好者
- 他发现骑行者渴望记录和分享自己的路线、成绩
- 因为自己就是用户,所以产品功能非常贴合需求
- 现在成为全球最大的运动社交平台之一
**案例二:Notion(笔记工具)**
- 创始人是效率工具的重度用户
- 他自己就是目标用户,深知知识管理的痛点
- 从个人需求出发,逐步扩展到团队协作
- 现在估值超过 100 亿美元
**案例三:B站(哔哩哔哩)**
- 创始人徐逸本身就是二次元文化的爱好者
- 他深刻理解 ACG 群体的需求和社区文化
- 从个人兴趣出发,打造了独特的弹幕文化
- 现在成为中国最大的年轻人文化社区
:::
::: warning 关键洞察:你的爱好 + 群体痛点 = 最好的种子用户
当你从自己的爱好出发时:
- <strong>你天然可以共情</strong>——你知道用户的喜怒哀乐
- <strong>你拥有最好的种子用户</strong>——你的朋友、同好就是这个群体
- <strong>你能做出最好的应用</strong>——因为你真正理解需求
**问问自己:**
1. 你平时最喜欢做什么?(游戏、运动、阅读、音乐、手工……)
2. 在这个爱好中,你有什么 frustrations
3. 你的同好们经常抱怨什么?
4. 如果有一个产品能解决这些问题,你会用吗?会付费吗?
**记住:** 最好的产品往往诞生于创始人解决自己问题的过程中。
:::
### 2.2 案例:从"卡路里测量"中发现痛点
让我们从一个最简单的 idea 开始,看看如何从中发现真实痛点。 让我们从一个最简单的 idea 开始,看看如何从中发现真实痛点。
@@ -253,7 +253,7 @@ const duration = '约 <strong>8 小时</strong>'
## 2. 10分钟产出原型:让 AI IDE 落地"核心玩法" ## 2. 10分钟产出原型:让 AI IDE 落地"核心玩法"
::: info 💡 编程 Plan 建议 ::: info 💡 编程 Plan 建议
如果你觉得当前 IDE 不够聪明,或者觉得很快就花完了额度,你可以去买一个**编程 Plan 计划**。提前预习参考[这个文章](../../stage-2/backend/2.6-modern-cli/extra7/extra7-cli-ai-coding-tools-and-the-principles-of-test-driven-development.md)使用 Claude 进行编程。 如果你觉得当前 IDE 不够聪明,或者觉得很快就花完了额度,你可以去买一个**编程 Plan 计划**。提前预习参考[这个文章](../../stage-2/backend/2.6-modern-cli/extra7/)使用 Claude 进行编程。
::: :::
Thinking 是好事,但不可 over thinking,我们就此控制过度反思,尝试从单个页面开始制作原型。 Thinking 是好事,但不可 over thinking,我们就此控制过度反思,尝试从单个页面开始制作原型。
@@ -1,4 +1,4 @@
# Project 3: Dify 入门与知识库集成 # Dify 入门与知识库集成
# 回顾上节课 # 回顾上节课
@@ -210,7 +210,7 @@ Dify 是一个用于开发 LLM 应用的开源平台。它提供了直观的界
本部分内容原本安排在后续课程中详细介绍,但考虑到当前部分学习者可能因网络限制暂时无法访问 Dify 官方网站或云端服务,我们决定提前提供这一可选的学习路径,帮助你顺利推进课程进度。 本部分内容原本安排在后续课程中详细介绍,但考虑到当前部分学习者可能因网络限制暂时无法访问 Dify 官方网站或云端服务,我们决定提前提供这一可选的学习路径,帮助你顺利推进课程进度。
你需要参考该教程入门 Zeabur 部署平台的基本使用方式:[Extra Knowledge 6 - Zeabur: What Is It and How to Deploy Web Applications](https://github.com/datawhalechina/easy-vibe/blob/main/docs/extra/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications.md) 你需要参考该教程入门 web 部署平台的基本使用方式:[如何部署 Web 应用](/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/)
![](images/image13.png) ![](images/image13.png)
@@ -1,4 +1,4 @@
# 扩展知识 2 - API 开发手册:从核心逻辑到 AI 场景集成 # API 开发手册:从核心逻辑到 AI 场景集成
随着数字化进程的加速,我们每天都在与成百上千个软件系统打交道。但对于初学者来说,一个始终绕不开的困惑是:**这些看起来互不相干的应用,到底是怎么“对话”的?** 为什么我在这个 App 里点一下,另一个 App 就能立刻做出反应? 随着数字化进程的加速,我们每天都在与成百上千个软件系统打交道。但对于初学者来说,一个始终绕不开的困惑是:**这些看起来互不相干的应用,到底是怎么“对话”的?** 为什么我在这个 App 里点一下,另一个 App 就能立刻做出反应?
@@ -1,4 +1,4 @@
# Project 5: 从数据库到 Supabase # 从数据库到 Supabase
在上节课中,我们学会了 UI 设计程序 Mastergo 和 Figma 的基本用法,能够使用 github 进行代码的获取与版本管理,并通过 Zeabur 部署网站将自己的应用 / 网站传达给更多人使用。 在上节课中,我们学会了 UI 设计程序 Mastergo 和 Figma 的基本用法,能够使用 github 进行代码的获取与版本管理,并通过 Zeabur 部署网站将自己的应用 / 网站传达给更多人使用。
@@ -1,4 +1,4 @@
# 扩展知识 1 - 什么是 Git 和 GitHub # 什么是 Git 和 GitHub
在之前的课程中,我们学习了如何使用基于 Web 的 vibe coding 工具编写代码。每次对话都会创建一个新版本的代码。但是,让我们思考一个问题:如果我们想恢复到之前的修改,有没有方便的方法?有没有一种工具可以记录我们在不同阶段的代码,使我们能够随时在不同版本之间切换和修改? 在之前的课程中,我们学习了如何使用基于 Web 的 vibe coding 工具编写代码。每次对话都会创建一个新版本的代码。但是,让我们思考一个问题:如果我们想恢复到之前的修改,有没有方便的方法?有没有一种工具可以记录我们在不同阶段的代码,使我们能够随时在不同版本之间切换和修改?
@@ -1,4 +1,4 @@
# 扩展知识 6 - 如何部署 Web 应用 # 如何部署 Web 应用
在本教程中,我们将介绍如何将你的 Web 应用部署到互联网上,让其他人可以访问。我们会介绍三个常用的部署平台:**腾讯云 CloudBase**、**Vercel** 和 **Zeabur**,帮助你快速完成从"写好代码"到"让别人可以在互联网上访问你的网站"的完整流程。 在本教程中,我们将介绍如何将你的 Web 应用部署到互联网上,让其他人可以访问。我们会介绍三个常用的部署平台:**腾讯云 CloudBase**、**Vercel** 和 **Zeabur**,帮助你快速完成从"写好代码"到"让别人可以在互联网上访问你的网站"的完整流程。
@@ -1,4 +1,4 @@
# 扩展知识 7 - CLI AI 编程工具与测试驱动开发原则 # CLI AI 编程工具与测试驱动开发原则
在本教程中,我们将介绍直接在命令行中运行的 AI 编程 Agent。它们和之前学过的 Trae、Cursor 中的 Agent 不同,CLI AI 编程工具只能在终端中使用。与集成在 AI IDE 里的 Agent 相比,它们通常具有更长的上下文窗口、更快的工具调用速度,并且可以兼容更多种类的大模型。在最新的 AI Vibe Coding 实战中,我们往往会优先使用 CLI AI 编程工具,而不是 IDE 内置的编码 Agent。 在本教程中,我们将介绍直接在命令行中运行的 AI 编程 Agent。它们和之前学过的 Trae、Cursor 中的 Agent 不同,CLI AI 编程工具只能在终端中使用。与集成在 AI IDE 里的 Agent 相比,它们通常具有更长的上下文窗口、更快的工具调用速度,并且可以兼容更多种类的大模型。在最新的 AI Vibe Coding 实战中,我们往往会优先使用 CLI AI 编程工具,而不是 IDE 内置的编码 Agent。
@@ -1,3 +1,3 @@
# 后端六:如何集成 Stripe 等收费系统 # 如何集成 Stripe 等收费系统
> 本章节正在编写中,敬请期待... > 本章节正在编写中,敬请期待...
@@ -533,9 +533,9 @@ curl -X POST 'http://xxxxxxxx/v1/chat-messages' \
终于,恭喜你顺利完成了 Hogwarts Portraits 页面的开发实现!接下来我们需要将它上传到 GitHub 平台,并将其部署到公共环境让所有人都能访问。 终于,恭喜你顺利完成了 Hogwarts Portraits 页面的开发实现!接下来我们需要将它上传到 GitHub 平台,并将其部署到公共环境让所有人都能访问。
你需要参考该教程,对如何使用 Github 进行研究,将自己的项目上传至 Github:[什么是 Github](https://datawhalechina.github.io/easy-vibe/stage-2/backend/2.4-git-workflow/extra1/extra1-what-is-git-and-what-is-github.html) 你需要参考该教程,对如何使用 Github 进行研究,将自己的项目上传至 Github:[什么是 Github](https://datawhalechina.github.io/easy-vibe/stage-2/backend/2.4-git-workflow/extra1/)
此外,你还需要学会如何使用 Zeabur,将其连接到 Github,并成功部署你的项目:[什么是 Zeabur](https://datawhalechina.github.io/easy-vibe/stage-2/backend/2.5-zeabur-deployment/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications.html) 此外,你还需要学会如何使用 Zeabur,将其连接到 Github,并成功部署你的项目:[什么是 Zeabur](https://datawhalechina.github.io/easy-vibe/stage-2/backend/2.5-zeabur-deployment/extra6/)
如果你觉得自己开发一套 Hogwarts Portraits 项目很困难,你可以先从参考别的项目开始进行修改,本节课的官方代码地址为:https://github.com/THU-SIGS-AIID/Project4-Hogwarts-Portraits 如果你觉得自己开发一套 Hogwarts Portraits 项目很困难,你可以先从参考别的项目开始进行修改,本节课的官方代码地址为:https://github.com/THU-SIGS-AIID/Project4-Hogwarts-Portraits
+9 -9
View File
@@ -30,7 +30,7 @@
description="学习主流 UI 设计规范,提升产品设计的一致性与美感" description="学习主流 UI 设计规范,提升产品设计的一致性与美感"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/chapter4-lets-build-hogwarts-portraits" href="/easy-vibe/zh-cn/stage-2/frontend/2.4-hogwarts-portraits/"
title="前端四:一起做霍格沃茨画像" title="前端四:一起做霍格沃茨画像"
description="实战项目:结合 AI 生成的图像,构建一个交互式的霍格沃茨画像应用" description="实战项目:结合 AI 生成的图像,构建一个交互式的霍格沃茨画像应用"
/> />
@@ -42,12 +42,12 @@
<NavGrid> <NavGrid>
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/backend/2.1-what-is-api/extra2/extra2-what-is-api" href="/easy-vibe/zh-cn/stage-2/backend/2.1-what-is-api/extra2/"
title="后端一:什么是 API" title="后端一:什么是 API"
description="理解 API 的核心概念,它是前后端交互的桥梁" description="理解 API 的核心概念,它是前后端交互的桥梁"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/chapter5-from-database-to-supabase" href="/easy-vibe/zh-cn/stage-2/backend/2.2-database-supabase/chapter5/"
title="后端二:从数据库到 Supabase" title="后端二:从数据库到 Supabase"
description="掌握关系型数据库基础,并学习使用 Supabase 这一现代 BaaS 平台" description="掌握关系型数据库基础,并学习使用 Supabase 这一现代 BaaS 平台"
/> />
@@ -57,17 +57,17 @@
description="利用 AI 辅助生成后端接口代码及标准的接口文档,提升开发效率" description="利用 AI 辅助生成后端接口代码及标准的接口文档,提升开发效率"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/backend/2.4-git-workflow/extra1/extra1-what-is-git-and-what-is-github" href="/easy-vibe/zh-cn/stage-2/backend/2.4-git-workflow/extra1/"
title="后端四:Git 工作流" title="后端四:Git 工作流"
description="掌握 Git 版本控制系统的核心操作与协作流程" description="掌握 Git 版本控制系统的核心操作与协作流程"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/extra6-zeabur-what-is-it-and-how-to-deploy-web-applications" href="/easy-vibe/zh-cn/stage-2/backend/2.5-zeabur-deployment/extra6/"
title="后端五:Zeabur 部署" title="后端五:如何部署 Web 应用"
description="学习使用 Zeabur 快速部署你的全栈应用到云端" description="学习使用 Zeabur 快速部署你的全栈应用到云端"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/backend/2.6-modern-cli/extra7/extra7-cli-ai-coding-tools-and-the-principles-of-test-driven-development" href="/easy-vibe/zh-cn/stage-2/backend/2.6-modern-cli/extra7/"
title="后端六:现代 CLI 开发工具" title="后端六:现代 CLI 开发工具"
description="探索现代 CLI 工具,提升命令行环境下的开发体验" description="探索现代 CLI 工具,提升命令行环境下的开发体验"
/> />
@@ -99,12 +99,12 @@
<NavGrid> <NavGrid>
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/chapter3-getting-started-with-dify-and-its-knowledge-base-integration" href="/easy-vibe/zh-cn/stage-2/ai-capabilities/2.1-dify-knowledge-base/chapter3/"
title="AI 一:Dify 入门与知识库集成" title="AI 一:Dify 入门与知识库集成"
description="学习使用 Dify 构建 AI 应用,并集成私有知识库" description="学习使用 Dify 构建 AI 应用,并集成私有知识库"
/> />
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-2/ai-capabilities/2.2-multimodal-api/extra3/extra3-ai-capability-starter-handbook" href="/easy-vibe/zh-cn/stage-2/ai-capabilities/2.2-multimodal-api/extra3/"
title="AI 二:学会查询 AI 词典与集成多模态 API" title="AI 二:学会查询 AI 词典与集成多模态 API"
description="探索更多 AI 能力,集成视觉、语音等多模态 API" description="探索更多 AI 能力,集成视觉、语音等多模态 API"
/> />
+1 -1
View File
@@ -66,7 +66,7 @@
<NavGrid> <NavGrid>
<NavCard <NavCard
href="/easy-vibe/zh-cn/stage-3/ai-advanced/3.a1-rag-introduction/extra5-what-is-rag-and-how-does-it-work-and-future" href="/easy-vibe/zh-cn/stage-3/ai-advanced/3.a1-rag-introduction/"
title="高级 AI 一:什么是 RAG 以及它如何工作" title="高级 AI 一:什么是 RAG 以及它如何工作"
description="深入理解检索增强生成 (RAG) 的原理及其在 AI 应用中的价值" description="深入理解检索增强生成 (RAG) 的原理及其在 AI 应用中的价值"
/> />