DeepSite，堪称浏览器中的 Cursor！

文章目录

一、介绍

二、演示

1）提示词：写一个小蜜蜂的游戏

2）提示词：写一个烟花特效

3）提示词：爬取漫画网站上指定页码的漫画

4）提示词：写一个类似微信聊天的app

三、部署

1. 登入官网，需要科学上网

 2. 本地部署

1)克隆GitHub镜像地址

2)修改llm配置

3)npm安装和构建安装：

4)启动服务 最后npm start启动就行了：

四、结语

---

一、介绍

刚刚试了部署在 Hugging Face（一个开源社区） 上的一个神器 DeepSite，堪称浏览器的 cursor ，稍微有点惊叹。

DeepSite 是集成了最新的 DeepSeek V3 的开发工具，使用这个工具你不需要配置环境、安装，只需要打开一个网页，输入你想要开发的游戏或者应用，等着预览运行就好了。

二、演示

话不多说，来看看实机演示：

1）提示词：写一个小蜜蜂的游戏

2）提示词：写一个烟花特效

3）提示词：爬取漫画网站上指定页码的漫画

生成的代码：结构非常清晰！！

import os
import requests
from bs4 import BeautifulSoup
import time
import json


def download_xkcd_comics(start_comic=1, end_comic=None, save_dir='xkcd_comics'):
    """
    下载XKCD漫画

    参数:
        start_comic (int): 开始下载的漫画编号(默认为1)
        end_comic (int): 结束下载的漫画编号(默认为最新漫画)
        save_dir (str): 保存漫画的目录(默认为'xkcd_comics')
    """
    # 创建保存目录
    os.makedirs(save_dir, exist_ok=True)

    # 元数据列表
    metadata = []

    # 获取最新漫画编号
    if end_comic is None:
        response = requests.get('https://xkcd.com/')
        response.raise_for_status()
        soup = BeautifulSoup(response.text, 'html.parser')
        end_comic = int(soup.select_one('a[rel="prev"]')['href'].strip('/'))

    # 遍历所有漫画
    for comic_num in range(start_comic, end_comic + 1):
        try:
            print(f"正在下载漫画 #{comic_num}...")

            # 构建URL
            if comic_num == 404:
                print("跳过404页面(特殊页面)")
                continue

            url = f'https://xkcd.com/{comic_num}/'

            # 获取页面内容
            response = requests.get(url)
            response.raise_for_status()

            # 解析HTML
            soup = BeautifulSoup(response.text, 'html.parser')

            # 提取漫画信息
            comic_elem = soup.select_one('#comic img')
            if not comic_elem:
                print(f"漫画 #{comic_num} 没有图片元素，跳过")
                continue

            comic_url = 'https:' + comic_elem['src']
            comic_title = comic_elem['alt']
            comic_alt = comic_elem['title']

            # 下载图片
            img_response = requests.get(comic_url)
            img_response.raise_for_status()

            # 保存图片
            _, ext = os.path.splitext(comic_url)
            filename = f"xkcd_{comic_num}{ext}"
            filepath = os.path.join(save_dir, filename)

            with open(filepath, 'wb') as f:
                f.write(img_response.content)

            # 保存元数据
            metadata.append({
                'number': comic_num,
                'title': comic_title,
                'alt_text': comic_alt,
                'url': comic_url,
                'file': filename
            })

            print(f"成功下载漫画 #{comic_num}: {comic_title}")

            # 保存元数据到JSON文件
            with open(os.path.join(save_dir, 'metadata.json'), 'w') as f:
                json.dump(metadata, f, indent=2)

            # 礼貌爬取，避免被封
            time.sleep(1)

        except Exception as e:
            print(f"下载漫画 #{comic_num} 时出错: {e}")
            continue


if __name__ == '__main__':
    # 示例: 下载最新的10个漫画
    download_xkcd_comics(end_comic=10)

    # 要下载所有漫画，可以这样调用:
    # download_xkcd_comics()

放入python解释器中，可以完美运行：

4）提示词：写一个类似微信聊天的app

(图片没有显示，是因为没有对应的图片资源)

三、部署

1. 登入官网，需要科学上网

官方网址：https://huggingface.co/spaces/enzostvs/deepsite

 2. 本地部署

1)克隆GitHub镜像地址

git clone https://github.com/skywalk163/deepsite

2)修改llm配置

修改server.js文件里从262句开始的base_url、key和模型名字，参考：

const openai = new OpenAI({
  baseURL: 'http://192.168.1.5:1337/v1',
  apiKey: 'your-api-key', // 如果需要认证
});
 
async function chatCompletionStream(prompt) {
  const stream = await openai.chat.completions.create({
    model: 'deepseek-v3', // 你的模型名称
    messages: [{ role: 'user', content: prompt }],
    stream: true,
  });

3)npm安装和构建
安装：

npm install

如果速度慢，就加上镜像

npm config set registry https://registry.npmmirror.com

再执行一下build：

 npm run build

4)启动服务 
最后npm start启动就行了：

 npm start

服务启动，访问端口是3000，用浏览器打开3000端口的web网页即可。

四、结语

整体来说，一句话看着 AI 帮你干活还是挺爽的，一般看着左边的代码一行行的生成，右边预览区域逐渐变成一个像样的东西。

Deepsite  确实有点东西，编程能力还是取决于背后的模型的能力，这个开源项目只是做了一种边开发边预览的工程化实现。