分享Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站
这是个什么的项目?
使用 Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站。
- 博客线上地址:www.boblog.com
- Github地址:https://github.com/liangfengbo/nodejs-koa-blog
解决了什么问题?
- 服务端:使用 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 实战开发一套完整个人博客项目网站的更多相关文章
- 基于 abp vNext 和 .NET Core 开发博客项目 - Blazor 实战系列(一)
系列文章 基于 abp vNext 和 .NET Core 开发博客项目 - 使用 abp cli 搭建项目 基于 abp vNext 和 .NET Core 开发博客项目 - 给项目瘦身,让它跑起来 ...
- Node.js 从零开发 web server博客项目[koa2重构博客项目]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- 全栈前端入门必看 koa2+mysql+vue+vant 构建简单版移动端博客
koa2+mysql+vue+vant 构建简单版移动端博客 具体内容展示 开始正文 github地址 <br/> 觉得对你有帮助的话,可以star一下^_^必须安装:<br/> ...
- Node.js 从零开发 web server博客项目[express重构博客项目]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[数据存储]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[安全]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[登录]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[日志]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
- Node.js 从零开发 web server博客项目[接口]
web server博客项目 Node.js 从零开发 web server博客项目[项目介绍] Node.js 从零开发 web server博客项目[接口] Node.js 从零开发 web se ...
随机推荐
- 一个2013届毕业生(踏上IT行业)的迷茫(2)
初中的时光是一段艰辛,但幸福的时光,在这一段时光中同样我遇到了我人生中第二个贵人.记得在小学毕业的那个暑假里,我知道上了初中会开一门叫做英语的课程,那时候在我们那里有好多上过初中.高中的在我们小学开英 ...
- CSS:描述样式
一.CSS css:Cascading Style Sheet,层叠样式表,用于描述网页样式 1. 同一个标签可以有多个选择器作用,给他增加样式: 2. 有继承性,祖先的标签的一些属性,可以继承给后代 ...
- 《冰球撞击》Android休闲桌球类游戏现已面试,快来下载吧!
<冰球撞击>Android休闲桌球类游戏现已完工上市快来下载吧! http://pan.baidu.com/s/1dD9vIRv <冰球撞击>是一个类似玩投篮机操作方式的And ...
- chrome浏览器***
chrome浏览器***: "红杏"是一款 Chrome 浏览器插件.(PS:不用 Chrome 的同学赶紧去下载安装.那个***大家都懂得.)相较于其它***方式,"红 ...
- uinty3d导入错误问题解决
导入第一被复制到文件unity3d在相应的文件夹的安装文件夹.回归后,unity3d软体.正确的选择"输入". 版权声明:本文博主原创文章.博客,未经同意不得转载.
- ElasticSearch的基本用法与集群搭建 good
一.简介 ElasticSearch和Solr都是基于Lucene的搜索引擎,不过ElasticSearch天生支持分布式,而Solr是4.0版本后的SolrCloud才是分布式版本,Solr的分布式 ...
- 零元学Expression Design 4 - Chapter 2 熟悉Design并且快速设计出Silverlight网页
原文:零元学Expression Design 4 - Chapter 2 熟悉Design并且快速设计出Silverlight网页 本章将用带大家熟悉Design 4并制作简易的网页版面,也会让你了 ...
- WPF无边框实现拖动效果
这是在做弹幕的时候遇到的一个需求 透明背景,拖动弹幕=.= private void Window_MouseLeftButtonDown(object sender, MouseButtonEven ...
- WPF中的图像处理简介
原文:WPF中的图像处理简介 和Winform中的GDI+相比,WPF提供了一组新的API用于显示和编辑图像.新API特点如下: 适用于新的或专用图像格式的扩展性模型. 对包括位图 (BMP).联合图 ...
- Win8 Metro(C#)数字图像处理--2.46图像RGB分量增强效果
原文:Win8 Metro(C#)数字图像处理--2.46图像RGB分量增强效果 [函数名称] RGB分量调整 RGBAdjustProcess(WriteableBitmap ...