javaboy 写了 5 年 CURD,第一次上线完整网站的全流程

201 天前
 kugua233

在银行写了快五年的垃圾代码, 只会增删改查,得益于大模型的能力,终于上线了人生第一个网站!

网站项目地址: https://prompt-well.com/

产品说明:

🚀 prompt-well

这是自动化提示词网站,旨在通过简单描述自动化生成场景提示词 ,帮助提升大模型回答质量。

技术栈:

后端:springboot+mybatisplus+mysql

前端:react+nextui+tailwindcss

部署:阿里云

整体花费:

92 块阿里云买了域名,其他白嫖。

服务器:白嫖阿里云 3 个月免费香港节点,前后端及 Nginx 全部部署在此服务器上

cursor 编辑器:新人白嫖

deepseek 大模型:新人白嫖 deepseek 、阿里云、腾讯云、硅基流动的 API

大模型客户端:cherryStudio ,白嫖

SSL 证书:Certbot 白嫖

开发过程:

1 、技术选型:

技术垃圾,只会公司业务 CURD ,完全没写过登录、支付之类的业务,但有自己开发的一套 springboot 后端脚手架,选择自己最熟悉的后端开发路线。

前端只会点基础的三件套知识,想选点轮子多的,大模型能应付的。参考了网上推荐,选择了 react+nextui+tailwindcss 。

如果再次选型会考虑选 nextjs+shadcn+typescript 。这样可以慢慢完善自己一套的脚手架,而且大模型总是输出 typescript 代码最佳实践,nextui 又改成 heroui ,大模型写代码很混乱。

2 、开发部署:

想走通海外路线,刚好看到阿里云有香港节点服务器试用,不需要备案。是个很好的上手机会,冲了域名和服务器。安装了 ubuntu ,第一步直接开冲nohup java -jar 启动 springboot 。

前端就相对麻烦一点,跟着教程一步一步安装 npm 、nodejs 、tailwindcss 、nextui 。用 pm2 管理 react 进程。本地启动成功,开启前端部署。

然后就是简单联调,跨域报错,寄。借助 deepseek 和网上排查,采用了后端统一处理跨域+Nginx ,这样也不影响本地前后端直接联调。

顺利开局。

3 、代码开发:

后端顺利很多,无非就是接入各家模型平台的 api ,左抄抄右改改,看着接口文档调试一下慢慢就写出来了。就简单写了 2 个接口,还有个接口自用就没放出来,顺利的一批。

前端是最难搞的,那些样式完全搞不定,时间花费最多也在这块。基本没怎么手写代码,全靠 cursor 输出。代码不不能用?整一块删掉让 AI 重写,自己实在改不了太多,项目结构目录也是乱的一匹。

到后面基本就是,算了算了,这样也挺好看了。算了算了,拿掉这部分也不影响。算了算了,让 AI 先写一个局部组件吧。

这里其实最感谢的是 kimi ,因为 kimi 可以截图让他写代码,配合好提示词效果还不错。cursor 好像也可以,但我不太会用,只能整块提问,然后整块应用或整块丢回滚,后面要去学一下 cursor 的使用方法。另外就是配合 deepseek 替我答疑解惑一些技术栈或代码知识点,非常高效,完全不用浏览器再去搜。

PS:用不来 vscode ,前后端都是用 IntelliJ IDEA 。主要是快捷键配好了,一时改不过来很难受。

4 、开始上站

对如何上站完全没有概念,看了部分哥飞建站系列教程。一步一步也慢慢走通了,其实就是对这些不了解,跟着 deepseek 流程其实也能完成。但胜在有个体系流程让你知道下一步应该要干嘛。

因为没有做任何 SEO 的优化,百度和 google 暂时都还搜不到这个网址,但我只想走通这个流程,也没考虑这一块了。

但付费这一块还没走通,好像大家都是用 Stripe ,想着后续也去香港开个卡,接上 Google Adsense ,把整个流程闭环走通。希望服务器免费的三个月内把最后一步搞完。目前只贴了个二维码,付费感觉比较困难个人短时间完成不了,就这样吧。

5 、存在问题

提示词生成效果不好,是因为只调了一次大模型 api ,因为大模型响应太久了。之前设计方案是调用好几次大模型 api ,组合生成提示词。但基本会超时,后面就放弃了,也不打算优化了。

前端太烂了,打算进修一下,学一下别人的脚手架和项目结构。

网址还是搜不到,打算有空优化一下,起码做到能出现在浏览器的页面里。

目标:

1 、域名有效期内,希望能把 92 块域名钱赚回来

2 、继续走完支付流程闭环

3 、做好自用的一套前端脚手架,不用这么手忙脚乱

心得体会

1 、大模型工具确实让编码变得更加容易了,很多之前没想到的事情也慢慢变得触手可及

2 、学会善用工具,这次我觉得好用的工具包括但不限于:大模型( kimi 、deepseek 、cursor )、React 依赖包( axios 、react-ga4 、react-markdown )、cherrystudio 、Certbot

3 、服务器和域名尽量还是海外购买吧,省事一点

4 、尽快有自己的一套开发脚手架,熟悉的东西配合 AI 写起来飞快

2913 次点击
所在节点    分享创造
11 条回复
ala2008
201 天前
👍有模有样了
kugua233
201 天前
@ala2008 谢谢,慢慢多尝试吧
vansiit
201 天前
改下 favicon.ico 和 title 吧,看着难受 [dog]
fzdoudou
201 天前
妈呀执行力太强了,做了我一直想做的,向你学习
mobyride
200 天前
赞👍
Amose2024
200 天前
这是用来收集别人 api 官钥的吗?[手动狗头]
kugua233
200 天前
@vansiit 难受的地方可太多了 hhh
kugua233
200 天前
@fzdoudou 谢谢,也是一时脑热,突然想做点什么
kugua233
200 天前
@Amose2024 api 价格现在很便宜了,而且被发现会被喷吧,实在看不到啥收益。
kugua233
200 天前
@mobyride 感谢支持🙏
bytesfold
200 天前
好的开始

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/1111482

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX