不要相信网络中关于“不懂编程使用Windsurf一个月赚了100万”这类新闻,他可能真不懂,但是他爹懂。真不懂一点编程甚至英文,真的很难编写出完整程序。网上都是懂编程的人教你实战中使用Windsurf,而不懂编程的人很难实战,而很多新闻又说不懂编程也可以用Windsurf写出应用,这就是罗生门嘛...既然这样,我不懂编程,可以尝试一下...
本文耗时2天,不低于500轮次对话,实现一套包含前后端的汇率兑换计算器应用。整个实现过程仅使用 Windsurf 对话。本文主要讲解不懂编程的人是如何真正编写出完整应用的心得,不提供完整操作流程。
实现的主要功能如下:
- 完整前端页面(多终端适配)
- 首页多策略获取货币汇率数值(数据库获取、备用API获取、获取最新汇率更新到数据库)
- 读写数据库(连表查询)
- 多个定时任务脚本,采集汇率和新闻数据写入数据库(并实现文件锁逻辑)
- 封装汇率查询API、封装常用函数调用方法
- 文件缓存机制
- 本地文本文件检索
- 详细的文件报错日志记录
- 页面伪静态
科普部分
什么人适合使用Windsurf ?
- 非编程人员,如果是编程人员推荐使用 Cursor 。
- 知道基础的技术名词都是干什么用的,例如:数据库、表、字段、API、缓存、类、前端、域名等...
- 参与过完整的网站建设过程:不限于前后端技术人员、运营、产品、市场、测试等...
- 有基本的“领域”概念,可以很好的总结所在专业领域知识,并用文字描述出来。
除了编写应用,Windsurf还可以用来做什么?
- 基于自动化读取本地多文件和Agent能力,Windsurf可以作为优秀的本地文本总结、批处理工具。
- 编写需要的自动化运行脚本来处理各类本地任务,例如写一个bat脚本并自动执行。
- 学习编程最好的指导老师,提出编程需求后告知你每一步的任务以及实现的方法。
- 非标准的自动化测试,不管是技术人员或测试人员,可以导入代码后让Windsurf跟踪一个功能或读取完整代码编写测试计划并半自动执行测试用例。
如何学习Windsurf基础操作?
Windsurf 中文使用教程,Windsurf 安装使用方法
自行搜索"vscode"相关教程,因为Windsurf就是vscode的改版,基础操作逻辑类似。
Windsurf和copilot最大的区别是什么?
Windsurf默认写入模式会主动且发散的执行任务,更像一位员工,老板提出基本问题后,员工会主动的寻找解决方案完整工作。当然Windsurf中的Cascade也适合能读懂代码的朋友使用,这里我们不讨论。
copilot更像是沉默且不主动的助理,你不提出明确的任务他就会一直保持沉默,但给出明确需求胡他会做的很好。
Windsurf是否要购买付费版使用?
要买付费版本,最近更新的免费版本计划仅允许使用基础模型,效果较差。即使购买付费版本目前也限制了使用量。
免费版本因基础模型能力有限,不适合不懂程序的朋友使用。
Windsurf的两种模式?
Write负责代码编写/执行;Chat负责对话,不会写入任何代码,这点很重要。
适合新手的Windsurf配套编程环境
使用Windsurf编写代码时,必须要有一个配套的编程环境让Windsurf可以执行各类操作,以及让你实时预览代码实现效果。
既然是小白,必然不懂得搭建编程环境,或者跟着教程很艰难的可以搭建出来。搭建环境时最麻烦的问题是:大多数使用windows系统的人在本地搭建编程环境会遭遇更多的异常,以及无休止的调试各类依赖资源。
更可怕的是,你无法信任让Windsurf操作你的电脑——执行本地命令。这可能让你的私人电脑遭遇不可预料的问题。
我给出的解决方案如下:
购买一个服务器,自动化部署宝塔面板,记住连接SSH的root账号和密码。如果你明确使用PHP+MYSQL组合,那么请在宝塔面板中提前创建好(不要让Windsurf创建基础环境)。
到这里如果无法自行部署以上基础环境,建议自行百度。
启动Windsurf创建第一个项目
1.如果你顺利的安装Windsurf后,可以下载汉化插件:Codeium Windsurf 设置中文界面,只需一个汉化扩展插件
2.在宝塔面板中创建一个网站目录,这里我选择PHP+MYSQL的组合
3.使用SSH连接远程服务器对应的的网站目录
连接远程服务器:启动软件,选择Connetc 然后选择SHH Host..
4.输入SSH账号(一般都是root)和服务器地址
5.输入root账号对应的密码,按Enter确认
6.不出意外你默认链接到的“目录”并不对,这里并看不到之前创建的文件夹
7.定位文件夹位置
这里选择免费的小尺寸模型提问,避免消耗额度,得到了目录绝对位置。
7.选择:文件-使用配置文件新建窗口-新建配置文件
点击创建(在“默认”中添加目录也可以)
8.点击Add Folder,并输入得到的目录地址:www/wwwroot/huilv.haoai.us.kg,点确认
9.选择在新窗口打开(会要求你再次输入密码)
10.进入到正确的目录,接下来我们可以正式编写项目代码了
(这是已经编写过代码的目录,默认你的目录应该为空或者仅显示一个无用的配置文件,不需要删除)
正式编写应用前准备工作
提问
提问过程使用其他大模型对话工具也可以,这样可以避免Windsurf生成代码,但使用Windsurf进行多轮对话,可以总结出更有用的历史记录。
1.如何获取实时汇率信息
2.帮我思考如何设计一个汇率查询网站
3.根据PHP+MYSQL设计网站架构
...
整理文档
1.数据库账号密码整理为.md文档
2.提问中得到的可用汇率查询API和KEY以及接口说明文档整理为.md文档
3.提问中得到的网站前端架构整理为.md文档(后端架构我根本不会设计,想不清楚,所以没有创建文档)
这些文档会作文Windsurf的上下文,或指定某个文档作为Windsurf的上下文辅助编写代码
验证最小功能实现逻辑
测试1:使用API访问,获取到汇率接口的全部货币名称,存入数据库。
测试2:使用API访问,从数据库中获取一个货币名称,请求到该货币汇率,存入数据库。
测试3:...
提示词中声明:这是一个简单的测试,创建最小的功能测试用例,并执行一遍,最后验证成功的标准是查询到数据库中有验证的数据。
测试后要求总结核心功能:总结出每个最小功能测试成功后得到的核心执行代码(我并不懂每段代码的含义)
测试成功后,要求清空产生的所有代码和数据库。这通过对话就可以实现。Windsurf可以执行任何远程服务器操作命令是适合新手使用的重要功能。
说明:
实际做了很多测试,分别让最小功能跑通,因为我不懂代码,所有接口、设计的功能对我而言并不可信,到这里我并不想编写一套完整的前后端代码来可视化的验证,因为生成过多的代码让项目无法正确前进。
同时,我记录下来了最小功能中的执行逻辑(API请求的方法),以及构建的数据库表,补充整理到了我的文档中。
正式编写应用
一开始我没有要求Windsurf先创建整个前端甚至前端首页,即使我已经提前准备好了明确的说明文档可以提供给Windsurf,让他准确的实现。
心得1:从哪个功能点开始构建代码很重要
为核心功能(汇率查询API)写一个可视化的前端界面,这个界面的字段要和数据库保持一致,字段尽量详细,就算这个可视化的前端页面并不想提供给访客使用也要先做出来。
该页面如果可以正常访问,表示代码中使用的方法是正确的,数据库中数据也是正确的,可以为后续实际要做页面引用参考。整个应用构建完成后可以删除这个页面。
因此我得到了如下两个页面:
心得2:善用“引用”文档方式提问
基于心得1,一开始并不是要构建一个完整的项目,而Windsurf主动性太强,所以问题中建议加入提示词“页面列表展示,仅展示展示字段:XX\XX\XX”
提供的@
功能十分实用,可以快速引用文件夹、文件、类
心得3:善于追问
这是上一步生成的页面,我有几个问题要提问
问题1:告诉我是否可以补充更多内容
问题2:告诉我代码效率问题
问题3:告诉我实现方法
问题4:告诉我根据我的需求“这是一个获取到的货币汇率展示列表”是否有优化建议?
心得4:高效管理代码,并减少垃圾代码产生的好方法
参考心得2的指令,增加一句:帮我单独创建一个子目录单独存放这个页面的代码。
在新建的子目录中单独测试并实现功能,最后考虑将此代码引用到其他需要的文件中。
心得5:在设计的功能较少时抽象出高可复用的能力:样式、方法、类、接口等
注意不要抽取过多可复用的文件代码,过于臃肿、数量过多的复用文件代码,在后续项目开发中,更容易让Windsurf记忆混乱。除非你记住每个复用文件的明确功能并提示Windsurf参考,实际操作中这并不现实。
该项目中复用的代码:查询汇率的API、数据连接文件、缓存规则和头部导航文件。记住,这是构建第二个页面时就抽象出来的,构建第一个页面时我并没有想的太清楚这个项目该做什么功能。
心得6:召回相关记忆然后执行任务(并让Windsurf执行服务器操作)
参考心得2,方法存在共性。这是实现复杂功能和复用现有代码的主要手段。
记得之前反复提及的“最小功能”么?当构造一个复杂的功能页面时,我往往从最小功能已正常运行代码中召回相关代码,用来实现一个复杂的功能页。
这个复杂页面我往往分块实现,先引入一个最小功能A,调试一次,再引入最小功能B,调试一次,以此类推...最后可以想堆积木一样做出很复杂的页面。
这次运气很好,没有直接进行数据库操作,就猜测到了正确的表和字段名,并构建出页面。这可能因为之前产生的上下文历史依然保留着数据库字段信息。
让我们强制执行一次数据库查询,作为近期的记忆留存,这可以更准确的完成后续任务:
我要修改已经创建好的汇率定时更新脚本:ExchangeRateService.php。此时需要提前召回相关记忆:
通过阅读代码,原来ExchangeRateService.php不负责定时更新汇率,我搞错了...
好在修改前尝试阅读代码,知道这个文件并不负责定时更新汇率,真正更新脚本文件是:update_exchange_rates.php
最后我提出了一个新问题让上下文记忆更加准确:“既然update_exchange_rates.php是定时获取汇率的脚本,那么ExchangeRateService.php文件是否还有用?”
在对话中最近复述出的内容,才是更准确的“记忆”。
心得7:把每一个实现的最小分支功能,记录在之前创建的文档中
当完整实现一个功能后,要写入文档中记录。通过对话让Windsurf更新到说明文档中的。
最好在列一个功能开发清单,准确的记录任务进度:
这么多要记录的信息,混合在一份说明文档中显然不合理,此时可以将重要说明文件分别记录,重点引用时只要在对话框输入@
唤起文档即可。
心得8:为每一个核心功能创建“测试”模式
有些功能运行后可能会破坏代码、破坏正式数据库数据、无法检查报错信息或单次执行时间过长,代码中要求引入“测试”模式,方便调试各种问题。比如我的定时更新脚本执行一次要等很久,所以我加入了测试模式。
你信任代码设计功能正确的前提是:视觉上看到,有些视觉上无法直接看到的功能,要让Windsurf主动说出来“实际执行的结果”,此时就需要“测试模式”。
心得9:多用回退
对保存后不满意的代码按Ctrl+Z回退,重新对话。这不是简单“重新抽卡”,因为保留了上一轮的对话记忆,再次生成会更加准确。
心得10:多轮对话无法得到符合预期功能则放弃
这里的功能指“最小功能”,删除最小功能的目录和目录下文件,尝试打开新对话窗口,删除存储的记忆,然后在指令说明:忘记之前的代码,开始重新写XXX功能。
心得11:常用对话词语
增删改查、建议、优化、解释、参考、忽略、依赖、相关引用、完整执行逻辑、测试、合并(如果你无法理解这些词语,向ChatGPT提问:在编程语境下中:XXX词语分别代表什么含义)
心得12:尽量使用环境依赖简单的成熟编程语言
因此选择宝塔面板部署PHP+MYSQL。我不会选择更现代化的前端框架和数据库,担心大模型中相关知识较少,理解的业务类型也较少。
PHP作为“古老”的编程语言,面向各类业务应该有很多成熟的解决方案成为了大模型的训练知识。
其实Pythonye不错,但缺点是依赖的“库”过于丰富,让环境依赖随着项目迭代逐步不可控,并不适合完全不懂程序的小白。