<commit_before># vue-blog

> A single-user blog built with vue2, koa2 and mongodb which supports Server-Side Rendering

一个使用vue2、koa2、mongodb搭建的单用户博客，支持markdown编辑，文章标签分类，发布文章／撤回发布文章，支持服务端渲染（Server-Side Rendering）

<p align="center">
    <img src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-1.png" width="700px">
    <img src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-admin-22.png" width="700px">
    <img src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-2.png" width="700px">
    <br>
    访问链接:http://172.16.17.32:9000/
</p>

> 博客域名还没有配置，只展示前台部分，有兴趣的同学可以复制到浏览器地址栏访问，admin部分有兴趣的读者可以运行服务看


## 整体架构
<img width="973" src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-2-ssr.png">

- client端分为`front`和`admin`，`webpack2`打包实现多页配置，开发模式下`hot reload`
    - admin端使用vue2、vuex、vue-router
    - front端直接使用 ~~vue event bus~~ vuex(考虑到今后博客应用可能变复杂)、vue-router, Fastclick解决移动端300ms延迟问题
    - 编辑器使用[simplemde](https://github.com/NextStepWebs/simplemde-markdown-editor)
    - markdown解析和高亮使用marked.js和highlight.js
- server
    - 使用koa2+koa-router实现RESTful API
    - mongoose连接mongodb
    - 前后端鉴权使用[jwt](https://github.com/auth0/node-jsonwebtoken)
- 实现Server-Side Rendering服务端渲染

## 更多细节
- 博客线上地址：http://172.16.17.32:9000/
- 掘金文章：https://juejin.im/post/58f99b3cac502e006395e6e7

> 细节待更新（访问博客线上地址可以获得最新信息）

## 快速开始
- 需要Node.js 6+版本
- 需要安装mongodb,并且运行mongodb服务,在`server/configs/index.js`中默认连接`mongodb://localhost:27017/vue-blog`
- 配置`server/configs/index.js`,配置admin用户名、密码等,或者新建`server/configs/private.js`


``` bash
# install dependencies 
# 安装依赖，可以使用yarn/npm
npm install # or yarn install

# serve in dev mode, with hot reload at localhost:8889
# 开发环境，带有HMR，监听8889端口
npm run dev

# build for production
# 生产环境打包
npm run build<commit_msg>update README.md, update some addresses<commit_after># vue-blog

> A single-user blog built with vue2, koa2 and mongodb which supports Server-Side Rendering

一个使用vue2、koa2、mongodb搭建的单用户博客，支持markdown编辑，文章标签分类，发布文章／撤回发布文章，支持服务端渲染（Server-Side Rendering）

<p align="center">
    <img src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-1.png" width="700px">
    <img src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-admin-22.png" width="700px">
    <img src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-2.png" width="700px">
    <br>
    访问链接:http://imhjm.com/
</p>

> 博客域名还没有配置，只展示前台部分，有兴趣的同学可以复制到浏览器地址栏访问，admin部分有兴趣的读者可以运行服务看


## 整体架构
<img width="973" src="http://7xp9v5.com1.z0.glb.clouddn.com/vue-blog-2-ssr.png">

- client端分为`front`和`admin`，`webpack2`打包实现多页配置，开发模式下`hot reload`
    - admin端使用vue2、vuex、vue-router
    - front端直接使用 ~~vue event bus~~ vuex(考虑到今后博客应用可能变复杂)、vue-router, Fastclick解决移动端300ms延迟问题
    - 编辑器使用[simplemde](https://github.com/NextStepWebs/simplemde-markdown-editor)
    - markdown解析和高亮使用marked.js和highlight.js
- server
    - 使用koa2+koa-router实现RESTful API
    - mongoose连接mongodb
    - 前后端鉴权使用[jwt](https://github.com/auth0/node-jsonwebtoken)
- 实现Server-Side Rendering服务端渲染

## 更多细节
- 博客线上地址：http://imhjm.com/
- [基于vue2、koa2、mongodb的个人博客](http://imhjm.com/article/58f76ed0c9eb43547d08ec6c)
- [Vue2服务端渲染实践以及相关解读](http://imhjm.com/article/590710fbe3176b248999f88c)

> 访问博客线上地址可以获得最新信息

## 快速开始
- 需要Node.js 6+版本
- 需要安装mongodb,并且运行mongodb服务,在`server/configs/index.js`中默认连接`mongodb://localhost:27017/vue-blog`
- 配置`server/configs/index.js`,配置admin用户名、密码等,或者新建`server/configs/private.js`


``` bash
# install dependencies 
# 安装依赖，可以使用yarn/npm
npm install # or yarn install

# serve in dev mode, with hot reload at localhost:8889
# 开发环境，带有HMR，监听8889端口
npm run dev

# build for production
# 生产环境打包
npm run build
{'fraction_non_alphanumeric': 0.14875105248386192, 'fraction_numerical': 0.05641313499859669, 'mean_word_length': 4.842622950819672, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 23, 'https://': 5, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 2, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3329043', 'n_tokens_mistral': 2015, 'n_tokens_neox': 2052, 'n_words': 188}