type
status
date
slug
summary
tags
category
icon
password
你好，我是易安，专注，AI编程。
最近看了藏师傅的公众号封面生成提示词，非常简洁大气，于是心生了一个想法，不如把这个封装在一个页面工具中，开放开大家使用。刚好我最近在带AI编程死磕30天训练营，想着实现一下，顺便带大家做下，以下内容有参考归藏老师的提示词和风格。
顺便给大家分享下我的AI编程最佳实践，主要用的工具有：Claude pro，VsCode + Roocode+Gemini2.5preview 模型，如果你手上有VsCode roocode 足以实现这个需求，没有Gemini免费API的可以添加文末我的联系方式领取。
一、Claude老师规划需求
Claude有个问题，每次说完一个点，它就咣咣开始写代码了，这里需要告诉它不要急着写代码，咱们先沟通沟通需求，知道你全能，又能设计，又会写的。先理清楚需求再做，否则后面又要返工，你的token那么点，我可耗不起。
于是Clade很快就给了我一版：
有了需求描述，那么我是让它直接给我一个我完整提示词吗？历史的经验告诉我，如果只想靠一个提示词就能出来结果，往往会事与愿违，就算让cladue3.7来也不行，于是，我让AI做了拆解。干脆我让它把提问的方式也告诉我得了。
不得不说，Claude真的NB，就这一句话，我们得到了这个
这个
还有这个
拿到参考答案，我就开始指挥AI编程工具开始干活了。
二、AI编程实现代码
1、第一步：生成布局
用到的提示词如下：
输入第一步的提示词，很快就得到初版应用
2、第二步：实现基础功能和响应式设计
提示词如下：
继续喂给AI
结果如下，横竖搞错了，且风格选择没用
于是我让AI调教了几轮，得到如下结果
3、第三步：添加风格模板功能
提示词如下：
4、第四步：实现颜色自定义功能
5、第五步：字体自定义功能
6、第六步：布局调整功能
7、第七步：图片下载功能
8、第八步：背景图片上传功能
9、第九步：装饰元素和模板库
10、第十步：优化用户体验和代码整合
- Author:NotionNext
- URL:http://preview.tangly1024.com/article/22ced26c-0da0-8162-973f-c6ab7eb1927b
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!
