企业官网建设流程全解析

编写网站的语言有哪些,陕西城乡建设网官网,深圳网站建设 设计首选深圳市,建程网下载安装文章目录一、前言二、这一年用过的那些 AI三、这一年用 AI 开发的项目3.1、搭建 RAG 应用3.2、AI 网站实践3.3、开发一个简单的电商网站3.4、基于 MCP 开发的应用3.5、〈王者荣耀〉战区排行榜3.6、开发一个网页版小游戏3.7、开发微信小游戏《我的早餐店》3.8、H5应用开发《时空…文章目录一、前言二、这一年用过的那些 AI三、这一年用 AI 开发的项目3.1、搭建 RAG 应用3.2、AI 网站实践3.3、开发一个简单的电商网站3.4、基于 MCP 开发的应用3.5、〈王者荣耀〉战区排行榜3.6、开发一个网页版小游戏3.7、开发微信小游戏《我的早餐店》3.8、H5应用开发《时空艺术馆》3.9、海外版《二手书交易平台》平台四、结语一、前言2025年1月20日DeepSeek-R1 深度思考模型横空出世打破高性能模型的高昂成本一石激起千层浪。AI 浪潮快速席卷各行各业扩散至每个行业、每个工作场景、每个创作者。2025年已经是AI行业从单纯的参数军备竞赛转向价值落地 和 高性价比的新阶段。第一次跟 DeepSeek-R1 进行对话不仅能理解模糊的描述还能主动提出建议甚至预见到我尚未察觉的情况。也是被深深的震撼到了。模型能力对比推理能力代码生成数学能力多语言长上下文指令跟随1009080706050403020100分数(树状图2023-2024主流模型 折线图DeepSeek-R1)2025年 可以当得上中国国内的AI元年代码生成、视频创作开始出现生态。2025年AI市场已经不像之前那样巨头垄断大厂炼模型OpenAI, Google、中小厂做应用垂直领域、开源生态DeepSeek, Llama倒逼闭源。DeepSeek-R1 已经证明完全可以用强化学习和蒸馏技术让小参数模型也能达到非常强的性能。同时国产模型像 Qwen3、Kimi K2 也在进一步缩小跟顶尖模型的差距。2025年的AI工具版图已经高度细分。特别是对话、视觉、编程三大领域。视频创作工具工具名称核心功能表现/定位Sora / Sora 2文生视频行业标杆生成视频的物理规律模拟最真实但门槛比较高。Kling (可灵)视频生成国产领先画质非常棒、动作也流畅最适合中文提示而且能长视频生成。MidjourneyAI绘画艺术性最强V7版本的细节和光影质感都非常好是很适合专业设计的。Vidu视频生成国产视频大模型。Grok Image图像生成黑马能生成带文字的超逼真图像。编程开发的生态工具名称类型特点CursorAI原生编辑器最专业用对话重构编程体验深度集成代码库理解。CodeBuddyAI原生编辑器腾讯出品全流程自动化开发支持插件TraeAI原生编辑器字节跳动出品全流程自动化开发。GitHub CopilotIDE插件生态最广依托GitHub庞大代码库。工具之间的边界正在模糊。AI 已经不是只解决某个问题了已经可以用工作流串联形成从想法到成品的自动化流水线。AI 也在改变开发者的工作方式开发者也在用提示工程、系统设计和价值判断训练AI的能力边界。接下来的内容就是我这一年用AI的实战记录用真实的项目从零构建价值也是在 AI 浪潮对自己重新定位价值的思考笔记。二、这一年用过的那些 AI作为技术开发者用得最多的是编程开发方面的AI工具也折腾了一圈 AI 编程 IDE有Cursor、CodeBuddy、Trae、Claude Code等。这里先来聊聊 各个AI IDE 的使用感受这些AI IDE的底子都是 VS Code。插件生态和VSCode兼容快捷键和 UI 也没什么上手门槛。但相比单纯装个 Copilot 插件这些独立 IDE 最大的不同是Agent 模式。直接用中文写需求就能生成代码自己规划步骤、调用本地工具把编程的活从头干到尾。代码片段、报错文件、项目文件夹直接引入对话框从我的感受来说确实比普通 IDE 顺手太多太多。下面就重点聊聊用得比较顺手的几款CursorCursor 的名气不用多说直接付费上的车贵是贵了点但值得。优势 能直接用上 Claude 3.5 Sonnet写复杂逻辑的优势非常明显。交互体验 我非常喜欢它的 Auto Agent 逻辑。我不喜欢写代码还要去选“现在是用补全模式还是问答模式”要的就是Cursor 这种无脑帮搞定。现在很多 IDE 都有 Cursor 的影子不得不承认Cursor 确实是稳。TraeTrae 其实就是字节跳动 MarsCode 的进化版从插件变成独立 IDE。它分国内版Trae CN和海外版我都试了试。Trae CN国内版 最大的良心就是免费。模型接的是 DeepSeek、Qwen、Minimax 还有自家的 Seed。虽然免费很香但国内版默认环境偏 Linux Windows 上用老是给整 Linux 命令还得反复提醒它 用 PowerShell 这点比较浪费时间。Trae国际版 体验明显上一个台阶。支持 ChatGPT、Gemini 等主流模型。虽然官方力推 Gemini但我实测下来还是 GPT-4o 更懂我Gemini 有时候戏太多容易过度发挥。模式细节 SOLO 模式其实就是 Agent分 Coder 和 Builder。我主要用 Coder代码实现Builder 感觉更适合从零搭 Web 项目。另外它有个 Plan 模式开关开了会先出方案再动工和 Cursor 的逻辑很像对复杂任务很有帮助。CodeBuddy腾讯云推出的先是插件然后出的海外版十月份才出的国内版。特点 最吸引我的是 Sandbox沙盒 机制。以前做大范围重构或测试新功能得小心翼翼切分支、怕弄坏环境。CodeBuddy 用一个隔离环境让 AI 随意折腾文件、跑代码跑通再合并回来。这种低成本试错 的体验给我感觉非常好。所以也成了我用得最多的一个AI IDE。使用感受没有 Cursor 那么丝滑但CodeBuddy 的 UI 交互没那么傻瓜化带点 极客风。如果经常要做复杂的代码审查Review或者逻辑梳理它对上下文的抓取精度很不错不会一本正经胡说八道。三、这一年用 AI 开发的项目接下来就说说我在 2025 都要 AI IDE 做了哪些项目。主要是用 CodeBuddy 进行的项目开发。为什么不用 Cursor 因为贵为什么不用 Trae因为我用CodeBuddy更顺手。3.1、搭建 RAG 应用RAGRetrieval-Augmented Generation是一种结合信息检索和生成式语言模型的方法。最简单的理解可以认为是给大模型外挂了一个知识库。大模型经常因为数据缺乏而产生问题建立向量知识库可以解决这一问题。大模型首先从知识库检索跟提示相关的领域知识然后把这些知识跟原始提示结合作为大模型的输入。我是从两个方面入手企业和科研。基于 DeepSeek 模型构建企业知识管理的RAG应用。因为企业的数据是分散的不同部门和系统各自为政信息孤立。企业主要靠手动整理和维护知识库或通过规则驱动的搜索引擎来查找信息。时间成本和难度都很大。基于这样的考量那就用LMRAG、MLLM等技术手段对复杂文档进行精准智能解析提升知识提取的效率和质量。企业大模型必须要满足准确性、数据隐私安全以及信息更新速度的要求RAG检索增强生成框架就可以很好地解决这些问题。有了技术支持我就尝试构建这类RAG应用了。以 DeepSeek-R1/V3 大模型为核心的知识问答应用就像这样既然可以做企业的知识库那 RAG应用 是不是也可以为科研工作服务学术论文非常多能不能让AI帮忙快速辨别哪些文献和自身研究方向真正相关哪些是值得深入研读的说干就干做一个基于RAG技术的论文阅读助手。把信息检索的精准性和自然语言生成的完美结合。我把系统分解成四个核心模块用户界面、论文解析模块、知识检索模块和答案生成模块。系统架构简略图就是这样有点粗糙但不碍事嘿嘿---------------------------------------------------|用户界面||[论文上传][问题输入][结果展示]|---------------------------------------------------||vv---------------- -----------------------|论文解析模块|---|知识检索模块|||||---------------- -----------------------||vv---------------------------------------------------|答案生成|---------------------------------------------------下面是论文上传功能的核心实现configCosConfig(Regionregion,SecretIdtmpSecretId,SecretKeytmpSecretKey,TokentmpToken,Schemehttps)clientCosS3Client(config)# 用高级接口上传一次不重试此时没有使用断点续传的功能responseclient.upload_file(Bucketbucket,KeyuploadPath,LocalFilePathfileName,EnableMD5False,progress_callbackNone)print(上传后结果:str(response))rspresponse eTagrsp.get(ETag)cosHashrsp.get(x-cos-hash-crc64ecma)print(etag: eTag)print(coshash: cosHash)try:params{BotBizId:BotBizID,FileName:fileName,FileType:fileExt,CosUrl:uploadPath,ETag:eTag,CosHash:cosHash,Size:str(os.path.getsize(fileName)),AttrRange:1}credcredential.Credential(SecretID,SecretKey)httpProfileHttpProfile()httpProfile.endpointEndPoint clientProfileClientProfile()clientProfile.httpProfilehttpProfile common_clientCommonClient(lke,2023-11-30,cred,Region,profileclientProfile)respcommon_client.call_json(SaveDoc,params)exceptTencentCloudSDKExceptionaserr:print(err)try:params{BotBizId:BotBizID}credcredential.Credential(SecretID,SecretKey)httpProfileHttpProfile()httpProfile.endpointEndPoint clientProfileClientProfile()clientProfile.httpProfilehttpProfile common_clientCommonClient(lke,2023-11-30,cred,Region,profileclientProfile)respcommon_client.call_json(CreateRelease,params)exceptTencentCloudSDKExceptionaserr:print(err)答案生成模块的核心实现defsse_client(sid:str):bot_app_key******visitor_biz_id202503020001# 访客 IDstreaming_throttle1# 节流控制req_data{content:,bot_app_key:bot_app_key,visitor_biz_id:visitor_biz_id,session_id:sid,streaming_throttle:streaming_throttle}try:whileTrue:contentinput(请输入你想问的问题)ifcontentexit:exit(0)req_data[content]contentprint(req_data:)#print(req_data)# print(freq_data:{req_data})resprequests.post(https://wss.lke.cloud.tencent.com/v1/qbot/chat/sse,datajson.dumps(req_data),streamTrue,headers{Accept:text/event-stream})print(resp:)#print(fresp:{resp.text})clientsseclient.SSEClient(resp)print(Client:)forevinclient.events():print(fevent:{ev.event}, data:{ev.data})datajson.loads(ev.data)ifev.eventreply:ifdata[payload][is_from_self]:# 自己发出的包print(fis_from_self, event:{ev.event}, content:{data[payload][content]})elifdata[payload][is_final]:# 服务端event传输完毕服务端的回复是流式的最后一条回复的content包含完整内容print(fis_final, event:{ev.event}, content:{data[payload][content]})else:print(fevent:{ev.event}, data:{ev.data})exceptExceptionase:print(e)完整的项目代码托管在Gitee 仓库因为我不擅长做前端界面所以就直接用的文本模式。基于 RAG 的大模型非常有应用前景。3.2、AI 网站实践今年 腾讯云 EdgeOne Pages 最先开放 DeepSeek R1 AI 聊天模板的免费公测支持边缘节点部署 AI 模型所以我也用 EdgeOne Pages 部署 DeepSeek R1构建一个 AI 网站。在线 AI 输入一段文字指令“Hi请帮我生成一个 520 浪漫表白的 HTML 页面”。生成的 HTML 代码详细呈现生成过程包括参考信息和 AI 的思考逻辑。生成的效果图简单几步就成功部署基于 DeepSeek R1 模型的 AI 网站。AI大模型在各种垂直领域的应用已经炉火纯青到这个地步了3.3、开发一个简单的电商网站CodeBuddy Craft智能体刚出来我就使用了。是一款基于AI的智能代码助手通过对话式编程。对话式编程就是用自然语言跟智能体进行交流来自动生成代码、修改代码、调试代码。最先想到的是用Craft智能体对话方式开发一个电商网站网站要有商品展示、用户注册登录等功能。然后支持用户评论功能也就是为商品详情页添加一个用户评论功能对商品进行评价也会显示其他用户的评论。这个场景比较具体涉及到代码生成、代码修改、还要简单的调试。生成第一版本的效果真不错不过还有优化空间然后就继续让AI智能体帮优化、新增功能实现用户登录注册功能。登录页面注册页面注册账户和登录之后评论功能的效果整个过程不需要我写任何代码Craft 智能体通过自然语言描述自主的完成项目开发。看一下完整的效果3.4、基于 MCP 开发的应用MCP是新兴的模型上下文协议能整合多源信息为AI模型提供结构化、动态的上下文支持。为了试试 MCP我首先想到了ArXiv MCP Server是一个基于模型上下文协议MCP的专用服务器。可以为 AI 助手提供强大的 arXiv 论文搜索和分析功能。所以我集成ArXiv MCP server 到 CodeBuddy。让 AI 可以搜索和访问arXiv论文集成调用这太文本了没有成就感。恰逢 520所以我又用 CodeBuddy 做了两个浪漫的项目。520回忆地图效果如下因为百度/高德地图 SDK是要密钥的所以我在GitHub上找了一个开源的地图。地图渲染有点慢不过 项目功能实现了并部署成功地址https://mcp.edgeone.site/share/DZOn0BC3fsmFiWParIhoK里面有隐藏三种不同类型的彩蛋地图点击彩蛋在地图特定区域北纬35-36度东经115-116度之间点击会触发隐藏消息。时间彩蛋访问页面30秒后会触发心形动画。Konami代码彩蛋输入经典的Konami代码↑↑↓↓←→←→BA会显示秘密相册。这里就不放图了。还有一个 《爱的密码锁》网站也是做的比较有特色。网站初始界面是一个密码锁密码是5201314爱你一生一世输入正确密码后点击解锁按钮即可进入内容页面。访问地址在这https://mcp.edgeone.site/share/v4x0AH_6xKrC0BSclf_Qk项目已提交到GitHubhttps://github.com/LongTengFly/HTML-CSS-JS/。3.5、〈王者荣耀〉战区排行榜这里我用 CodeBuddy 的智能体从零开始构建一个基于 Redis MySQL 双引擎驱动的排行榜系统 Demo。用AI进行 数据库设计、核心业务逻辑实现分数更新、排名查询、数据同步机制构建等。先看一下效果整体流畅度都很好。系统的整体架构概览图1玩家分数更新流程2排行榜查询流程3数据同步流程实时分数更新排行榜查询是最常进行的操作。主要从 Redis 中获取排名数据然后从 MySQL 中获取附加信息。设计的大概流程就是这样数据同步服务是一个独立的后台进程上面就是所有的设计结构。项目代码已更新到GitHubhttps://github.com/LongTengFly/Python。用 AI 工具 CodeBuddy 的智能体在相对较短的时间内完成这个双引擎驱动的排行榜系统的核心功能开发。3.6、开发一个网页版小游戏先看效果真的很美观这个要实现前后端前端用的HTML、css、js用 Python 做后端服务器。后端的代码实现非常简单fromhttp.serverimportHTTPServer,SimpleHTTPRequestHandlerimportosclassCORSHTTPRequestHandler(SimpleHTTPRequestHandler):defend_headers(self):# 添加CORS头允许跨域请求self.send_header(Access-Control-Allow-Origin,*)self.send_header(Access-Control-Allow-Methods,GET, POST, OPTIONS)self.send_header(Access-Control-Allow-Headers,Content-Type)super().end_headers()defdo_OPTIONS(self):# 处理预检请求self.send_response(200)self.end_headers()defrun_server(port8000):# 确保服务器运行在正确的目录current_diros.path.dirname(os.path.abspath(__file__))os.chdir(current_dir)server_address(,port)httpdHTTPServer(server_address,CORSHTTPRequestHandler)print(fStarting server on port{port}...)print(fVisit http://localhost:{port}to play the game)try:httpd.serve_forever()exceptKeyboardInterrupt:print(\nShutting down server...)httpd.server_close()if__name____main__:run_server()可以用“惊艳”来形容。从最简单的指令到成功部署上线AI 工具代码生成能力高度的自动化和智能化。3.7、开发微信小游戏《我的早餐店》今年我开通腾讯云开发 (Tencent CloudBase)云原生一体化开发平台。用 AI 工具 和 后端云服务 开发了第一款微信小程序《我的早餐店》模拟经营 时间管理。先看成果这个开发过程非常有意思用AI的快速智能编程最快一个小时就可以完成项目搭建效果非常不错虽然没有达到商业级别但通过不断的优化新增需求说明相信是可以做出商业版的小游戏的。下面是我的开发界面展示项目已在 Gitee 平台进行完整开源项目地址 https://gitee.com/long-xu/breakfast-shop-game项目的开发主要基于以下技术微信小程序原生开发框架 提供前端界面的构建与交互能力。微信云开发 作为后端服务实现了高效的云端一体化开发体验具体包括云函数 (Cloud Functions) 提供无服务器的后端逻辑处理能力例如排行榜数据获取、用户数据更新等。云数据库 (Cloud Database) 用于存储游戏数据、用户数据等实现数据持久化。项目的主要目录结构breakfast-shop-game/ ├── cloudfunctions/# 存放所有云函数的目录每个子目录代表一个独立的云函数│ ├── getRankList/# 获取游戏排行榜数据│ ├── updateRanking/# 更新玩家排行榜分数│ ├── updateUserData/# 更新用户游戏数据如金币、等级等│ └── upgradeEquipment/# 处理游戏设备升级逻辑├── miniprogram/# 微信小程序前端代码目录│ ├── images/# 存放项目所需的各类图片资源│ ├── pages/# 存放所有页面模块的目录│ │ ├── game/# 游戏主界面包含核心玩法逻辑│ │ ├── index/# 应用程序的入口或欢迎页面│ │ ├── ranking/# 显示玩家排行榜的页面│ │ ├── shop/# 游戏内商店用于购买或升级物品│ │ └── user/# 用户个人信息及设置页面│ ├── app.js# 小程序全局逻辑入口文件│ ├── app.json# 小程序全局配置文件定义页面路径、窗口样式等│ └── app.wxss# 小程序全局样式文件├── project.config.json# 微信开发者工具的项目配置文件└── README.md# 项目说明文档包含项目介绍、部署指南等感受 “早餐店游戏”作为一次完整的微信小程序开发实践也让我学到了基本游戏逻辑、用户数据管理和排行榜功能的模拟经营类小游戏。除了小游戏我还用AI打造个人专属的 “云书房” 小程序成果展示项目结构myCloudStudyRoom/ ├── cloudfunctions/# 云函数目录│ ├── getArticleDetail/# 获取文章详情│ ├── getCollections/# 获取收藏列表│ ├── getOpenId/# 获取用户OpenID│ └── toggleCollection/# 切换收藏状态├── miniprogram/# 小程序前端代码│ ├── components/# 自定义组件│ ├── images/# 图片资源│ ├── pages/# 页面│ │ ├── article/# 文章相关页面│ │ ├── collection/# 收藏页面│ │ ├── index/# 首页│ │ └── user/# 用户页面│ ├── app.js# 小程序入口文件│ ├── app.json# 小程序全局配置│ └── app.wxss# 小程序全局样式├── project.config.json# 项目配置文件└── README.md# 项目说明文档项目地址 https://gitee.com/long-xu/ai-game/tree/master/myCloudStudyRoom整个架构的前后端都比较顺畅已经能满足基本需求。这个开发的过程非常有趣我也是乐在其中3.8、H5应用开发《时空艺术馆》我没做过 H5 应用但还是想尝试AI 给了这么个机会。效果是这样的整个H5应用用 3 个页面组成核心页面首页 用全屏粒子背景粒子颜色紫色渐变。导航 页面底部设浮动导航栏包含“创作间”、“展厅”和“我的展馆”三个功能按钮。创作空间页面上传区、风格选择器和生成按钮等组件。效果还是非常不错的虽然没有达到商业级别但是用 Prompt Engineering 生成的代码已经很不错了。项目结构art-gallery-h5/ ├── src/# 源代码目录│ ├── components/# 通用组件│ ├── pages/# 页面组件│ ├── hooks/# 自定义 Hooks│ ├── layouts/# 布局组件│ ├── lib/# 工具函数和服务│ └── configs/# 配置文件├── public/# 静态资源├── cloudfunctions/# 云函数目录└── cloudbaserc.json# 云开发配置文件项目地址https://gitee.com/long-xu/art-gallery-h5感受也是体验了一波 零代码开发的流程。3.9、海外版《二手书交易平台》平台现代网站都是要跟后端服务进行数据交互实现用户注册、商品管理、订单处理等复杂功能。CodeBuddy IDE 内置BaaS服务一个人就可以全栈开发动态网站。效果就这样的整体界面还是非常好看非常的丝滑前后端分离开发不分家一个CodeBuddy就能搞定一站式全流程自动化开发。这中间我还用了AI IDE 内置的 Fagma 非常方便下面是开发过程中 CodeBuddy 列出的开发计划包括以完成的和正在进行的这个真的非常棒进度、状态一目了然真是小白都能看懂啊。最终的项目结构second-hand-books/ ├── client/# Frontend React application│ ├── public/# Static files│ ├── src/# Source code│ │ ├── components/# Reusable components│ │ ├── pages/# Page components│ │ ├── store/# Redux store and slices│ │ └──... │ └──... ├── server/# Backend Node.js application│ ├── src/ │ │ ├── config/# Configuration files│ │ ├── controllers/# Route controllers│ │ ├── middleware/# Custom middleware│ │ ├── models/# Database models│ │ ├── routes/# API routes│ │ └── utils/# Utility functions│ └──... ├── uploads/# Uploaded files (images)├── docker-compose.yml# Docker Compose configuration├── Dockerfile.client# Frontend Dockerfile├── Dockerfile.server# Backend Dockerfile└── README.md# Project documentation四、结语不知不觉我已经在CSDN连续创作 7 年了创作过程我一直坚持的是不充数量保证质量。保持高质量高水平创作。2025年累计创作有 110 篇以上的高质量文章阅读量少说也有400万吧我最惬意的写作时间是晚上因为这是完全属于我的个人休闲时间基本都投入到技术创作中。下面是 CSDN 官方的数据统计其中也有年度之最很多博主断更的原因是把写作当成了额外的负担。我喜欢分享、乐于付出时间创作通过博客结识有趣灵魂。所以在CSDN创作的一年从精神和能力上对我自己都有很大的提升2026年继续前行。回头看这一年我看到了 DeepSeek-R1 的低成本也运用了 CodeBuddy 和 Cursor 最大的感受是自由。以前想做一个《我的早餐店》这样的小程序或者搞个 RAG 知识库都得先掂量掂量手里的时间前端要写多久后端接口怎么通数据库怎么设计但 2025 年代码实现的成本已经在无限压缩创意的价值在无限放大。当然了这一路也不是完全 躺平就可以的。像 MCP 这样的新兴技术要想做一个合格的应用像前面做的游戏《战区排行榜》系统AI 也是会一本正经胡说八道的我就经常遇到写出跑不通的 Bug。这时候就要自己有扎实的技术底子了。因为 AI 能决定的是开发的下限开发者才是决定项目的上限。2025 年对于技术人来说唯一的壁垒就是自己的行动力焦虑是最没用的情绪。