使用vue 3 + vuex + vue-router + scss,用vite 2.0打包 ,并用firebase当做数据库,构造一个博客的响应式前端页面。
firebase 为谷歌提供的服务,需要代理才能正常使用
目前:已经实现注册登录,新增,预览,修改,删除博客,添加管理员等等功能。
TODO:
- 实现加载时的骨架屏
- 增加评论功能
未注册登录时,navigation栏会显示注册登录,且第一个大的banner提示注册登录。
之后还会显示2个具体的文章的大banner,点击可以查看,最后为博客卡片和页面底部信息。
由于使用firebase作为后端,因此已经实现注册登录,重置密码功能。
电脑端左侧会显示由用户昵称构成的头像;如果用户注册时申请为管理员,此时导航栏上会有还会新增发布文章功能。
第一个提示用户登录的大banner已经消失,取而代之的是博客。
单击用户头像,可以看到一个弹出的modal。
只有登录的用户是管理员,才有这个功能。
可以上传封面,预览封面和发布前预览文章。
如果用户是管理员,还可以在博客页面,修改和删除文章。
最后,fireblogs使用vue-router 实现了导航守卫,如果用户没有登录,是无法进入到需要权限的页面。