AI 网站开发

这节会用到

跟着完成这三步

1. 写下谁会使用这个作品、在什么场景使用，以及现在遇到的一个具体问题。先解决一个场景。
2. 只保留 3–5 个核心功能。列出需要的页面、每页的操作和需要保存的数据。把支付、社区等复杂能力放到后续版本。
3. 让 AI 复述需求并指出缺失信息，再按页面拆任务。最后生成一个简单页面，并亲手要求它修改一处。

可以这样向 AI 提问

我想做一个【作品名称】，帮助【用户】在【场景】完成【目标】。
第一版只保留：【3–5 个功能】。
请先复述你的理解，列出需要我补充的问题，再给出页面清单、数据清单和可验证的验收条件。先不要生成全部代码。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 确认编辑器、浏览器、Git 和运行环境可用。在终端进入项目目录，找出 README、入口文件和依赖清单。
2. 从一个按钮开始理解三层职责：HTML 描述结构，CSS 决定样式，JavaScript 处理操作。修改按钮文字、颜色和点击后的反馈。
3. 让 AI 解释一条数据从输入框到页面的流向，再解释浏览器与服务器各自运行什么。关闭项目后，按说明重新启动一次。

可以这样向 AI 提问

我是编程初学者。请阅读当前项目，列出启动命令和 5 个最重要的文件。
用一个按钮点击的例子解释 HTML、CSS、JavaScript 的职责。
请先检查现有实现，每次只指导我做一个小改动，并告诉我如何验证。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 在开始修改前保存一个可运行的版本。练习查看 Git 状态、差异和提交记录，不把密钥、依赖和临时文件加入仓库。
2. 记录一个错误的触发步骤、预期结果、实际结果和必要日志。先让 AI 给出排查顺序，再批准小范围修改。
3. 重新走原来的操作路径，确认错误消失且原有功能仍可用。保存修复，再在练习分支或副本中演练回到已知版本。

可以这样向 AI 提问

问题复现步骤：【步骤】
预期结果：【预期】
实际结果：【实际】
相关日志：【去除密钥的日志】
请先分析可能原因，指出需要检查的文件。优先给出最小修复，不做无关重构，并列出修复后的验证步骤。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 准备首页、作品列表、作品详情和关于页面的真实内容。先写内容，再确定页面需要哪些模块。
2. 从基础 HTML、CSS、JavaScript 过渡到 Vue 项目，让 AI 按页面拆组件。优先做出结构完整的一条浏览路径。
3. 逐个检查菜单、链接和按钮。详情页使用一致的数据结构；对暂未实现的功能给出明确说明。

可以这样向 AI 提问

请按现有需求实现个人作品网站。页面包括首页、作品列表、详情和关于。
使用 Vue，保持组件简单，先完成可运行的页面与路由。
内容来自：【我的内容】。请列出将修改的文件和逐页验收步骤。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 从手机宽度开始检查页面。确保文字不挤出屏幕、图片比例合理，导航和按钮容易点击。
2. 加入作品分类筛选，以及没有结果、加载中和请求失败的状态。让每一种反馈都说明接下来能做什么。
3. 用手机与电脑分别完成一次浏览流程；再用 Tab 键检查焦点顺序，确认文字与背景清楚可辨。

可以这样向 AI 提问

请检查当前网站在 390px 和 1440px 宽度下的布局。
保留现有功能，优先修复溢出、导航、字号和点击区域。
补齐筛选无结果与加载失败状态，并给出键盘操作检查方法。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 定义作品数据字段，例如标题、分类、说明和封面地址。区分必填字段和可选字段，先用少量测试数据。
2. 用 Node.js 与 Express 实现作品查询和增删改查接口，使用 SQLite 持久化。让 AI 解释请求、响应和错误状态。
3. 将前端从本地数组切到接口数据。验证新增、修改、删除后刷新页面的结果，再测试缺少必填字段的请求。

可以这样向 AI 提问

