docs: stage-1 i18n coverage + news
This commit is contained in:
@@ -0,0 +1,82 @@
|
||||
# Project Introduction
|
||||
|
||||
2025 is regarded by many as the first year of AI programming. More and more people are starting to use AI to write code, but what they produce often remains at the toy level — they don't know how to use Vibe Coding to organize their development workflow, which tools to choose, or what critical steps lie between a prototype and a live product.
|
||||
|
||||
We adopt a progressive **three-stage practical learning path**: a beginner onboarding stage where you quickly get started with AI programming through mini-games, Stage 1 where you master the Vibe Coding workflow and complete a web application prototype, Stage 2 where you learn full-stack development and deployment, and Stage 3 where you build cross-platform complex applications.
|
||||
|
||||
Each stage comes with a complete hands-on project, guiding you from toy to product through real-world challenges, ultimately equipping you with the ability to **turn any idea into a working application**.
|
||||
|
||||
We believe that by mastering Vibe Coding combined with systematic training, you alone can become a **versatile developer who combines front-end and back-end development, AI capability integration, and product design**.
|
||||
|
||||
This project is primarily designed for three types of learners:
|
||||
|
||||
- **Beginners (non-technical people / product and operations roles)**: Help non-technical stakeholders and entry-level learners understand key concepts and complete their first AI-powered tool or product prototype.
|
||||
- **Junior to mid-level developers (students and developers with some foundation)**: Systematically master Vibe Coding and native AI application development.
|
||||
- **Senior developers (companies and startups, open-source and independent developers)**: Support teams and individuals in rapidly building, validating, and iterating on native AI applications.
|
||||
|
||||
## 📖 Content Navigation
|
||||
|
||||
### General Appendix
|
||||
|
||||
[AI Capability Dictionary: Common AI core concepts, terminology, and scenario explanations](/en/appendix/8-artificial-intelligence/ai-capability-dictionary)
|
||||
|
||||
### Stage 0: Kindergarten
|
||||
|
||||
| Chapter | Key Content | Status |
|
||||
| :------------------------------------------------------------------------------------------- | :------------------------------------------------------------- | :----- |
|
||||
| [Beginner Onboarding: Learning Map](/en/stage-1/learning-map/) | Overview of the complete learning path | ✅ |
|
||||
| [Beginner Onboarding: In the AI Era, If You Can Talk, You Can Code](/en/stage-1/ai-capabilities-through-games/) | Get an initial feel for AI programming capabilities through cases like Snake | ✅ |
|
||||
|
||||
### Stage 1: AI Product Manager
|
||||
|
||||
| Chapter | Key Content | Status |
|
||||
| :------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------- | :----- |
|
||||
| [1.2: Getting to Know AI IDE Tools](/en/stage-1/introduction-to-ai-ide/) | Learn to use an IDE, master the interface structure and efficient prompting | ✅ |
|
||||
| [1.3: Build a Prototype Hands-On](/en/stage-1/building-prototype/) | A complete loop from product analysis and breakdown to multi-page product prototype implementation | ✅ |
|
||||
| [1.4: Adding AI Capabilities to Your Prototype](/en/stage-1/integrating-ai-capabilities/) | Understand and complete API integration for common AI capabilities (text, image, video) | ✅ |
|
||||
| [1.5: Complete Project Practice](/en/stage-1/complete-project-practice/) | Simulate real-world scenarios, iterate based on user feedback, and complete a project showcase (includes a final assignment) | ✅ |
|
||||
|
||||
#### Appendix
|
||||
|
||||
| Chapter | Key Content | Status |
|
||||
| :----------------------------------------------------------------------- | :------------------------------------------------------------------------------------ | :----- |
|
||||
| [Appendix A: Product Thinking Supplement](/en/stage-1/appendix-a-product-thinking/) | A product thinking framework from idea evaluation to requirement breakdown and MVP | ✅ |
|
||||
| [Appendix B: Common Errors and Solutions](/en/stage-1/appendix-b-common-errors/) | Common errors and troubleshooting methods in Vibe Coding | ✅ |
|
||||
| [Appendix: Where to Find Ideas](/en/stage-1/appendix-idea-sources/) | Discover niche directions from reference apps, trends, and VC lists | ✅ |
|
||||
| [Appendix: Double Diamond Model](/en/stage-1/appendix-double-diamond/) | Understand the complete rhythm of defining the problem first, then expanding into solution design | ✅ |
|
||||
| [Appendix: Jobs to Be Done](/en/stage-1/appendix-jobs-to-be-done/) | Use the JTBD method to understand what users truly want to accomplish | ✅ |
|
||||
| [Appendix: The Mom Test Interview Method](/en/stage-1/appendix-mom-test/) | A research method for validating needs through user interviews | ✅ |
|
||||
|
||||
### Stage 2: Junior to Mid-level Developer
|
||||
|
||||
#### Front-end Section
|
||||
|
||||
| Chapter | Key Content | Status |
|
||||
| :--------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------ | :----- |
|
||||
| Using Lovart to produce assets | Learn to use Lovart to batch-generate character, scene, and other visual assets, providing a foundation for UI design and front-end development | 🚧 |
|
||||
| Getting started with Figma and MasterGo | Use design tools to organize information architecture and page structure, laying the groundwork for front-end implementation | 🚧 |
|
||||
| Building your first modern application — UI design | Complete a component-based interface from design mockups, implementing the first link from design to code | 🚧 |
|
||||
| Designing pages and buttons following UI design specifications | Learn to use mainstream design specifications to organize page structure and button hierarchy, and leverage AI to generate design proposals | 🚧 |
|
||||
| [Let's Build Hogwarts Portraits Together](/en/stage-2/frontend/hogwarts-portraits/) | Build a front-end application with AI capabilities from scratch, connecting design and development | 🚧 |
|
||||
|
||||
#### Back-end Development Section
|
||||
|
||||
| Chapter | Key Content | Status |
|
||||
| :------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------ | :----- |
|
||||
| What is an API | Understand HTTP interfaces and the request-response model, preparing for back-end integration and debugging | 🚧 |
|
||||
| [From Database to Supabase](/en/stage-2/backend/database-supabase/) | Set up databases and APIs on Supabase, connecting data models to front-end pages | 🚧 |
|
||||
| Using large language models to assist in writing interface code and documentation | Use LLMs to help generate interface and database documentation and code, creating readable and testable back-end services | 🚧 |
|
||||
| Git workflows and Zeabur deployment | Manage code with Git workflows and deploy applications to Zeabur for going live | 🚧 |
|
||||
| Modern CLI development tools | Use CLI-based AI programming tools to accelerate development and debugging, forming a personal engineering workflow | 🚧 |
|
||||
| How to integrate payment systems like Stripe | Integrate payment systems, completing the payment flow and basic settlement process | 🚧 |
|
||||
| Building your first modern application — full-stack application | Combine front-end, back-end, and payment modules to deliver a deployable full-stack web application | 🚧 |
|
||||
| Modern front-end component library + Trae in practice | Use a modern front-end component library with Trae to independently build a product with login/registration and payment support | 🚧 |
|
||||
|
||||
#### AI Capabilities Appendix
|
||||
|
||||
| Chapter | Key Content | Status |
|
||||
| :----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------ | :----- |
|
||||
| [Getting Started with Dify and Knowledge Base Integration](/en/stage-2/ai-capabilities/dify-knowledge-base/) | Build tool-type products using Dify Workflow and basic RAG, creating a template for future application upgrades | 🚧 |
|
||||
| Learning to query the AI dictionary and integrate multi-modal APIs | Learn to find suitable models and APIs, and integrate text, image, and other multi-modal capabilities into your product | 🚧 |
|
||||
|
||||
### Stage 3: Senior Developer
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: 'Beginner 1: In The AI Era, Talking Is Programming'
|
||||
description: 'Build an AI-native snake game through conversation, then generalize the workflow to create your own mini game or demo.'
|
||||
---
|
||||
|
||||
# Primary 1: AI Era, If You Can Speak, You Can Code
|
||||
|
||||
This is a **project-based learning** tutorial. We encourage you to follow the steps one by one and try to reproduce the results.
|
||||
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: 'Comparison Of 7 AI Coding Tools'
|
||||
description: 'A hands-on benchmark of popular Web Vibe Coding platforms using one unified task, covering beginner-friendliness, code control, and deployment.'
|
||||
---
|
||||
|
||||
# Seven AI Programming Tools Comparison
|
||||
|
||||
## Chapter Introduction
|
||||
|
||||
+5
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: 'Build A Website With Design + Coding Agents'
|
||||
description: 'From idea to launch: coordinate a design agent to produce visuals, then use a coding agent to turn it into a working website with a reusable workflow.'
|
||||
---
|
||||
|
||||
# Designing Websites with Design and Programming Agents
|
||||
|
||||
## Chapter Introduction
|
||||
|
||||
@@ -452,7 +452,7 @@ curl -X POST https://ark.cn-beijing.volces.com/api/v3/images/generations \
|
||||
-H "Authorization: Bearer xxxxxxx" \
|
||||
-d '{
|
||||
"model": "doubao-seedream-4-5-251128",
|
||||
"prompt": "将图1的服装换为图2的服装",
|
||||
"prompt": "Replace the outfit in image 1 with the outfit in image 2",
|
||||
"image": ["https://ark-project.tos-cn-beijing.volces.com/doc_image/seedream4_imagesToimage_1.png", "https://ark-project.tos-cn-beijing.volces.com/doc_image/seedream4_imagesToimage_2.png"],
|
||||
"sequential_image_generation": "disabled",
|
||||
"response_format": "url",
|
||||
|
||||
@@ -1,3 +1,7 @@
|
||||
---
|
||||
title: 'Beginner 2: Learn AI Coding Tools'
|
||||
description: 'Move from web-based AI coding to local development: understand IDE vs AI IDE, build a snake game with Trae, and learn practical AI collaboration tips.'
|
||||
---
|
||||
|
||||
# Beginner Level 2: Learn AI Programming Tools
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -81,7 +81,7 @@ We need Android Studio to provide the Android SDK and emulator required for runn
|
||||
|
||||
**Special reminder for beginners:**
|
||||
|
||||
Although modern versions of Android Studio have greatly simplified configuration, it still depends on the **JDK (Java Development Kit)** under the hood. If this is your first time doing development, or if you encounter errors related to environment variables or SDK configuration during installation, do not panic. You can refer to this detailed setup guide: [Android Studio2024版本安装环境SDK、Gradle配置](https://blog.csdn.net/keiraee/article/details/142321644?ops_request_misc=elastic_search_misc&request_id=a2b858d1f665095c53afa9114ad8864d&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~top_positive~default-2-142321644-null-null.142^v102^pc_search_result_base4&utm_term=android%20studio%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE&spm=1018.2226.3001.4187)
|
||||
Although modern versions of Android Studio have greatly simplified configuration, it still depends on the **JDK (Java Development Kit)** under the hood. If this is your first time doing development, or if you encounter errors related to environment variables or SDK configuration during installation, do not panic. You can refer to this detailed setup guide: [Android Studio 2024 setup: SDK and Gradle configuration](https://blog.csdn.net/keiraee/article/details/142321644?ops_request_misc=elastic_search_misc&request_id=a2b858d1f665095c53afa9114ad8864d&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~top_positive~default-2-142321644-null-null.142^v102^pc_search_result_base4&utm_term=android%20studio%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE&spm=1018.2226.3001.4187)
|
||||
|
||||

|
||||
|
||||
@@ -654,7 +654,7 @@ Under the `Production` menu, click `Create new release`, upload your `.aab` file
|
||||
|
||||

|
||||
|
||||
_If you have already completed developer account registration, this video tutorial can guide you through the rest of the process:_ [Android应用上传GooglePlay谷歌市场全流程教程](https://www.bilibili.com/video/BV16REQzGEnk/?share_source=weixin&vd_source=b42f227a4f2d413fbde18499d83227cf)
|
||||
_If you have already completed developer account registration, this video tutorial can guide you through the rest of the process:_ [Full workflow: uploading an Android app to Google Play](https://www.bilibili.com/video/BV16REQzGEnk/?share_source=weixin&vd_source=b42f227a4f2d413fbde18499d83227cf)
|
||||
|
||||
# 7 Final Notes
|
||||
|
||||
@@ -674,6 +674,6 @@ I am really looking forward to your next creation. Keep going!
|
||||
|
||||
# References
|
||||
|
||||
CSDN: [(2024.03.04)如何打包Android Studio项目?](https://blog.csdn.net/GenuineMonster/article/details/136443130?ops_request_misc=&request_id=&biz_id=102&utm_term=android%20studio%20%E6%89%93%E5%8C%85%20APK%20%E5%B9%B6%E5%88%86%E4%BA%AB&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-1-136443130.142^v102^pc_search_result_base4&spm=1018.2226.3001.4187)
|
||||
CSDN: [How to package/build an Android Studio project (2024-03-04)](https://blog.csdn.net/GenuineMonster/article/details/136443130?ops_request_misc=&request_id=&biz_id=102&utm_term=android%20studio%20%E6%89%93%E5%8C%85%20APK%20%E5%B9%B6%E5%88%86%E4%BA%AB&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-1-136443130.142^v102^pc_search_result_base4&spm=1018.2226.3001.4187)
|
||||
|
||||
CSDN: [Android Studio安装及配置](https://blog.csdn.net/Changersh/article/details/149838228?ops_request_misc=&request_id=&biz_id=102&utm_term=android%20studio%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-0-149838228.142^v102^pc_search_result_base4&spm=1018.2226.3001.4187)
|
||||
CSDN: [Android Studio installation and configuration](https://blog.csdn.net/Changersh/article/details/149838228?ops_request_misc=&request_id=&biz_id=102&utm_term=android%20studio%E5%AE%89%E8%A3%85%E5%8F%8A%E9%85%8D%E7%BD%AE&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-0-149838228.142^v102^pc_search_result_base4&spm=1018.2226.3001.4187)
|
||||
|
||||
Reference in New Issue
Block a user