百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

DeepSeek最新玩法,5分钟搭建html实用工具

myzbx 2025-05-15 20:01 26 浏览

大家好,我是程序员小灰。

说起AI编程,早已不是一个新鲜的概念。

早在2023年初,小灰就曾经尝试利用GPT-4帮我生成Python小游戏的代码。

到了2024年,随着Cursor等AI编程工具的兴起,AI编程越来越流行。许多人甚至利用AI开发出了商业化的应用,赚取了第一桶金。

不过,对于并不熟悉编程的普通人而言,AI编程却普遍存在一个绕不过去的问题:繁琐的配置问题。

我们虽然可以用AI模型帮我们快速生成代码,却无法直接执行这段代码,必须在本地安装自己的IDE,配置环境变量,创建项目和文件,再把代码粘贴到本地,执行代码。

Cursor这样的工具虽然解决了代码复制粘贴的问题,但环境配置的问题仍然难以快速解决,从而劝退绝大多数想要尝试AI编程的普通人。

怎么解决这个问题呢?我们可以尝试让AI模型直接为我们生成html代码。

目前为止,DeepSeek-V3、Claude 3.5等AI模型都支持在对话页面直接执行html代码,非常适合小白上手AI编程。

虽然这种方式无法构建复杂的应用,但是制作一些小工具、小游戏却是绰绰有余的。

今天小灰来演示两个例子,让我们看看如何用DeepSeek快速生成开箱即用的html项目。

例子1:生成“吃豆人”游戏代码

“吃豆人”是一款非常古老的游戏,可以追溯到上世纪80年代的。

我们让DeepSeek也复刻一款吃豆人游戏。提示词非常简单,只需要一句话即可:

生成吃豆人游戏的代码,用html实现。

经过了大约5分钟时间,DeepSeek回复了完整的HTML代码,由于代码太长,我们就不全部展示了:

在代码的末尾,我们可以直接点击右下角的执行按钮来运行这段html代码:

运行效果如下:

尽管游戏中有些小bug,但整体上已经很不错了。

我们不仅可以再DeepSeek页面上执行,也可以把代码保存在本地执行,只要把代码粘贴到本地文本文件当中,再把文件扩展名改为.html即可。

例子2:生成数据结构与算法的可视化演示工具

对于新人程序员来说,数据结构与算法的学习是一个分水岭,许多人觉得算法非常抽象难懂。

这时候,如果有一个可视化的工具,可以把复杂的算法工作原理用可视化的方式生动展示给大家,一定会对广大新人程序员有所帮助。

因此,我们可以让DeepSeek制作一系列数据结构与算法的可视化演示工具,其中的每一个小工具可以独立演示一种算法或数据结构。

算法与数据结构的种类非常多,我们这里尝试生成两个小工具,一个是选择排序算法的演示工具,一个是二叉查找树的演示工具。

其中选择排序算法演示工具的提示词如下:

用技术动画的形式演示选择排序的原理,以html格式输出。

直接在DeepSeek页面执行项目,效果如下:

在这个可视化演示工具当中,支持随机生成新数组,自动演示排序过程,还支持一步一步手动操作演示进程,非常方便直观。

我们再来看一看二叉查找树的演示工具,提示词如下:

用技术动画的形式演示二叉查找树的原理,以html格式输出。

直接在DeepSeek页面执行项目,效果如下:

在本工具当中,用户可以一个一个节点来构建自己想要的二叉查找树,每次插入新的节点都会详细展示插入过程,而且还可以演示二叉树的前序、中序、后序遍历过程,非常灵活。

好了,关于如何利用DeepSeek快速搭建html项目、制作开箱即用的游戏和工具,我们就介绍到这里。

欢迎大家多多尝试DeepSeek这款优秀的国产大模型,挖掘出更多有趣又有用的玩法。

相关推荐

C语言备忘录 - 09. 数组与字符串(c语言数组字符串长度)

