You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

1.7 KiB

前端简易部署项目

项目背景

作为一个前端开发者,我是比较懒的存在,之前想要启动这个项目,但是感觉工作量挺大的。这个项目主要的作用,就是可以上传网页,然后观看网页,也可以查看该网页对应的文档。

项目技术栈

后端:koa3 前端:vue3 数据库:sqlite 包管理工具: pnpm

前端功能

配色大胆,用户操作体验优化,界面美观精致。

首页

首页主要的作用是展示与上传。

  1. 上传

需要登录才能上传,上传时,需要选择文件,然后选择标签,然后输入标题,描述,分类,附件,markdown文档(可以上传多个),包含网页的本地目录,然后点击上传。

  1. 展示

以网格布局展示上传过的网页,具体展示标题,描述,标签,分类。点击分类,标签可以筛选,也有输入框可以搜索标题。

具体网页

点击首页的网页后,进入具体网页,网页全部铺满浏览器,该网页采用沙盒模式展示,避免安全问题,提供一个悬浮按钮,点击后弹出抽屉,里面展示该王爷的具体信息,包括标题,描述,标签,分类,附件,以及文档,点击markdown文档抽屉关闭,显示markdown文档,点击附件可以下载

登录注册

可以进行登录注册

设置页面

超级管理员可以设置是否允许注册,可以设置是否可以上传网页。

后端功能

  1. 登录注册,第一个注册的为超级管理员
  2. 有权限的用户可以上传网页,严格控制上传功能
  3. 设置功能,可以设置是否允许注册,可以设置是否可以上传网页
  4. 注意接口安全