# 未来鸟FutureBird 开发者工具箱（单机单页版）

**Repository Path**: futurebird/DevTools

## Basic Information

- **Project Name**: 未来鸟FutureBird 开发者工具箱（单机单页版）
- **Description**: 未来鸟FutureBird 开发者工具箱（单机单页版） ，虽然只有一个Html单页，可以本地运行，但他比你想想的更加强大，默认使用浏览器的 **localStorage** 进行数据储存，也可以使用MySQL，集成了自定义网址导航，快捷命令和提示词，快速复制，内嵌页工作台页面，数据管理，定时刷新，自动备份，布局设置，双语设置等上百个开发工作台功能，会让工作开发的时候更快捷更高效可不联网
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2026-05-25
- **Last Updated**: 2026-07-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 这个是一个神奇且强大的单页工具箱

# 🛠 未来鸟FutureBird 开发工具箱

一个单文件、零依赖的浏览器工作台，集成常用开发工具、快捷导航和命令面板，帮助开发者在一个页面内高效完成日常工作。

## 💡 为什么需要这个工具？

日常开发中经常需要在多个工具页面之间切换——文档、看板、监控面板、API 调试工具……浏览器标签页越开越多。未来鸟开发工具箱通过**统一工作台**的方式，将所有常用页面和工具集中管理，配合自定义导航、命令面板、快捷复制等功能，大幅减少切换成本。

## ✨ 功能特性

### 🎨 主题系统
- **9 种预设主题**：紫罗兰、海洋蓝、森林绿、日落橙、玫瑰红、深空灰、极简白、暗夜黑、咖啡棕
- **自动轮换模式**：每次刷新页面随机切换主题，每天都有新鲜感
- **支持浅色/深色**：覆盖亮色系和暗色系两种视觉偏好

### 🧭 导航系统
- **三级导航**：顶部导航栏、侧边导航栏、底部快捷栏，自由控制显示/隐藏
- **自定义分类和站点**：支持任意分类层级，每个分类可配置多个站点链接
- **40 种分类颜色**：浅色系和深色系各 20 种，用颜色区分不同分类
- **行列布局**：侧边栏支持多行多列排列，高效利用屏幕空间

### ⚡ 命令面板
- **Ctrl+K 快速呼出**：类 VS Code 体验，键盘党的最爱
- **模糊搜索**：输入关键字即时筛选所有菜单和功能项
- **回车直达**：选中后一键打开目标页面或执行操作

### 📋 快捷复制
- **自定义文本模板**：预设常用文本片段（API 地址、Git 命令、常用回复等）
- **一键复制**：点击底部按钮或通过命令面板，一键复制到剪贴板
- **排序管理**：自由调整复制内容的显示顺序

### 🔗 链接管理
- **开发文档直达**：API 文档、框架文档、内部 Wiki 等统一收纳
- **项目地址收藏**：Git 仓库、线上地址、JIRA 看板等集中访问
- **一键跳转**：点击即在新标签页打开，或嵌入工作台内查看

### 🖼 页面嵌入
- **iframe 内嵌模式**：将监控面板、看板、数据大屏嵌入工作台中
- **自定义嵌入 URL**：支持配置多个嵌入页面
- **大小可调**：嵌入区域高度可自定义

### ⏱ 工作统计
- **实时在线计时**：从打开工作台开始自动计时
- **每日会话记录**：自动记录每次工作会话的起止时间和时长
- **历史统计查看**：在设置面板中查看历史工作时间记录
- **跨刷新持久化**：基于 localStorage，刷新页面不影响计时

### 🔄 定时刷新
- **可配置刷新间隔**：为嵌入的监控页面设置自动刷新频率
- **倒计时显示**：状态栏实时显示下次刷新倒计时
- **跨域兼容**：通过 src 重置方式解决跨域刷新限制

### 💾 数据备份
- **自动备份**：定时将配置自动备份，防止数据丢失
- **手动备份**：支持一键手动创建备份快照
- **多存储位置**：localStorage、IndexedDB 或本地文件三种备份方式可选
- **备份管理**：查看备份历史、恢复指定备份、删除过期备份、批量导出

### 🎛 布局设置
- **顶栏高度可调**：适应不同分辨率和视觉偏好
- **底栏高度可调**：灵活控制底部操作区大小
- **全局字体缩放**：统一调整界面字号

### 🌍 多语言
- **简体中文**：默认界面语言
- **English**：一键切换到英文界面
- **可扩展架构**：预留了多语言配置接口

