半小时打造七夕传统文化网站:Qoder AI编程实战记录
背景
最近七夕到了,恰逢Qoder上线,萌生了一个想法,写一个以中国传统七夕为主题的网站。
七夕·中国传统情人节
Qoder 介绍
Qoder 是阿里巴巴推出的一款旨在提升开发效率的 AI 编程平台。它通过上下文工程技术和智能体辅助,帮助开发者更高效地完成编码任务。
Qoder - The Agentic Coding Platform
使用和介绍在此不再赘述,感兴趣可以自行下载试用
实现需求的技巧
如何让想法能够被比较不错的实现。一般使用分为两步:
- 将想法告诉大模型,让其生成一份 Prompt (提示词)
- 将生成的 Prompt 告诉 Qoder(可以是其他的 AI 编辑器)
需求阶段
需求描述
1. 写一个炫酷的网站
2. 作为中国传统七夕介绍
3. 有中国传统的古诗词、传统文化、传统故事等
4. 布局合理、富有活力
5. 扁平化风格,优雅高级
Prompt 设计
将上述需求输入大模型,让其生成一份结构化的Prompt
将需求给 DeepSeek,让其生成一个翔实的 Prompt
实现阶段
将 Prompt 粘贴到 Qoder 中实现
Qoder 会分步骤完成,并在过程中进行诸多优化。如下所示:
最终,Qoder 会按照需求一一实现。因为是静态网站,最终呈现效果还不错。
网站展示
仓库地址
将生成的静态网站,使用 github 的 Pages 部署一下。
仓库地址:https://github.com/uzong/qixi
页面展示
七夕·中国传统情人节
整体效果还不错,可以体验访问一下。
总结
不管是使用 Qoder 还是 Trae、cursor、WindSurf 等,都可以实现上面的效果。核心思路一致。
- 用大模型辅助生成 Prompt
- 用大模型生成的 Prompt 交给AI编辑软件
过程仍需要不断的进行调试和优化。
至此,一个设计精良的网站便完成了,整个过程耗时不足半小时。感兴趣也可以尝试一下。
已经同步发布微信公众号:面汤放盐 半小时打造七夕传统文化网站:Qoder AI编程实战记录