1. 前言
网上的工具箱有很多,为啥还要自己开发一个呢?
- 网上部分工具箱不是免费使用的,需要登录或者有各种限制;
- 很多工具需要把数据上传到服务器再进行处理,对于有些要注意数据安全的情况不太友好,想试试纯Javascript能达到什么程度;
- 更多是服务我自己吧,优先开发那些常用或者容易的。
- 这是独立开发的第三个应用了,当做练练手。
- 摸索下自由职业的道路。
由于要考虑SEO需要用到服务端渲染,也没有搭建后台程序的计划,于是直接用Nuxt.js来搭建。
经过一个多月以来,工作日的晚上以及周末的时间,一共开发了60+工具,实现了基础的功能。
1.1. 页面截图
首页:
工具列表:
工具详情:
暗黑模式:
2. 技术方案
没有后台系统
- 框架:Nuxt.js@3
- UI:ElementPlus
- Typescript + Vue@3
- 文件导出:file-saver、jszip
- 评论功能:waline
- 以及各种工具使用的npm包
3. 功能特性
安全:所有处理均在您浏览器的 JavaScript 中进行,数据不会离开您的电脑。
免费:没有后台程序和用户系统,所有工具免费试用,无需登录或关注公众号。
功能:
- 响应式界面
- 收藏:因为没有用户系统,所以基于浏览器存储,数据无法云端存储和同步。
- 评论和工具反馈
- 暗黑模式
- 文本工具
- 多媒体工具:图片,音视频的看浏览器执行效率如何
- 生活工具
- 数学工具:数字相关、单位换算
- 开发工具
- 编码转换
性能:
页面比较简单,默认的分包构建策略。开启HTTP/2+Gzip就可以达到一百昏。
4. 挖坑画饼
- 更多工具
- 给每个工具添加说明,实现方法
- 国际化
- 单元测试
- 快速复制粘贴
- 支持页面嵌入:根据URL参数去除外部容器,只保留工具核心部分,设置暗色模式、语言等
🤣 希望能坚持做下去吧,不要像之前开发的“浏览器首页”网站那样就存活了几个月~
参考的优秀产品,比如:
更适合开发者的:https://portal.he3app.com/home/category
更多工具的:https://www.67tool.com/
还没有评论,快来抢第一吧