之前本身的博客是用hexo做的，背面想做一个有背景的博客就盘算用vue加node来尝尝，因而就有了这个博客。
项目地点

W-Blog

W-Blog是一个基于vue和node的小小小博客
前端用vue，后端用egg.js

疾速入门

手艺栈

• 前端：

  • 用户端：vue、iview
  • admin端：vue、d2admin、element
• 后端: egg.js、mongodb

功用特征

• 轻量级Markdown编辑器，图片上传七牛
• 支撑标签、分类、搜刮草稿箱等功用
• 标签云

线上地点

煌哥哥的博客

图片演示

前台

• 首页阅读

• 文章概况阅读及目次导航

• 可根据分类和标签搜刮文章

• 输入关键词搜刮

• 标签云及搜刮

背景

• 背景登录

• 文章列表

• 文章搜刮

• 文章编辑

• 增添分类

• 增添标签

• 标签修正（分类一样）

• 文章修正

• 文章删除，支撑垃圾箱草稿箱

目次构造

│  .autod.conf.js
│  .eslintignore
│  .eslintrc
│  .gitignore
│  .travis.yml
│  app.js // 项目启动前实行，比方写入管理员
│  appveyor.yml
│  package.json
│  README.md
│
├─app
│  │  router.js // 效劳端路由
│  │
│  ├─controller
│  │      admin.js // 背景相干controller
│  │      client.js // 前台相干controller
│  │      login.js // 登录相干controller
│  │      page.js // 页面相干controller
│  │
│  ├─extend
│  │      helper.js
│  │
│  ├─middleware
│  │      auth.js // 登录考证中间件
│  │
│  ├─model
│  │      Article.js // 文章model
│  │      Category.js // 分类model
│  │      Tag.js // 标签model
│  │      User.js // 用户model
│  │
│  ├─public
│  │  │
│  │  ├─admin // admin端
│  │  │  ├─dist // 打包天生后的目次
│  │  │  └─src // admin端源文件
│  │  │
│  │  └─client // 用户端
│  │      ├─dist // 打包天生后的目次
│  │      └─src // 用户端源文件
│  │
│  └─service // service部份用来实行详细的操纵
│          admin.js
│          client.js
│          login.js
│
├─config
│      config.default.js // 项目设置相干
│      plugin.js
│
└─test // 测试相干
    └─app
        └─controller
                home.test.js

全局设置

module.exports = appInfo => {
  return {
    keys: appInfo.name + '_1432030565447_3632',
    mongoose: {
      clients: {
        blog: {
          url: 'mongodb://127.0.0.1/blog',
          options: {
            user: 'test', // 数据库的用户名 
            pass: 'test' // 数据库的暗码
          },
        }
      }
    },
    // 初始化管理员信息
    user: {
      userName: 'admin',
      password: 'admin',
    },
    session: {
      maxAge: 3600 * 1000,
    },
    jwt: {
      cert: 'jsonwebtoken' // jwt秘钥
    },
    /**
     * markdown编辑器的图片上传用的是七牛存储
     * 所以须要设置七牛的key
     */
    qiniu: { // 这里填写你七牛的Access Key和Secret Key
      ak: '',
      sk: ''
    }
  }
};

当地运转

装置MongoDB数据库和Node.js环境。

# 装置效劳端依靠
npm install
# 开启mongodb
mongod --dbpath '你数据库的目次' # --auth 假如开启暗码，要加上这个敕令
# 运转效劳
npm run dev

# 进入前台目次
cd ./app/public/client/src
# 装置前台依靠
npm install
# 运转前台项目
npm run dev

# 进入背景目次
cd ./app/public/admin/src
# 装置背景依靠
npm install
# 运转背景项目
npm run dev

# 即可经由过程 http://127.0.0.1:8080接见
# 开辟阶段直接经由过程webpack的devserver接见
# 代办要求已设置好，可在config下设置proxyTable变动

打包

# 在前台和背景目次离别
npm run build
# 在项目根目次
npm install --production
# 启动
npm start
# 打包后能够经由过程
# http://127.0.0.1:7001/  和 http://127.0.0.1:7001/admin 来接见前台和背景