ZeeStart：使用 Tailwind CSS + Vue 制作的个人导航页， HTML 纯文本单文件，支持自定义数据和离线部署

[xinzhi]

hello 大家好，很久没做东西了。下面这个是小页面是周末弄的，当时随时发了 Twitter 有极少数人希望能获得代码（点赞的多一点），我整理一下发出来。

使用 Chrome 上的新标签页扩展 Minimo 很多年了，因为 Chrome 有很好的扩展和数据同步功能，虽然不怎么好用也一直坚持用着。

Minimo 仅支持 Chronme 浏览器中使用，我主力浏览器是 Safari ，还有在车机里使用浏览器的需求（主要是看 YouTube ），就做了这个导航页面，基本复刻了 Minimo 80% 的功能。

之前没有使用过 Tailwind CSS ，也没接触过 VueJS ，这是边做边摸索搞的，代码质量肯定不咋滴。但本身功能也简单，应该使用上没啥问题吧。

随便看看吧～ 有需求的在下面自取。

页面截图：

一些特点：

• 比较简洁；

• 支持静置自动显示大时钟；

• 支持多标签分类；

• 自适应屏幕分辨率；

• 可视化添加导航数据；

• 内建本地自动存储的记事本；

• 支持数量庞大的 Font Awesome 免费图标；

• 可设置当前页面、新标签页打开链接、设置各处链接可见；

• 支持特斯拉车机全屏幕，并可在全屏幕下使用自定义网址跳转；

• 可本地无需运行环境部署，适配 CloudFlare Tunnel 远程访问；

• 可通过 Tailwind Playground 进行更多个性化细节设计调整；

• 无链接跟踪，没有统计代码。

线上 Demo 、代码下载和使用支持：

https://xinzhixiang.gumroad.com/l/zeestart

[heliushao88]

需要购买才能使用么？也不知道如何下载

[xinzhi]

@heliushao88 价格是随意的，可以输入 0 然后结算即可，结算后可以查看 Demo 和下载。

[arnosolo]

index.html: "我承受了这个年纪不该承受的压力😂"
这让我想起我第一个 js 项目 https://github.com/arnosolo/oversimplified_gravity_simulator/blob/master/sketch.js

[xinzhi]

@arnosolo 看着就像我写的一样呢。我去找过类似的应用，目前还行的就 Flare 这个，可是即便支持 Docker 部署也还是麻烦，之前用过一段时间后来丢弃了，感觉还是 index.html 开箱即用最简便。然后也趁着这个机会尝试一下 Tailwind CSS ，出来引入的模块，完全不用单独写 CSS 了，匹配单文件的形式。

[heliushao88]

您怎么不弄成 chrome 的 crx 插件形式呢？

[xinzhi]

@heliushao88 还没试过做插件。我就是不怎么用 Chrome 才做这个的，Chrome 暂时还用 Arc 替代了。