使用Vue、React和Koa开发个人博客

前言

实习了大半年,又临近毕业,一直想做一个属于自己的博客。于是就用Vue、React和Koa开发了一个服务端渲染的博客系统。其中:
- 后端管理使用Vue开发
- 前端页面使用React服务端渲染框架nextjs
- 接口服务使用Koa2 + mongodb + mongoose(使用nodemailer当接口发生500时向我发送邮件通知)

项目地址是点我访问项目地址,(不要脸地求star)。为了方便体验(小弟不才,大佬们轻虐),可以点击访问后端管理系统,在注册用户后,即可登录体验,同时也可以发布文章,然后在前端页面就可以看到发布的文章。(目前(2018-02-28)未备案,就简单通过ip访问即可)

效果预览

1 后端管理页面

后端管理页面使用了vue、vuex、sass以及axios,其中模仿ElementUI的样式开发了dialogloadingconfirmnotoficationmessgae等等组件,(感觉自己对vue组件的开发姿势又稍微深入了一点点,毕竟学无止境)。以下为部分页面截图:

  • 登录
     登录预览

  • 个人中心
     个人中心

  • 文章管理
     文章管理

  • 新建文章
     新建文章

  • ECharts结合
     Echart

2 前端页面渲染

借此机会想学习一下React,于是前端页面使用了React服务端渲染框架nextjs,并使用了Reduxaxios以及koa(自定义服务所用)。前端页面目前比较简单,主要就是文章的读取和渲染。以下为截图:

  • 首页
     前端首页

  • 文章详情
     文章详情

结束语

这一次开发个人博客,学习了很多,像是Vue组件开发文件上传上传到七牛云以及reactredux的使用,再到使用koa2mongodb写接口,然后再到pm2守护进程和配置nginx等等。总之,学习到了很多,接下来我会整理思路,把这些总结总结分享出来,欢迎指正批评。
Github地址是这个elpase,求start,嘻嘻…

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值