vue个人博客项目部署上线

lanffy 发布于2019-06-26 17:15 / 3314人阅读

摘要：前言之前有发过这个项目的文章了，根据朋友的建议改变了博客的样式，也增加了一些新功能，下面完整地介绍这个博客项目。

前言

之前有发过这个项目的文章了，根据朋友的建议改变了博客的样式，也增加了一些新功能，下面完整地介绍这个博客项目。文末附前端实习求职简历

项目简介

简要介绍：一个前后端分离的项目
主要技术栈：vue全家桶 + node.js + Express + Mongodb
github地址： vue博客内容管理系统
项目线上地址： FatDong的博客 --- www.xuhaodong.cn

实现功能 文章

文章通过标签分类

存为草稿，草稿和文章可以随时切换

文章目录，与segmentfault生成的目录效果相似

最近更新，首页展示最近更新的三篇文章

搜索文章，输入标题的部分内容即可搜索相应文章

过滤评论，太长、太短、含QQ群号的评论将无法发布

邮件通知，如果有人回复评论，会通过nodemailer来发送通知邮件

头像功能，访问者和站长分别用不同的头像来区分

点赞功能，点赞情况记录在浏览器的localStorage里，下次访问会还原点赞情况

防止重名，同一篇文章中不会出现评论者重名的情况，当然同一个人可以多次评论

排序评论，排序依据：最新、最早、最热

用localStorage记录邮箱和昵称，下次访问不用重新输入

markdown编辑器(marked)

过滤标签

去除首尾空格

输入相同的标签将弹出模态框警告并自动删除，使用数据驱动视图更新的思想将所有标签放在一个数组，添加和删除标签都是对数组进行操作

自定义快捷键

切换预览模式

代码高亮显示，使用hightlight.js进行代码高亮显示

提醒保存，没有保存就离开页面前会弹出模态框确认

账户

权限验证

前台使用vue-router的beforeEach进行验证

后台使用jwt实现基于token的身份验证

修改账号和密码

密码加密，使用sha1加密算法，用csprng生成的随机盐

页面特效

canvas粒子效果（移动端取消）

鼠标追随粒子效果

单击取消展示粒子效果，重新点击随机切换粒子效果的颜色

鼠标离开页面后，粒子效果开始规则运动

平滑回到顶部

点击文章段落标题，平滑滚动到锚点

向下滚动时，动态展示dom节点

底部自动加载loading

网站顶部图片改变景深

其他功能

适配移动端。使用flex布局、rem以及百分比布局去适配移动端，实现响应式布局

下面是移动端的演示

网站部署

添加SSL证书，使用更为安全的https协议

使用nginx进行反向代理

服务器使用linux系统，学习了一些linux的知识

收获

更加了解一个项目从前端到后端的流程，可以更好地和后端人员对接

可以加深对webpack、Vue、vuex、vue-router、vue-resource的使用

最后

最近在找前端暑假实习，这是我的在线简历 --- job.xuhaodong.cn，谢谢?

本文已同步到我的博客www.xuhaodong.cn

云服务器专线服务 java项目如何部署上线腾讯云服务器部署vue项目个人购买云服务器到部署项目云服务器博客上线

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/19002.html

vue个人博客项目部署上线

摘要：前言之前有发过这个项目的文章了，根据朋友的建议改变了博客的样式，也增加了一些新功能，下面完整地介绍这个博客项目。前言之前有发过这个项目的文章了，根据朋友的建议改变了博客的样式，也增加了一些新功能，下面完整地介绍这个博客项目。文末附前端实习求职简历项目简介简要介绍：一个前后端分离的项目主要技术栈：vue全家桶 + node.js + Express + Mongodbgithub...

caspar 2019-08-20 16:32 评论0 收藏0
让敲过的每行代码产生价值

摘要：采用快速掌握核心知识解决实际问题中补充的方式。让每一行代码都能给自己带来价值，才是每个码农应该有的思维，而不是成为一个职业码农。不过做个人博客有一个重要的价值便是在你做成之后可以部署上线让它成为自己在互联网的基地。勤学似春起之苗，不见其增，而日有所长如果你一直想学python，但是不知道从何入手，那么就不要犹豫了。这篇文章就是我的python新实战计划可能适合你。学习 Pytho...

OnlyMyRailgun 2019-07-31 10:05 评论0 收藏0
vue+koa+mongodb 个人博客

摘要：搭建个人博客很久以来就特别想搭建一个，但是都是由于技术原因没有搭建起来。学习，并对代码进行重构。因为整个博客要完整的从项目构建到项目上线的确比较繁琐，这里只是给想要试试与一个代码参考。 vue+koa+mongodb 搭建个人博客很久以来就特别想搭建一个blog，但是都是由于技术原因没有搭建起来。以前学习github的时候准备采用github与hexo来搭建。但是后来想了一下自己也在...

ivan_qhz 2019-06-26 17:49 评论0 收藏0
分享一下我的 vue + koa + mysql 搭建博客之旅

摘要：最后感谢各位的观看如果有什么意见或者建议的话还望多多指教感谢如果感觉我的博客还过得去的话还请给个鼓励一下作者嘿嘿。一直以来都想用自己的技术做一些个人项目, 之前的博客是基于 hexo 搭建, 感觉啥都是别人帮你写好了, 于是便决定自己搞一个, 断断续续地弄了一段时间, 也总算是完成了个简单版本并部署上线. 博客线上地址博客地址：cykspace 博客后台：cykspace-node...

cnTomato 2019-08-22 17:19 评论0 收藏0