基于DeepSeek API和VSCode的自动化网页生成流程
1.创建API key
访问官网DeepSeek ，点击API开放平台。
在开放平台界面左侧点击API keys，进入API keys管理界面，点击创建API key按钮创建API key，名称自定义。
2.下载并安装配置编辑器VSCode
官网Visual Studio Code - Code Editing. Redefined，安装过程不赘述，这里只讲配置。
我们可以把VS Code设置成中文，选择左侧菜单栏中的扩展选择项。在搜索栏中输入Chinese。
按住键盘上的“Ctrl+Shift+P”组合键，打开命令面板。在命令面板的输入框中输入“Configure Display Language”，然后选择该选项。
重启后生效，界面就是中文的了。
3.接入DeepSeek的API
在拓展中输入Cline，选择并安装。
安装完毕，左侧可以看到cline选项。
点击选项，可以看到刚才安装的Cline插件。
在API选项中，选择DeepSeek。
输入前面我们在DeepSeek官网注册的API key。复制APIKEY粘贴即可。然后点击Let's go！
可以在对话框中输入问题，比如你是谁？点击执行。
它会给出回答，如下所示吧啦吧啦，说明已经成功接入了DeepSeek API。
用户询问我的身份。我是一名高度熟练的软件工程师，拥有多种编程语言、框架、设计模式和最佳实践的广泛知识。我可以帮助用户完成各种编程和开发任务。我是Cline，一名高度熟练的软件工程师，拥有多种编程语言、框架、设计模式和最佳实践的广泛知识。我可以帮助您完成各种编程和开发任务。
4.演示完成编程需求
接下来我们就让它帮我们完成一个编程需求。输入我们的提示词：
创建一个网页，标题为“赛博木鱼”，设计要求如下：页面整体布局
背景与样式：背景颜色为深色#121212,文字颜色为纯白#FFFFFF。
使用楷体'Kaiti SC'和现代字体'PingFang SC'，无对应字体时备用sans-serif。页面内容居中对齐，顶部为标题区，中央为木鱼点击区域，底部为提示文字，整体垂直分布。
标题区：
包含三个部分：
主标题：显示渐变文字“赛博木鱼”，字体大小为25vw，使用'Kaiti SC'，渐变从rgba(255,176,103,0.05)（浅绿色）到rgba(115,55,0,0.02)（浅棕色），方向为180度，通过webkit-background-clip:text和-webkit-text-fill-color:transparent实现渐变文字效果。
计分器：显示分数，初始值为0，字体大小10vh，字体为PingFang 5C，加粗900，垂直居中。
木鱼点击区：
包含一个木鱼和锤子图案：
木鱼图片链接：https://img.alicdn.com/imagextra/i1/O1CN012CO0YU1VSfNs506ZS_!!6000000002652-2-tps-284-236.png
锤子图片链接：https://img.alicdn.com/imagextra/i1/O1CN01tKb5Et1aSjWRjCHK3_!!6000000003329-2-tps-119-69.png
锤子的相对位置：锤子固定在木鱼的右上角，具体位置为相对于木鱼的右侧边缘偏上，保持一定距离以呈现动态打击效果。锤子的初始旋转角度为0度。静态时与木鱼形成俯视敲击的视觉关系。点击木鱼触发以下交互：播放点击音效，音频链接：https://qianwen.alicdn.com/resource/qiaomuyu.mp3
锤子短暂旋转（-25°），随后复位至0°，动画时间为0.1s，木鱼放大至scale（1.1）后复位，动画时间为0.1s.显示动态漂浮字幕“功德+1”。字体为PingFang SC,大小1.5em，位置从木鱼上方飘浮消失，动画时间0.4s。点击后分数加1，实时更新计分器内容。执行任务，cline就会进行网页文件的创建以及对应代码的编写。创建完成以后，我们点击Save按钮保存。
这是自动生成的网页文件：
<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>赛博木鱼</title><link rel="stylesheet" href="style.css">
</head>
<body><div class="container"><div class="header"><h1 class="title">赛博木鱼</h1><div class="counter">功德：<span id="score">0</span></div></div><div class="muyu-area"><div class="muyu-container"><img src="https://img.alicdn.com/imagextra/i1/O1CN012CO0YU1VSfNs506ZS_!!6000000002652-2-tps-284-236.png" alt="木鱼" class="muyu"id="muyu"><img src="https://img.alicdn.com/imagextra/i1/O1CN01tKb5Et1aSjWRjCHK3_!!6000000003329-2-tps-119-69.png"alt="锤子"class="hammer"id="hammer"></div></div><div class="floating-text-container" id="floating-text-container"></div></div><audio id="sound-effect"><source src="https://qianwen.alicdn.com/resource/qiaomuyu.mp3" type="audio/mpeg"></audio><script src="script.js"></script>
</body>
</html>
运行效果：
总结：本文展示了基于DeepSeek API和VSCode的自动化网页生成流程。已经成功创建了一个标题为“赛博木鱼”的网页，并定义了页面的布局、样式和功能需求。
相关文章：
基于DeepSeek API和VSCode的自动化网页生成流程
1.创建API key 访问官网DeepSeek ，点击API开放平台。 在开放平台界面左侧点击API keys，进入API keys管理界面，点击创建API key按钮创建API key，名称自定义。 2.下载并安装配置编辑器VSCode 官网Visual Studio Code - Code Editing…...
【AI时代】Page Assist - 本地 AI 模型的 Web UI （谷歌浏览器） 本地DeepSeek启用联网功能
Page Assist - 本地 AI 模型的 Web UI 一、部署本地模型 参考教程：https://blog.csdn.net/Bjxhub/article/details/145536134二、安装插件 Page Assist 浏览器谷歌商店搜索 Page Assist ，安装该插件。 注意：需要一点科学的魔法。 三、使用…...
电脑IP地址自定义
1.连接WIFI 2.打开控制面板 3.打开网络共享中心 4.选择想要修改的WIFI 点击连接的WIFI选择属性 点击要修改的配置协议IPV4/IPV6 设置IP地址为需要的地址...
python卷积神经网络人脸识别示例实现详解
目录 一、准备 1）使用pytorch 2）安装pytorch 3）准备训练和测试资源 二、卷积神经网络的基本结构 三、代码实现 1）导入库 2）数据预处理 3）加载数据 4）构建一个卷积神经网络 5࿰…...
EX_25/2/11
将 epoll 服务器 客户端拿来用 客户端： 写一个界面，里面有注册登录 服务器：处理注册和登录逻辑，注册的话将注册的账号密码写入数据库，登录的话查询数据库中是否存在账号，并验证密码是否正确 额外功能&a…...
二.2 整数表示（2.1-2.4）
在本节中，我们描述用位来编码整数的两种不同的方式：一种只能表示非负数，而另一种能够表示负数、零和正数。后面我们将会看到它们在数学属性和机器级实现方面密切相关。我们还会研究扩展或者收缩一个已编码整数以适应不同长度表示的效果。 图2…...
中间件-安装Minio-集成使用（ubantu-docker）
目录 1、安装docer 2、运行以下命令拉取MinIO的Docker镜像 3、检查当前所有Docker下载的镜像 4、创建目录 5、创建Minio容器并运行 6、SDK操作 FileUploader.java 1、安装docer 参考这篇：Linux安装Docker 2、运行以下命令拉取MinIO的Docker镜像 docker pull…...
夸克网盘多链接批量保存，自动同步更新，批量分享
最近夸克网盘有点火，好多资源都上夸克网盘了，做了一个夸克网盘的批量化程序，已经打包好了，不用配置代码环境就能用 夸克网盘工具：https://pan.quark.cn/s/c22f3451a6ab 百度网盘工具：https://pan.quark.cn…...
2025清华：DeepSeek从入门到精通.pdf（附下载）
本文是一份关于如何深入理解和使用DeepSeek技术的全面指南，由清华大学新闻与传播学院新媒体研究中心元宇宙文化实验室的余梦珑博士后及其团队编撰。DeepSeek是一家中国科技公司，专注于通用人工智能（AGI）的研发，其开源推…...
【AIGC】在VSCode中集成 DeepSeek（OPEN AI同理）
在 Visual Studio Code (VSCode) 中集成 AI 编程能力，可以通过安装和配置特定插件来实现。以下是如何通过 Continue 和 Cline 插件集成 DeepSeek： 一、集成 DeepSeek 获取 DeepSeek API 密钥：访问 DeepSeek 官方网站，注册并获取 …...
android动态设置是否允许应用卸载
摘要：通过广播设置全局参数控制应用是否允许卸载，全局参数在Launcher和PackageInstaller两个模块中使用到。此功能可用于MDM后台控制是否允许设备卸载应用。 1. 静态注册广播 由于系统安装和卸载的功能集中在PackageInstaller模块中，为了更…...
基于微信小程序的博物馆预约系统的设计与实现
hello hello~ ，这里是 code袁~💖💖 ，欢迎大家点赞🥳🥳关注💥💥收藏🌹🌹🌹 🦁作者简介：一名喜欢分享和记录学习的在校大学生…...
使用NPOI自定义导出excel文件
说明 1、自定义列名，将从数据库查询到的数据赋值到对应的单元格上。 2、excel文件默认导出到桌面。 3、支持进度条显示。 界面 功能实现 public void TaskTest(){Task task new Task(ExportExcel);task.Start(); }/// <summary>/// 查询数据/// </summa…...
基于vue2 的 vueDraggable 示例，包括组件区、组件放置区、组件参数设置区 在同一个文件中实现
为了在Vue 2中实现一个包含组件区、组件放置区以及组件参数设置区的界面，我们可以使用vue-draggable库来处理拖拽功能，并结合其他UI组件库如Element UI来构建界面。下面是一个基本的示例，展示如何实现这样的布局。 第一步：安装必…...
使用rknn进行facenet部署
文章目录 开源仓库pth转onnxnetron可视化onnx转rknnC++实现开源仓库 https://github.com/bubbliiiing/facenet-pytorch pth转onnx 修改facenet网络的forward函数代码 修改前 def forward(self, x, mode = "predict"):if mode ==...
#渗透测试#批量漏洞挖掘#29网课交单平台 SQL注入
免责声明 本教程仅为合法的教学目的而准备，严禁用于任何形式的违法犯罪活动及其他商业行为，在使用本教程前，您应确保该行为符合当地的法律法规，继续阅读即表示您需自行承担所有操作的后果，如有异议，请立即停止本文章读。 目录 1. 漏洞原理 2. 漏洞定位 3. 攻击验证示…...
百问网imx6ullpro调试记录（linux+qt）
调试记录 文章目录 调试记录进展1.开发板相关1.1百问网乌班图密码 1.2 换设备开发环境搭建串口调试网络互通nfs文件系统挂载 1.3网络问题1.4系统启动1.5进程操作 2.QT2.1tslib1.获取源码2.安装依赖文件3.编译 2.2qt移植1.获取qt源码2.配置编译器3.编译 2.3拷贝到开发板1.拷贝2.…...
【python】3_容器
目录 一、列表 list 1.1基本语法 1.2 常用操作方法 1.3 列表的遍历 二、元组 tuple 特点： 三、字符串 常用操作方法： 四、序列 操作方法：切片 五、元素 特点： 基本语法： 集合常用功能： 六、字…...
数据结构与算法：动态规划dp：背包问题：理论基础（状态压缩/滚动数组）和相关力扣题（416. 分割等和子集、1049.最后一块石头的重量Ⅱ、494.目标和）
背包问题 01背包理论基础 对于01背包问题，物品下标为0到i，对应的重量为weight[0]到weight[i]，价值为value[0]到value[i]，每个物品只可以取或不取，背包最大容量为j的场景。 常见的状态转移方程如下： dp[i…...
数字游牧时代：IT人力外包的范式革命与文明重构
当英国工业革命时期的企业主们将生产环节外包给家庭作坊时，他们不会想到这种生产组织方式会演变为21世纪最复杂的商业形态。IT人力外包行业在经历三十年爆炸式增长后，正在经历一场静默的范式革命。这场革命不仅重构着全球IT产业链的拓扑结构，…...
iOS 26 携众系统重磅更新，但“苹果智能”仍与国行无缘
美国西海岸的夏天，再次被苹果点燃。一年一度的全球开发者大会 WWDC25 如期而至，这不仅是开发者的盛宴，更是全球数亿苹果用户翘首以盼的科技春晚。今年，苹果依旧为我们带来了全家桶式的系统更新，包括 iOS 26、iPadOS 26…...
SpringBoot+uniapp 的 Champion 俱乐部微信小程序设计与实现，论文初版实现
摘要 本论文旨在设计并实现基于 SpringBoot 和 uniapp 的 Champion 俱乐部微信小程序，以满足俱乐部线上活动推广、会员管理、社交互动等需求。通过 SpringBoot 搭建后端服务，提供稳定高效的数据处理与业务逻辑支持；利用 uniapp 实现跨平台前…...
ArcGIS Pro制作水平横向图例+多级标注
今天介绍下载ArcGIS Pro中如何设置水平横向图例。 之前我们介绍了ArcGIS的横向图例制作：ArcGIS横向、多列图例、顺序重排、符号居中、批量更改图例符号等等（ArcGIS出图图例8大技巧），那这次我们看看ArcGIS Pro如何更加快捷的操作。…...
是否存在路径（FIFOBB算法）
题目描述 一个具有 n 个顶点e条边的无向图，该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序，确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数，分别表示n 和 e 的值（1…...
NPOI Excel用OLE对象的形式插入文件附件以及插入图片
static void Main(string[] args) {XlsWithObjData();Console.WriteLine("输出完成"); }static void XlsWithObjData() {// 创建工作簿和单元格,只有HSSFWorkbook,XSSFWorkbook不可以HSSFWorkbook workbook new HSSFWorkbook();HSSFSheet sheet (HSSFSheet)workboo…...
stm32wle5 lpuart DMA数据不接收
配置波特率9600时，需要使用外部低速晶振...
QT开发技术【ffmpeg + QAudioOutput】音乐播放器
一、 介绍 使用ffmpeg 4.2.2 在数字化浪潮席卷全球的当下，音视频内容犹如璀璨繁星，点亮了人们的生活与工作。从短视频平台上令人捧腹的搞笑视频，到在线课堂中知识渊博的专家授课，再到影视平台上扣人心弦的高清大片，音…...
验证redis数据结构
一、功能验证 1.验证redis的数据结构（如字符串、列表、哈希、集合、有序集合等）是否按照预期工作。 2、常见的数据结构验证方法： ①字符串（string） 测试基本操作 set、get、incr、decr 验证字符串的长度和内容是否正…...
GeoServer发布PostgreSQL图层后WFS查询无主键字段
在使用 GeoServer（版本 2.22.2） 发布 PostgreSQL（PostGIS）中的表为地图服务时，常常会遇到一个小问题： WFS 查询中，主键字段（如 id）莫名其妙地消失了！ 即使你在…...
AWS vs 阿里云：功能、服务与性能对比指南
在云计算领域，Amazon Web Services (AWS) 和阿里云 (Alibaba Cloud) 是全球领先的提供商，各自在功能范围、服务生态系统、性能表现和适用场景上具有独特优势。基于提供的引用[1]-[5]，我将从功能、服务和性能三个方面进行结构化对比分析&#…...