使用Windsurf开发一个NFT共创的web3项目：不使用AI，你都想象不到AI有多厉害！

今天分享一下使用Windsurf创建一个NFT共创的web3项目，如题，不使用AI，你都想象不到他有多厉害！

当下比较火的AI IDE编程工具有Windsurf、Cursor，最近字节跳动也公开了他们的版本Trae。今天分享的这个项目是在Windsurf上实现的，Windsurf 提供免费3天的试用，付费会员需要15刀1个月。

现在的话，推荐去使用字节的免费IDE工具Trae。

下载和安装Windsurf

支持mac和windows。

https://codeium.com/windsurf

安装的过程中，会提示存放项目库的路径。

产品设计和需求整理

有了工具之后，如果我们要开发一个项目，最基础的还是要想清楚这个产品是用来干什么的，业务流程是什么，有什么页面，每个页面有什么功能。

也就是要准备好产品需求，主要包括以下几个方面：产品介绍、业务流程、页面结构、页面功能描述。

在使用前，我构建了一个产品想法：一个AI Agent NFT共创平台，并梳理了产品需求（需求提供给Windsurf前，需要将其翻译为英文）。

我要编写一个ai agent nft 平台，名称为AryArt，该平台利用文生图 ai 大模型驱动。AryArt 旨在开发一个以社区协作和共同成功为重点的人工智能驱动的 NFT 平台。

我们相信社区创造力的潜力是无限的，我们重视每一个 NFT，即使是由人工智能代理生成的 NFT。AryArt 努力平衡价值和价格，以激励、展示和实现创造力。

用户可通过web3浏览器插件连接网站，支持Phantom、okx的chrome插件。

每个用户都可以创建Collection。创建时，选择的base style和prompt文本作为Collection整体的ai prompt。每个用户也可以在任意Collection中创建sub NFT。

创建sub NFT时，需要在collection中选择base NFT或其他NFT作为Parent，在Parent的基础上（以保障collection主题、风格保持一致），输入新的prompt，生成新的图像并mint成sub NFT。

生成的所有图像，都将保存在IPFS网络，实现永久存储。

所需要完成的页面包括：Home、Create Collection、Collections、Collection Details、Mint NFT、NFT Details

每个页面的内容包含如下：

项目代码生成

创建一个文件夹用于存放要生成的项目，建议以项目名称为文件夹名。

打开Windsurf后，菜单File > Open Folder，打开刚刚创建的项目文件夹。

打开之后，将我们翻译好的产品需求，粘贴到右侧的聊天框。发送之后，就可以看到Windsurf开始工作了。

他可以从0自动完成文件结构搭建，生成必要的功能组件，然后按照功能要求生成每个页面。生成完成之后，会报告说，它完成了什么，下一步可以做什么？你想在下一步先做什么？

在这个过程中，Windsurf会自动填充一些页面中的内容，比如说局部模块的文字描述没有顾及到，Windsurf会自动生成文字并填充，而且生成的文字属于地道的英文，而不是翻译风格的英文。

根据Windsurf的指引，你一步一步地给予其反馈，最终会完成项目开发。

本地部署测试

项目开发完成后，在Windsurf 聊天框中，输入

How to test locally

Windsurf 会完成文件配置，并在本地自动安装运行环境。

运行完成后，会引导你配置第三方服务参数配置，以及本地部署的运行后的访问链接。

第三方服务参数配置

项目开发中，会用到很多的第三方服务。Windsurf将用到的第三方服务的配置集中到.env文件中。

我们的这个演示项目，用到了几个第三方服务，示例如下：

REACT_APP_STABLE_DIFFUSION_API_KEY=sk-mHCuT74UQpH*************wfl4vUhjrzF8Z0dGvfvmgf4REACT_APP_NFT_STORAGE_TOKEN=bf31f5fe.12c55e*****d3933f2701fe21c841REACT_APP_CONTRACT_ADDRESS=your_contract_addressREACT_APP_SOLANA_RPC_URL=https://api.mainnet-beta.solana.com

文生图大模型：Stable Diffusion的API服务

IPFS存储：NFT Storage的API服务。

Solana RPC：访问Solana区块链。

Contract_Address：（在演示的项目中，没完全完成项目，尚未用到合约）

成果展示

网站首页

创建AI Art页面

展览页面

Windsurf 产品开发实践经验

如果开发一个简单的网页应用，Windsurf会很容易做到。但是，一般的项目都会稍微复杂一些。就要考虑很多细节问题了。这里我罗列了一些在使用过程中的实践经验：

1、如果不约定前端UI风格，Windsurf会默认只实现功能开发，前端样式比较原始（但即便原始，也是统一性风格的原始）。所以，如果你如果对UI有要求，可以把参考网站提供给Windsurf，让其根据参考网站的风格生成前端页面。

2、产品设计要遵循MVP最小化原型的思路，不要追求大而全，先完成再完美。

3、产品开发的顺序，采用先完成前端页面，再实现后端功能。

4、生成前端页面后，就在本地部署，边测试、边开发、边修订。

5、采用敏捷开发的增量开发原则，一个功能测试通过后，再进入下一个功能。

6、Windsurf 可以自动引用图标icon，但还不能智能生成大图，如果网站中需要配图，需要自行准备插图，放在适当的位置，让windsurf索引。修改logo同样的逻辑。

————————

Hi，我是阿信，一名AI创业者。曾是web3产品经理人和Crypto Holder，2025年我将All in AI，每天学习、实践、分享AI。

私信axin6ai，领取《DeepSeek从入门到精通(20250204)》、《201个AI工具库》，邀请进入免费AI交流群。

2025年 All IN AI，自媒体名称，由慎思知行修改为阿信AI实验室。

一直有创建一个分布式组织的想法，但没有一个好的事的驱动，组织是没有根基的，没有正反馈是难以持久的。希望AI能成为这个驱动力，因为AI既有势又有事。关注「阿信AI实验室」，让我们一起拥抱AI。