Skip to content

【大纲】TRAE AI 编程入门第一讲——Vibe Coding 初识即上手

约 1272 字大约 4 分钟

AI编程Vibe CodingTRAE教程大纲

2026-04-02

飞哥数智谈,现居于济南,AI提效、AI编程实践者,AI·Spring社群发起人,同时,担任 TRAE Friends 社区济南 Fellow,致力于AI 提效与AI编程落地,最近长期举办 openclaw 系列活动《养虾记》。

最近几天会把我策划的体系化 AI 编程入门课程大纲逐步放出,欢迎大家提意见。

该门课程暂定 4+1 节:

  • 4节主课,以 TRAE 为工具,实现 AI 编程入门;
  • 1节扩展课,主要补充非技术人员的软件工程知识。

课程内容:

  • 第一节:TRAE AI 编程入门——Vibe Coding 初识即上手
  • 第二节:TRAE AI 编程入门——磨刀不误砍柴功
  • 第三节:第三节:TRAE AI 编程入门——突破边界的 Rules / MCP / Skills
  • 第四节:TRAE AI 编程入门——打破编程界限的智能体

今天是第一节的大纲。

第 1 页:传统编程 vs AI 编程

标题:同样是"做一个网页",过去和现在有什么不同?

  • 对比普通编程和AI编程
  • 核心信息:AI 编程不是让你变成程序员,而是让你能用更低的门槛把想法变成现实
  • 传统编程的知识仍然有价值,但 AI 编程提供了一条更友好的入门路径
  • 这节课的目标:让你体验这条新路径,并发现"我也能行"

第 2 页:什么是 Vibe Coding

  • Vibe Coding 是通过自然语言指挥AI生成软件,不关注代码细节,只关注最终结果。

Vibe Coding 的过程

  • 你描述需求:用自然语言、画图或举例告诉 AI:“我要什么样的功能/效果/结果”。
  • AI 负责交付:AI 自动造出代码 + 界面,你不需要关心它是如何实现的。
  • 你验证结果:用实际运行效果来“检验”,对了就收下,不对就提要求让 AI 再调。
  • 循环直至完成:持续反馈直到结果完全符合心中所想,项目即告交差。

第 3 页:TRAE 是什么

  • 一句话介绍:TRAE 是字节跳动推出的 AI 编程 IDE
  • 核心能力:用自然语言描述需求 → AI 生成代码 → 实时预览,一个可以帮你 Vibe Coding 的工具
  • 国内版 vs 国际版:最大的区别就是模型不同,国际版可以使用 GPT/Gemini 等国外模型。

第 4 页:今天的演示任务

标题:从一句话需求到一个聊天智能体网页

  • 需求足够简单,学生一听就懂
  • 结果足够完整,学生一看就有冲击力
  • 全程不讲代码细节,只看 AI 如何把想法落地

第 5 页:第一步——把想法说清楚

  • 只需要描述对象、功能和风格
  • 语言不必专业,但目标要具体
  • AI 编程的起点不是敲代码,而是清楚表达需求

第 6 页:第二步——生成第一个结果

  • TRAE 如何理解需求并输出页面雏形
  • 为什么第一次结果不一定完美,但已经足够进入迭代
  • 学生要看到"从无到有"的关键瞬间

第 7 页:第三步——不断完善

  • 加标题、调风格、补功能、改文案
  • AI 的价值不只在第一次生成,更在连续迭代
  • 学生需要建立"先出来,再变好"的直觉

第 8 页:为什么这件事很重要

  • 零基础也能更快进入实践状态
  • 想法可以更快变成展示作品、比赛原型或社团工具
  • AI 让"有创意的人"更容易迈出第一步

第 9 页:这不等于不用学基础

  • Vibe Coding 解决的是启动难,不是学习可以省略
  • AI 帮你降低门槛,但作品仍需要你来判断和优化
  • 先建立兴趣,再逐步进入更系统的工具学习

第 10 页:可以从这些小项目开始

项目方向描述
个人介绍页一页展示你的专业、爱好、技能,可分享给同学
社团招新页包含社团介绍、活动照片、报名表单
活动报名页一个简单的表单页面,收集姓名、联系方式
简单聊天 Demo一个能对话的网页,可以自定义角色设定

第 11 页:本讲总结

  • AI 编程可以让你快速、低难度地实现想法
  • 但 Vibe Coding 具体如何使用?请期待下一讲。