### 📦 零依赖
- **纯原生实现**：HTML + CSS + JavaScript，无任何第三方库
- **单文件架构**：所有功能内联在一个 HTML 文件中，约 390 KB
- **双击即用**：无需安装 Node.js、npm，不需要构建、不需要打包
- **完全离线**：不依赖任何 CDN 或在线服务

## 🚀 快速开始

### 方式一：直接打开（推荐）
1. 下载 `工作台.html`
2. 双击在浏览器中打开
3. 开始使用！

### 方式二：本地服务器
```bash
# Python 3
python -m http.server 8080

# Node.js (需要安装 http-server)
npx http-server -p 8080
```
然后用浏览器访问 `http://localhost:8080/工作台.html`

### 方式三：部署到服务器
将 `工作台.html` 放到 Nginx / Apache / Caddy 的静态文件目录即可。

> 详细部署方案请查看 [部署指南](https://gitee.com/futurebird/DevTools/wiki/部署指南)

## 🏗 技术架构

```
工作台.html  (单文件应用 ~390KB)
├── HTML 结构层 — 导航栏、内容区、设置面板、命令面板等 DOM 结构
├── CSS 样式层   — 9 种主题变量、响应式布局、动画过渡
└── JavaScript 逻辑层
    ├── 配置管理    — localStorage 持久化，默认配置 + 用户自定义
    ├── 导航系统    — 分类/站点 增删改查、行列布局渲染
    ├── 主题引擎    — 主题切换、自动轮换、CSS 变量注入
    ├── 命令面板    — 模糊搜索、快捷键绑定
    ├── 嵌入框架    — iframe 动态管理、定时刷新调度
    ├── 数据备份    — localStorage / IndexedDB 多存储后端
    ├── 时间统计    — 会话记录、工时计算、历史查询
    ├── 剪贴板工具  — 自定义模板、Clipboard API
    └── 国际化      — 多语言配置、动态翻译
```

## 🌐 浏览器兼容

| Chrome | Edge | Firefox | Safari |
|:------:|:----:|:-------:|:------:|
| ✅ 90+ | ✅ 90+ | ✅ 88+ | ✅ 14+ |

> 推荐使用 Chromium 内核浏览器以获得最佳体验（IndexedDB 备份等功能需较新浏览器）。
## 界面预览
### 默认工作台
![输入图片说明](img%E9%BB%98%E8%AE%A4%E5%B7%A5%E4%BD%9C%E5%8F%B0.png)
### 自定义侧边网址导航设置
![输入图片说明](img%E5%AF%BC%E8%88%AA1.png)
![输入图片说明](img%E5%AF%BC%E8%88%AA%E4%BA%8C.png)

### 网址分类和网址管理
![输入图片说明](img%E5%88%86%E7%B1%BB%E4%B8%89.png)
### 自定义快捷命令
![输入图片说明](img%E8%87%AA%E5%AE%9A%E4%B9%89%E5%BF%AB%E6%8D%B7%E5%91%BD%E4%BB%A4.png)
### 系统设置
![输入图片说明](img%E8%AE%BE%E7%BD%AE1.png)
### 项目链接嵌入页，以及顶部自定义菜单设置
![输入图片说明](img%E8%AE%BE%E7%BD%AE%E4%BA%8C.png)
### 自定义服务和数据管理，工作时间统计，定时刷新设置
![输入图片说明](img%E8%AE%BE%E7%BD%AE%E4%B8%89.png)
### 自动备份设置，布局和语言设置
![输入图片说明](img%E8%AE%BE%E7%BD%AE4.png)
### 更多功能
自己下载部署测试吧

## 📖 文档导航

完整文档请查看 [Gitee Wiki](https://gitee.com/futurebird/DevTools/wiki)：

| 文档 | 说明 |
|------|------|
| [快速开始](https://gitee.com/futurebird/DevTools/wiki/快速开始) | 5 分钟上手教程 |
| [功能介绍](https://gitee.com/futurebird/DevTools/wiki/功能介绍) | 所有功能的详细说明 |
| [使用手册](https://gitee.com/futurebird/DevTools/wiki/使用手册) | 操作步骤和最佳实践 |
| [部署指南](https://gitee.com/futurebird/DevTools/wiki/部署指南) | 多种部署方式详解 |
| [更新日志](https://gitee.com/futurebird/DevTools/wiki/更新日志) | 版本更新记录 |
| [常见问题](https://gitee.com/futurebird/DevTools/wiki/常见问题) | FAQ 常见问题解答 |

## 📄 License

MIT © 未来鸟