过去的网页开发:打开编辑器,逐行敲代码,反复调试兼容性,部署流程复杂。
现在的网页开发:用自然语言描述需求,AI自动生成代码、修复错误、一键部署上线。
在源起之道开源商业创新营的专业阶段第二课中,Edward老师全程,仅凭对AI的清晰指令,加以手动修改,就现场构建并发布了一个完整的项目网站。这节课不仅关乎技术工具,更关乎一次认知升维。
Edward,现任Futurewei开源软件架构师,常驻美国加州。新创公司AppChef(App自动开服服务)的共同创始人兼首席技术官,新创公司Live4Code(线上教育)共同创始人兼首席技术官,华为美研所Web CDN架构师,思科创新部门技术负责人,摩托罗拉网络管理系统软件工程师。在本次课程中,不仅讲理论,更带学员一步步完成从创建网页到部署上线的全流程。
未来开发者的角色将更多转向架构师+评审员,不需要逐行写代码,而是用自然语言描述需求,让AI生成代码,自己负责监督、修改和整合。
主工具 Claude Code,通过命令行与AI交互,支持用英文指令控制开发流程。模型切换器CCS,可灵活对接Claude 3.5、GLM-4、Kimi等大模型,帮助用户选择性价比更高的方案,例如GLM-4成本仅为Claude的十分之一。
框架选择Vue-based,外加基于Astro 模版模块化页面,使用国内流行的前端框架,易于快速生成响应式页面。生成页面:基于现有模板,指令AI创建Landing Page。

内容整合:将Markdown文件中的项目描述自动植入网页。
调试纠错:将运行错误拷贝,直接反馈给AI自动分析修复。
视觉优化:用LOOKA(专门制作logo的网站)工具生成并替换图片。
部署发布:通过GitHubActions自动化部署到GitHub Pages,全球可访问。
内容是网站的灵魂。在让AI动手前,建议先用Markdown清晰列出要表达的重点,AI才能更精准地组织代码与布局。以课程中真实项目Robrix为例,学习AI如何理解技术亮点并自动适配到页面结构中。
对学员:即使不擅长前端,也能在1小时内完成一个专业网页的创建与发布,极大增强技术自信。
对开发流程:证明AI能在编码、调试、部署环节承担大部分重复工作,人类更专注于架构与创意。
对开源生态:鼓励更多人用AI工具参与开源项目,推动技术协作平民化。
如果你也想用自然语言完成一个可访问的网页,体验AI作为开发伙伴的高效与智能,在开源训练营中展现你的项目创造力,现在就是起点。
按照课程中的路径,从Fork仓库开始,用AI Vibe Coding完成你的第一个作品,提交到训练营榜单中。
了解更多
https://opencamp.cn/UpstreamLabs/camp/S1/register关于OpenCamp训练营
OpenCamp训练营是由清华大学陈渝老师和向勇老师发起的高层次人才培养示范平台,致力于服务国家关键核心技术攻关战略,重点聚焦芯片、操作系统、人工智能、机器人等“卡脖子”领域。OpenCamp训练营坚持“全免费、全开放、体系化、平台化”的教育理念,探索“产教深度融合+四阶段晋级”的拔尖人才培养新模式,是推动教育、科技、人才一体化机制创新的重要实践成果。构建面向前沿核心技术的开源知识体系,造就具备自主创新能力的科技领军人才,是 OpenCamp 训练营的核心愿景与根本使命。