Vibe Vibe 全民 AI 教程

★ 5.9kGetting Started

#course#chinese#fullstack

Overview

Datawhale's first systematic open-source Vibe Coding tutorial in China (5.9k+ stars, www.vibevibe.cn), built for complete beginners, walking from 'I have an idea' to 'I shipped a product'. It follows Karpathy's idea — from Coder to Commander — turning programming from 'writing code' into 'conversational creation' with AI. The tutorial progresses through four parts: Basics, Advanced, Practice and Curated Articles.

Who it's for

Absolute beginners, college students, founders, traditional programmers — anyone who wants to turn ideas into products fast with AI.

What you'll learn

01Path design: pick your starting point first
The README maps recommended entry points by persona: absolute beginners start at 'Basics → Chapter 1 Awakening'; those who've used ChatGPT but never built a project begin at 'Chapter 2 Mindset'; people with coding experience skim the Basics and jump straight to the Advanced part; hands-on learners start at 'Chapter 4 Practice'; and those hunting for projects go to the Practice part.
02Basics: from awakening to a first product
The Basics part has five chapters: Awakening (why this is the best era for programming, tool selection, a 3-minute first web page), Mindset (think like a product manager, MVP thinking, the three soul-searching questions), Craft (prompt engineering, turning ideas into user journeys, writing a first PRD), Practice (environment setup, build a static page first then inject logic, a debugging guide), and Refinement (from 'works' to 'good to use', shipping, security awareness, the limits of Vibe Coding).
03Advanced: a pitfall-avoidance guide from zero to launch
The Advanced part follows a complete product-delivery flow across 16 chapters: environment setup, PRD and document-driven development, UI/UX, environment variables and security, databases, testing, Git, serverless deployment and CI/CD, domains and networking, cloud-server operations, SEO and analytics, and user feedback loops. The stack is Next.js 16 + React + TypeScript + Tailwind CSS + shadcn/ui + Drizzle ORM + PostgreSQL.
04Practice and curated articles
The Practice part runs audience-specific projects (liberal-arts/business students build content-creation and data-visualization apps, STEM students do algorithm visualization and data processing, working professionals build workflow automation), while the advanced track covers shipping apps, AI Agents (RAG, vector databases, MCP), full-stack SaaS and mobile apps. The Curated Articles part picks tech blogs from OpenAI, Anthropic, Vercel, plus podcasts, research reports and newsletters to keep you industry-aware.
05Self-hosting and a preview of the online IDE
The tutorial site ships a Dockerfile and docker-compose.yml, so you can deploy it locally or on an intranet with one command. The team also previews a cloud IDE (bundling Node.js/Python/Docker environments) and 50+ preinstalled AI Skills to lower the learning barrier to its minimum.

Practice tips

First locate your entry point: complete beginners should read the Basics from Chapter 1 straight through — don't jump into the Advanced part early.
Write your own PRD (even a rough one) before reaching Chapter 3 of the Basics; you'll notice the AI stops making things up when you do.
Each Advanced chapter maps to a real delivery stage — follow the document-driven development chapter and make 'docs before code' a habit.
After the Basics, pick a project in the Practice part that matches your identity; do it, then revisit the Advanced part — it will click much harder.