likes
comments
collection
share

切图仔的第一个全栈项目,极简书签导航

作者站长头像
站长
· 阅读数 4

背景

产品介绍

登录系统后,内置了「文档/论坛」、「工具」两个初始书签栏。点击有右下角「加号」按钮,即可新增书签栏。鼠标浮动到书签栏名字右方,有操作项下拉菜单,可以完成书签栏编辑,删除操作。点击具体的书签,即可跳转到具体的页面。每个书签栏中可以新增单个网页书签,也可以新增一个组,再添加若干相关书签,大家可以自行体验下,操作起来还是很方便的,如果有好的想法或者交互,也可以告诉我哈。

技术栈

前端层面主要采用了Vue3官方脚手架、并且配合Antd Design Vue,TailwindCSS。 服务端采用Nest完成HTTP接口逻辑,配合TypeORM、Mysql、Redis完成数据持久化存储。 本项目部署在腾讯云服务器上,并且采用Docker,Docker-Compose完成整体流程。为了加速前端静态资源访问速度,将打包后的静态资源上传至腾讯云COS中,并且采用CDN进行访问加速。

切图仔的第一个全栈项目,极简书签导航

页面展示

登录页

切图仔的第一个全栈项目,极简书签导航

注册页 切图仔的第一个全栈项目,极简书签导航

引导页 切图仔的第一个全栈项目,极简书签导航

书签编辑 切图仔的第一个全栈项目,极简书签导航

暗黑模式

切图仔的第一个全栈项目,极简书签导航

项目地址

前端仓库:github.com/honorsuper/… 服务端仓库:github.com/honorsuper/… 本地启动服务端项目时,本地需要先确保启动Mysql、Redis服务,并且创建好对应的库,最好还需要配置好对应的环境变量参数。具体细节可以参考项目README。

结尾