C语言支持数组数据结构,它可以存储一个固定大小的相同类型元素的顺序集合。数组都是由连续的内存位置组成。最低的地址对应第一个元素,最高的地址对应最后一个元素。一、数组定义/*定义一个一维数组数...

Java 读取 xml 文件的五种方式(java读取xml工具类)

1、Java读取xml文件的五种方式在Java中读取XML文件有多种方法,这里列出五种常见的方式:DOM解析器(DocumentObjectModel):DOM是处理XML文...

如何获取一个APP的所有接口API和参数签名信息?

先给出所需的工具:步骤工具/技术抓包Charles、Fiddler、Wireshark、tcpdump反编译Jadx、JEB、Apktool动态调试Frida、IDAPro、Unidbg/Unico...

编辑距离算法详解:Levenshtein Distance算法

算法基本原理:假设我们可以使用d[i,j]个步骤(可以使用一个二维数组保存这个值),表示将串s[1…i]转换为串t[1…j]所需要的最少步骤个数,那么,在最基本的情况下,即在i等...

RTCP协议详解(SR、RR、SDES、BYE、APP、NACK、TCC、PLI、SLI)

RTCP协议规范中定义了五种类型的RTCP包:接收方报告(RR)、发送方报告(SR)、源描述(SDES)、成员管理(BYE)和应用程序定义(APP)。SR:payload...

javascript实现获取中文汉字拼音首字母

今天分享一个日常开发中可能会用到的一个小功能,简单说就是输入中文汉字可转换得到中文汉字拼音首字母。当然我可写不出这样的功能,源码来自于其他民间大神的分享,博主在此记录一下功能demo,方便日后复用,同...

记一次前端逻辑绕过登录到内网挖掘

前言在测试一个学校网站的时候发现一个未授权访问内网系统,但是这个未授权并不是接口啥的,而是对前端js的审计和调试发现的漏洞,这里给大家分享一下这次的漏洞的过程文章中涉及的敏感信息均已做打码处理,文...

Node.js 是怎么找到模块的?(node.js有哪些模块)

大家好,我是前端西瓜哥,今天我们来看看Node.js模块查找的原理。模块种类模块有三种来源。核心模块:Node.js内置的包。比如http、fs、path;自定义模块:NPM包。比如axi...

细节确定成败!全网最详细的xxs夸脚本攻击以及测试方法(上)

XSS全称是CrossSiteScripting也是跨站脚本,他也分为三种类型存储型,反射型,DOM型。当目标网站目标用户浏览器渲染HTML文档的过程中,出现了不被预期的脚本指令并执行时,XSS就...

简单易懂的KMP字符串匹配算法(实现kmp字符串匹配)

什么是KMPKMP算法是Knuth、Morris和Pratt三人设计的线性时间字符串匹配算法。算法的核心思想是尽可能地利用已知信息,减少尝试匹配的次数,从而降低时间复杂度。要想彻底地弄懂KMP算法,需...

golang标准库每日一库之strings(golang 字符串操作)

以下为Go语言strings包的深度解析,涵盖字符串切割、替换、查找等核心操作及高效处理技巧:一、基础字符串操作1.字符串切割(Split)函数作用描述示例strings.Split(s,s...

开源轻量级BT下载器qBittorrent 5.1.1发布:改进Wayland会话

IT之家6月24日消息,科技媒体9to5Linux昨日(6月23日)发布博文,报道称开源轻量级BT下载器qBittorrent发布5.1.1版本更新,主要改进支持Lin...

晨雾轻散时!2 道 JS 面试题细解,静享知识慢时光

清晨的雾气渐渐散去,阳光透过纱窗洒在桌前,泡一杯温热的蜂蜜水,让我们在这宁静的氛围里,以轻松的节奏聊聊两道JavaScript高频面试题。就像在晨光中散步,不急不躁地探索知识,让学习成为一种治愈的...

JS 写正则表达式,判断是否为手机号

以下是使用JavaScript写正则表达式,判断一个字符串是否为手机号的示例代码:在上述代码中,我们定义了一个isPhoneNumber函数,该函数接收一个字符串作为参数,使用正则表达式判断该...

不用任何 js 库,纯前端导出数据到 Excel / CSV 文件就简单几行代码

最近实现的导出数据为表格的需求,不需要工具库,也不要后端实现,mark一下。js导出excel表格最近工作中又遇到了将表格数据导出为excel表格的需求,我第一时间想到的是之前我的网站上推...