请为现有作品网站增加 Node.js + Express + SQLite 后端。
先定义数据字段与接口，再逐步连接前端。数据库文件放在独立持久化目录。
为输入增加校验，说明正常、空数据和错误请求的验证方法。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 建立管理员登录与管理页面。密码使用合适的哈希方式存储，配置从环境变量读取，不写进前端或代码示例。
2. 在服务端为写入接口增加身份验证。隐藏前端按钮不能代替权限校验；从浏览器外直接请求接口也应受到保护。
3. 验证登录后的编辑操作，以及未登录、退出后和会话失效时的行为。用测试数据操作，避免覆盖真实内容。

可以这样向 AI 提问

请检查管理后台的权限边界。
要求：密码不明文存储、会话在服务端验证、写入接口逐项鉴权、退出后会话失效。
请逐项说明实现位置，并给出未登录直接请求接口的验证方法。不要输出任何真实密钥。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 用浏览器网络面板检查请求地址、状态码和返回内容。分清页面错误、接口错误与环境配置错误。
2. 完成首页到详情、登录到编辑的核心回归。针对无数据、非法输入、网络失败等情况记录预期结果。
3. 执行生产构建，在独立目录运行发布版本，核对静态资源路径与接口地址。只将可公开文件放进发布目录。

可以这样向 AI 提问

请根据当前项目整理发布前检查单。
包含生产构建、资源路径、接口地址、环境变量、数据库位置与核心流程。
请实际运行适用的检查，区分已经通过和仍需人工验证的部分。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 比较地域、CPU、内存、带宽和存储。记录首购价、续费价、计费周期与备份成本，再由账号持有人核对购买。
2. 如选择中国内地部署，提前核对域名与备案条件。把等待中的外部流程列入发布计划，编码练习继续进行。
3. 通过 SSH 连接服务器，确认系统、目录和运行环境。设置必要的访问范围，数据库不开放到公网。

可以这样向 AI 提问

我准备为一个小型作品网站选择服务器。
预期使用场景：【场景】，预算：【预算】，访问地区：【地区】。
请解释选型要考虑的项目，并列出需要我在购买页面核对的信息，不要代填未知价格或购买。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 把静态构建与后端程序放到约定目录，安装运行依赖。数据库和备份位于发布目录之外，避免更新时覆盖。
2. 配置 Nginx 静态资源与接口反向代理，配置服务开机启动和进程托管。修改 Nginx 前备份，检查通过后再重载。
3. 在授权测试条件下检查页面、接口与日志。重启服务后再次读写数据；面向公网开放前满足适用的备案要求。

可以这样向 AI 提问

请为当前网站整理服务器部署步骤。
分开静态文件、后端程序、数据库和备份目录。
给出进程托管、Nginx 配置检查和日志位置。先读取现有配置，不覆盖其他站点；每一步都给出验证方式。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 查询候选域名，核对拼写、持有人、首年及续费价格和自动续费。由持有人完成注册与适用的实名流程。
2. 按实际部署地域核对备案条件。将域名解析到目标服务，分别检查根域与 www 是否符合自己的使用计划。
3. 配置匹配域名的 HTTPS 证书、HTTP 跳转与续期。用严格证书校验访问，不通过跳过校验掩盖域名或证书错误。

可以这样向 AI 提问

我已部署网站，准备绑定【我的域名】。
请先核对当前 DNS、服务器站点配置和适用备案前提，再整理 HTTPS 接入步骤。
不要假设证书已覆盖 www。请说明解析、证书和页面分别如何验证。

完成后，亲手检查

这节会用到

跟着完成这三步

1. 保存当前发布文件与数据库备份，记录版本、时间和备份位置。代码备份与数据库备份分别管理。
2. 发布一个小改动，核验域名、资源、接口和管理流程。出现错误时先确认范围，不反复覆盖现场。
3. 在测试环境演练代码回滚与数据恢复，注意数据结构变更可能需要独立处理。整理部署说明和维护清单。

可以这样向 AI 提问

请为这个项目写一份可执行的发布与恢复说明。
包含发布前备份、文件同步、数据保护、验证与失败处理。
代码回滚和数据库恢复分开写，不要承诺自动回滚。所有路径以项目实际状态为准。

完成后，亲手检查