Vue.js+LeanCloud 单页面博客

之前看了好多关于 Vue.js 的东东，路由哇，状态管理呀，稀里糊涂的一堆东西，每个都相对独立，这些单独的 demo 和教程看起来觉得明白了，揉到一起不好说了就。。所以想结合起来写一写，作为一只前端汪怎么可以没有博客~

写的过程中有一些心得和踩坑，后续会整理出来~

如果觉得有帮助的话，谢谢帮忙 star ^_^

本项目github地址

简介

一个前后端完全分离的单页应用 线上地址点此查看

采用了之前写的 vue.js+LeanCloud（node.js） 的开发样板 github地址点此查看

线上动图如果不显示请点这里

version 0.1

1. 响应式布局

2. 主页，关于，标签

3. 过渡动画

4. 文章显示markdown 和代码高亮

TODO

1. 评论框

2. 触屏优化

技术栈

前端

1. Vue.js

2. vuex 状态管理

3. vue-router 路由

4. vue-resource xhr请求

5. marked 语法解析

6. prismjs 代码高亮

后端

1. node.js 服务端

2. express 框架

3. LeanCloud 数据存储

开发

git clone git@github.com:jiangjiu/vue-leancloud-blog.git
$ cd vue-leancloud-blog
$ npm install

// 启动服务器端, 默认地址 http://localhost:3000
$ lean up

// 另开一个 terminal
$ cd FE
$ npm install
// 启动前端项目，默认地址 http://localhost:8080
$ npm run dev

构建部署

// 在FE目录下 构建前端文件至 /public 文件夹
$ npm run build

// 根目录下 leancloud命令行部署 / 通过 github 部署
$ lean deploy / lean deploy -g

具体部署可参考LeanCloud云引擎 Node.js 部署

License

MIT

关键字：JavaScript, es6, vue.js, vuex

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！