Welcome to FTX's Blog!
本站记录我的七七八八的编程之旅沿途风景！-
产品原型设计工作流
原型设计步骤
-
根据需求对页面进行构思改造，然后让
gpt调用原生生图模型来生成改造后的原型设计图，直到原型改造图符合自己的要求； -
把原型改造图丢给
gpt，让gpt识别原型改造图，然后生成html、css、js生成可交互的前端代码，然后进行效果演示。具体步骤如下：请详细读取【原型图目录】中的全部页面已经设计好的
png原型图片，并结合【业务数据或需求文档】生成一个可交互的单文件HTML原型。01. 页面布局、颜色、间距、表格和按钮样式尽量与最终原型图保持一致；业务分类、字段、标准名称和状态以数据文件为准，确保完整、不遗漏、不擅自改名。
02. 请实现主页面、菜单展开收起、分类与子分类筛选、查询条件搜索和多选、字段联动、组合查询、重置、表格单选与全选、批量操作、预览、下载、分页、加载、无结果、异常提示和确认弹窗。（待定：具体参考原型改造交互需求，不一样的需求提示词不一样，这个只是一个实例）
03. 没有后端接口的功能使用演示数据模拟，并明确属于交互演示。
HTML、CSS和JavaScript放在同一个文件中，不使用外部CDN，保证双击即可运行。04. 完成后使用工作区内置浏览器自动化组件检查全部分类、查询、选择、弹窗和关键页面，并在【目标分辨率】下截图检查。发现问题后直接修改并复测。（用同一工作区内置的 Chromium 自动化组件完成截图检查）
05. 输出到【输出目录】，命名为【文件名称.html】。如果同名文件已经存在，先询问是否允许覆盖。
-
确定上述过程没什么问题之后，就可以让
gpt根据原型图的改造设计思路攥写PRD手册，在查看手册可以对手册进行优化；
-
-
前后端架构详解
前言
刚开始接触 Web 开发时，JavaScript、TypeScript、React、Vue、Next.js、Node.js、Spring Boot 这些名称很容易混在一起。
原因并不复杂：它们本来就不属于同一层。有些是编程语言，有些是运行环境，有些负责页面，还有一些专门处理服务器和数据库。
这篇文章按照一条实际请求的运行过程，把这些概念重新整理一遍。
-
codex 项目使用教程
Codex 项目使用教程
本文整理了 Codex 记忆系统配置、内置 Git 操作、GitHub + Gmail 联动自动化三大核心功能的使用方法，所有操作均可通过自然语言提示词完成。
💡 使用注意：请留意区分 Codex 记忆系统 与 Claude Code 的能力边界，二者配置与调用方式互不通用。
-
AI Coding项目初始化教程
项目开发规范与流程指南（完整版）
整合 规范驱动开发（SDD） 与 Claude Code 工作流，从模糊想法到高质量交付的一站式手册。
第一部分：规范驱动开发（SDD）
1.1 为什么 AI 编程需要“规范”
在淘宝买衣服时，你说“我要一件好看的”——结果收到的和你想象的完全不同。这是沟通不精准的代价。
AI 编程也一样。你对 AI 说“帮我做个网站”，它可能输出一个完全跑偏的东西。“垃圾进，垃圾出”——模糊的需求必然导致不准确的结果。
规范（Specification） 就是你和 AI 之间的 “合同”，它明确定义：
- 要做什么（功能需求）
- 怎么做（技术方案）
- 做到什么程度（质量标准）
有了这份“合同”，AI 才能精准理解你的意图，产出符合预期的代码。
-
企业级仓库管理系统WMS设计与实现
WMS 仓库管理系统
这个项目耗时大概两天的时间，因为毕业答辩各种事情都忙完了想着捣鼓一下springboot这个框架，来结合自己的理解低代码vibe coding了这个项目，目前该项目已经开源。你可以使用这个项目进行二次改造，例如：公司日常使用，毕业设计，技术交流等等合法用途你都可以clone此项目来使用。如果这个项目可以帮助到你，麻烦您给我点一个免费的star，也是对我的莫大的鼓励，非常感谢！！！ 基于 Spring Boot + Vue 3 的现代化仓库管理系统，支持仓库、库位、入库、出库、库存等全链路管理。
项目源地址：https://github.com/futingx/springboot-vue-wms.git
-
数字化五大核心系统
制造业数字化的五大核心系统：ERP、MES、WMS、PLM、SCM，你都了解吗？
在制造业，谁先”数字化”，谁就能跑得更快、活得更久。
但说到数字化系统，很多老板一听就头大：什么 ERP、MES、WMS、PLM、SCM……听起来都很高大上，可到底是干嘛的？是不是都得装？顺序怎么来？贵不贵？有啥用？
别急，今天我们就用一个”开工厂”的通俗案例，一次性讲清楚这五大系统分别管什么、怎么配合。
-
Dify基础及项目实战
Dify 基础入门与项目案例实现指南
一、Dify 平台是什么
Dify 是一个开源的大模型应用开发平台。说白了，就是让开发者不用写太多代码，就能搭出能跑在 GPT、Claude 这类大模型上的应用。它把后端服务和运维的东西封装好了，非技术背景的人也能上手。
主要功能：
- 可视化编排：拖拖拽拽就能搭出工作流
- 提示词调试：内置工具，改提示词马上看效果
- 多模型接入：OpenAI、Claude、本地 Ollama 都支持
- RAG 能力：接知识库做检索增强
- API 部署：一键暴露成接口，给其他系统调用
-
Agent项目实战
🤖 从客服到”管家”
我给扫地机器人做了个能自己查资料、生成报告的智能体
“真正 Agent 应该能做更多的事情——它应该能自主判断需要什么信息，自己去查，自己生成结果，而不是等着用户一步步喂问题。”
-
RAG项目实战
🚀 动手做了一个服装客服 RAG 系统
顺便理清了 RAG 开发的完整流程
“做这个项目之前，我对 LangChain、RAG 向量检索这些概念只停留在”听说过”的层面。学了课程之后，总觉得少点什么——没有真正跑过一个完整的东西，心里不踏实。” 本文记录我是怎么从零搭建这套系统的，以及中途踩的几个坑。
-
大模型应用开发
RAG 与 Agent 实战入门指南
本文整理自个人学习笔记，系统梳理 RAG 与 Agent 的核心概念、API 调用技巧、提示词工程及 LangChain 实战开发，助你快速上手 LLM 应用开发。
一、什么是 RAG 与 Agent？
在正式动手之前，先理解两个核心概念：
概念 说明 RAG（检索增强生成） 将企业私域数据与大模型结合，让大模型能够”看懂”私有知识，回答更准确、更专业 Agent（智能体） 相当于给大模型装上”手脚”，使其能够自主规划、总结、市场调研、处理复杂流程等 简而言之：RAG 解决”大模型不知道”的问题，Agent 解决”大模型不会做”的问题。