使用Comate全栈开发一个Python学习网站
Comate 介绍
Comate是百度开发的一款国产AI编程工具,类似于Cursor,Trae等等,是一个独立的代码编辑器,功能非常全面。
今天我将使用Comate来实现从零全栈开发一个Python学习网站。
下面是我安装好的Comate的截图,如果你要跟着开发,请先下载好吧。
产品经理:编写需求文档
首先,我们可以让Comate充当一个产品经理的角色,让它编写需求文档。
你可以把下面的这段提示词复制过去:
你是一个专业的产品经理,现在我需要你帮我编写一份 docs/需求分析.md 文档。
我们要使用HTML+CSS+JavaScript开发一个Python的学习网站。
第一阶段只有实现基础的功能就行,不要太复杂,我们需要的是一个最小可行性版本。
思考中…
效率非常高,几分钟就生成好了。
UI设计师:编写UI设计文档
接下来,我们让Comate充当UI设计师的角色,设计一下UI界面,并编写UI设计文档。
提示词如下:
你是一个高级UI设计师,请你参考 docs/需求分析文档.md 编写 docs/UI设计文档.md
要求页面美观大气,采用科技蓝的主题,让学生感觉到科技感,仿佛置身未来一般。
给Comate提示词:
Comate编写文档中…
过了几分钟以后,文档设计好了。
架构师:编写架构设计文档
接下来我们让Comate充当架构师的角色,编写架构设计文档。
这里为了简单,我们采用的是纯前端的架构。
如果是真实的大型项目的话,建议采用fastapi+vue的架构会更好,但是这里主要是为了给大家演示效果,所以我们采用简单高效的方式。
这个纯前端的代码后面也可以结合Django框架或者Flask框架,基于模板的方式进行使用。
我们把提示词Comate:
你是一个前端架构师,请你参考 docs 下面已有的文档,编写 docs/架构设计.md
基于 HTML+CSS+JavaScript 的纯前端方式进行开发。
提示词给Comate。
文档编写中…
架构设计文档编写完成。
项目Leader:制定开发计划
基础文档准备好以后,我们就需要进入开发阶段了。
为了保证项目的有序进行,我们让Comate充当项目Leader,指定一个详细的开发计划。
提示词如下:
你是一个项目Leader,请参考 docs 目录下的文档,编写 docs/开发计划.md 文档,制定详细的开发计划。
Comate开始读取docs下面的文档,制定开发计划。
开发计划编写完成:
前端工程师:按计划编写代码
终于到了编写代码的阶段了。
现在,我们让Comate充当一个高级前端工程师,按照开发计划编写代码。
提示词如下:
你是一个高级前端工程师,请你阅读 docs 下面的文档,按照开发计划,开始开发。
项目开发完成以后,要将项目运行起来,确保没有任何的错误和警告。
Comate正在按照开发计划编写代码,让我们期待一下它的成果。
一顿操作猛如虎,终于在经过了十几分钟以后项目生成完毕了。
在index.html上右键,在服务器中预览。
最终效果
经过一番努力之后,终于把界面给设计出来了,效果如下。
整体而言,Comate还是很给力的。
给国产AI编辑器点赞!!!