这是个什么的项目?

使用 Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站。

解决了什么问题?

  • 服务端:使用 Node.js 的 Koa2 框架二次开发 Restful API。
  • 前端:Vue.js 打造了前端网站和后台管理系统。

项目包含什么功能?

  • Koa2服务端

    • 管理员与权限控制
    • 文章
    • 文章分类
    • 评论文章
  • 前端博客网站 Vue.js
  • 后台管理系统 Vue.js

项目的特点

  • Koa 与 Koa 二次开发API
  • 多 koa-router 拆分路由
  • require-directory 自动路由加载
  • 异步编程 - async/await
  • 异步异常链与全局异常处理
  • Sequelize ORM 管理 MySQL
  • JWT 权限控制中间件
  • 参数验证器 Validator
  • nodemon 修改文件自动重启
  • 前后端分离
  • 使用 Vue.js 搭建前端网站和后台管理系统

如何使用和学习?

数据库

启动项目前一定要在创建好 boblog 数据库。

# 登录数据库
$ mysql -uroot -p密码

# 创建 wxapp 数据库
$ CREATE DATABASE IF NOT EXISTS boblog DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

克隆项目

首先使克隆项目,然后进入项目根目录使用命令安装包,最后命令启动项目,代码会根据模型自动创建数据库表的。

根目录都是 Node.js + Koa2 API开发源代码,根目录下的 web 文件夹下都是前端网站项目源代码,根目录下的 admin 文件夹下都是后台管理系统的源代码。

# 克隆项目代码
$ git clone https://github.com/liangfengbo/nodejs-koa-blog.git

# 进入koa项目根目录
$ cd nodejs-koa-blog

# 安装包
$ npm install

# 运行服务
$ npm run dev

# 打开浏览器输入回车:http://localhost:3000

// 前端项目使用
1. 在根目录下进入web项目:cd web,
2. 安装包,执行: npm install 命令,
3. 启动服务: npm run dev; 浏览器打开:http://localhost:8080/ 即可以访问。

// 后台管理系统使用
1. 在根目录下进入admin项目:cd admin,
2. 安装包,执行: npm install 命令,
3. 启动服务: npm run dev; 浏览器打开:http://localhost:8083/ 即可以访问。

接口说明(重要)

项目的所有接口文档都这里,可以逐个文档看。

License

项目已实现管理员、权限管理、文章、分类、评论等接口,前端模板网站和后台管理系统。自己可以根据项目代码学习,可以到 postman 软件中测试API或学习。

喜欢或对你有帮助的话,请你点一个星星 star 鼓励我,或者您有更好的建议和意见,请提出来告知我,可以留言 Issues。希望能够帮助到你学习!Thanks!

MIT, by 梁凤波
****

分享Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站的更多相关文章

  1. 基于 abp vNext 和 .NET Core 开发博客项目 - Blazor 实战系列(一)

    系列文章 基于 abp vNext 和 .NET Core 开发博客项目 - 使用 abp cli 搭建项目 基于 abp vNext 和 .NET Core 开发博客项目 - 给项目瘦身,让它跑起来 ...

  2. Node.js 从零开发 web server博客项目[koa2重构博客项目]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  3. 全栈前端入门必看 koa2+mysql+vue+vant 构建简单版移动端博客

    koa2+mysql+vue+vant 构建简单版移动端博客 具体内容展示 开始正文 github地址 <br/> 觉得对你有帮助的话,可以star一下^_^必须安装:<br/> ...

  4. Node.js 从零开发 web server博客项目[express重构博客项目]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  5. Node.js 从零开发 web server博客项目[数据存储]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  6. Node.js 从零开发 web server博客项目[安全]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  7. Node.js 从零开发 web server博客项目[登录]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  8. Node.js 从零开发 web server博客项目[日志]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

  9. Node.js 从零开发 web server博客项目[接口]

    web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...

随机推荐

  1. 我的MBTI职业性格测试

    背景 最近在看<程序员的思维训练--开发人之前能的九堂课>,其中讲到了 MBTI 职业性格测试的指导意义.记起来两年多以前在面试 ASES 的时候有做过这个测试,只可惜当时的测试结果在好几 ...

  2. C# .NET数据库操作

    C# .NET更智能的数据库操作的封装完整版(重构)   前述: 第一次发表文章,不过是对数据库简单的封装,主要是阐述下思路.那么在上篇文章,在大家的指导下和提出意见,并自己对代码进行了思考.在这两天 ...

  3. Delphi 获取外部程序句柄与发送消息

    --记录下来备以后用 [打开外部程序.消息.句柄],技术有限,希望不要误人子弟了. 源码unit Unit1; interface uses Windows, Messages, SysUtils, ...

  4. HTTP协议(一些报头字段的作用,如cace-control、keep-alive)

    ---恢复内容开始--- Http连接是一种短连接,是一种无状态的连接. 所谓的无状态,是指浏览器每次向服务器发起请求的时候,不是通过一个连接,而是每次都建立一个新的连接. 如果是一个连接的话,服务器 ...

  5. WPF中使用TranslateTransform3D修改CAD的3D旋转中心

    原文:WPF中使用TranslateTransform3D修改CAD的3D旋转中心        前面一篇文章讲述了2D旋转功能的实现,文章提到了修改3D旋转中心,这一节主要总结一下具体的修改3D旋转 ...

  6. NLP(paper + code)

    0. 开源的库 genism keras wrapper of theano/TensorFlow 1. CNN for NLP Convolutional Neural Networks for S ...

  7. Mybatis缓存 缓存配置文件 good

    一.MyBatis缓存介绍 正如大多数持久层框架一样,MyBatis 同样提供了一级缓存和二级缓存的支持 一级缓存: 基于PerpetualCache 的 HashMap本地缓存,其存储作用域为 Se ...

  8. WPF 窗体中获取键盘和鼠标无操作时的超时提示

    原文:WPF 窗体中获取键盘和鼠标无操作时的超时提示 通过调用Windows API中的GetLastInputInfo来获取最后一次输入的时间 , , );            timer.Tic ...

  9. Bootstrap 固定在顶部导航条

    @{    Layout = null;}<!DOCTYPE html><html><head>    <meta name="viewport&q ...

  10. jquery 显示和隐藏的三种方式

     <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head>    & ...