包阅导读总结
1. 浏览器仪表盘、Pintree、收藏夹管理、ChatGPT、开源
2. 作者逛 v2ex 发现 Pintree 项目后，决定基于自身浏览器使用痛点做新起始页。在 ChatGPT 帮助下一天完成，实现了收藏夹数据驱动导航等功能，现开源求 Star 并会持续维护。
3.
– 作者发现 Pintree 项目，可将收藏网站变成导航
– 原理是安装扩展，导出 json 文件，本地部署源代码并替换
– 作者基于自身需求做新起始页
– 如解决手欠关网站再找麻烦、多 Tab 切换不便等问题
– 新起始页产品特点
– 浏览器扩展，由收藏夹数据驱动导航，附带最近访问网站和当前 Tab 栏
– 处理用户开两个同样浏览器窗口切换的特殊情况
– 开发过程
– 让 ChatGPT 生成 demo 并调教
– 作者写前端模板，让 ChatGPT 补充逻辑完成最终版
– 成果及后续
– 一天完成，开源求 Star ，持续维护，有更多功能待实现
4.
思维导图：
文章地址：https://juejin.cn/post/7395387245312163903
文章来源：juejin.cn
作者：独立开发者Pony
发布时间：2024/7/25 12:43
语言：中文
总字数：1037字
预计阅读时间：5分钟
评分：88分
标签：浏览器扩展,开源项目,ChatGPT 应用,前端开发,导航页
以下为原文内容
本内容来源于用户推荐转载，旨在分享知识与观点，如有侵权请联系删除 联系邮箱 media@ilingban.com
前几天逛 v2ex 的时候发现了这么一个项目，Pintree，这个项目可以将收藏的网站变成一个导航。
原理是安装它的浏览器扩展**，导出json文件，自己本地部署一套它的导航站源代码，替换 json 文件就可以实现一个上图网站。
我觉得是一个不错的创意，但我立刻有了另一个想法，那就是做一个扩展起始页用来管理我的收藏夹。
但是我并不满足于此，因为我真的有很多浏览器原本没有满足的需求；
比如说我经常手欠随手关掉还能用到的网站，然后再想打开的时候去历史里找很麻烦；
再有就是打开太多 Tab 了每一个都被挤得很小，切换起来很不方便。
于是我准备基于以上需求做一个新起始页；
其实这并不是我第一次做起始页了，我的上一款起始页作品抓鱼鸭，一款专注摸鱼的起始页，这属于我的第二款起始页产品，这次我准备从浏览器使用中的真实痛点出发，去做一款真正解决问题的独立产品。
这款产品实现起来也相当简单，就是一个浏览器扩展，会把你的起始页变成由浏览器收藏夹数据驱动的导航；
在这个导航里还附带你最近访问的网站，以及当前浏览器打开的 Tab 栏。
其实这里边有个坑，那就是如果用户开了两个同样的浏览器窗口，去管理切换的时候需要特殊处理，这一款搞了好久才搞明白的。
好那么需求定了，说干就干；
虽然我曾经做过一次浏览器扩展，但其实我对扩展的 API 并不熟悉，我直接让ChatGPT**给我生成了一个 demo
好经过一系列的 Ai 调教，我成功生成了完整 demo 下图就是 ChatGPT 给我生成的代码运行之后的结果；
虽然 Ui 比较 low 但它五脏俱全，比我写的代码功能还要完善，当然我肯定不能拿这个去糊弄大家，我看了它给出的 demo 后验证需求可以实现，于是我就开始准备画页面。
我的思路是这样的；
ChatGPT 并不能按照我们脑子里想的写出好看的页面，但是它可以基于我们给出的模板去填充逻辑，我只需要写一个 html+css 的模板然后交给它补充逻辑就行了。
说干就干，很快一个前端模板就写完了，下边是初步效果。
然后我把前端模板丢给 GPT 让他自动为我补充逻辑就得出了最终完成版效果；
不得不说，有了 GPT 之后真的是太方便辣，这套东西在 GPT 的帮助下，早上刷 v2ex 有了想法，立刻执行，我只用了一天就完成了。
现在我把这套代码完整的开源出来，大家一块学习；
这个只是一个初代版本，还有很多想法没有实现，后续我会持续维护这套新标签页，作为浏览器仪表盘不会只有这点功能的，可以持续关注；
最后也求大家给我这个项目一个 Star 感谢感谢~
下面是直达链接：
为了防止链接被微信吞，如果都打不开的话，可以直接去这个地址下载：
备用地址：tag.zhuayuya.com/
Edge扩展商城：
microsoftedge.microsoft.com/addons/deta…
开源地址：
github.com/ponysb/TagP… （欢迎Star）
