koa2 mysql项目教程_blogs: Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站...

news/2024/5/10 10:36:55/文章来源:https://blog.csdn.net/weixin_34963576/article/details/114318778

BOBLOG-03.png

一、这是个什么的项目?

基于 Node.js Koa2 实战开发的一套完整的博客项目网站,使用 Koa2 二次开发一套适合多端的 RESTful API,同时配套完整的后台管理系统,且前端展示既有基于 ejs 服务端渲染,也有基于 Vue.js 前后端分离的 2 套前端网站。

二、项目包含什么功能?

koa-%5E2.7.0-brightgreen.svg

koa--router-%5E7.4.0-brightgreen.svg

sequelize-%5E5.6.1-brightgreen.svg

mysql2-%5E1.6.5-brightgreen.svg

2.1.Node.js Koa2服务端 RESTful API

管理员与权限控制接口

文章管理接口

评论/回复功能接口

分类接口

广告接口

2.2.博客前端展示网站

ejs 服务端渲染

Vue.js 前后端分离

2.2.后台管理系统

使用 Vue.js iviewui design 搭建的后台管理系统

2.3.优势

使用精小而强大的 Node.js Koa2 框架做服务端 API 接口。

前端既有服务端渲染,也有前后端分离,且做了大量的优化工作,前端展示网站打开快。

性能优化方面的工作:

服务端使用了缓存机制,减少服务器的请求压力,如Redis 缓存,HTTP缓存

使用了 CND 加速,静态文件存储在七牛服务器上

ejs 服务端渲染尽量减少文件的引入,减少对 DOM的操作,且封装使用了图片懒加载,事件防抖和节流控制浏览器滚动监听事件。

Vue.js 项目使用了模块按需加载,使用浏览器缓存机制减少对服务器请求的压力

...

2.4.知识点

服务端:Node.js, Koa, MySQL, Sequelize, Redis

前端服务端渲染:ejs, jQuery, Bootstrap, 体验网址:www.boblog.com

前后端分离:Vue.js, iviewui, 体验网址:vue.boblog.com

后端管理系统:Vue.js, iviewui

性能优化

非常适合想用 Node.js Koa2 做网站的朋友,相信你一定能学到知识。

三、如何学习?

3.1.克隆项目

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

# 克隆项目代码

$ git clone https://github.com/LFB/nodejs-koa-blog.git

3.2.数据库

启动项目前一定要在创建好 boblog 数据库,以下是执行数据库命令:

# 登录数据库

$ mysql -uroot -p密码

# 创建 boblog 数据库

$ CREATE DATABASE IF NOT EXISTS boblog DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

3.3.Redis

项目使用了Redis,请在你的电脑上面装上Redis::「点击:附上Redis安装教程」,安装好 Redis 后,需启动Redis。

3.4.修改 Koa2 项目数据库配置

请在根目录下的 |——config/config.js 文件下修改您本地的数据库名字(boblog)和数据库密码 ( password )。

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

以下是启动服务端项目的操作命令:

# 进入项目根目录

$ cd nodejs-koa-blog

# 安装依赖包

$ npm install

# 启动 Node.js Koa2 项目

$ npm run dev

打开浏览器输入回车:http://localhost:3000 可以看到服务端渲染的前端网站,当然可能该网站是个空数据网站,可以查看目录下的 ./app/api/v1 下的接口或者看 doc 目录下的 markdown 接口文档,在 postman 测试接口。

以下是启动后台管理系统的操作命令:

# 启动后台管理系统

1. 在根目录下进入admin项目:cd admin,

2. 安装包,执行: npm install 命令,

3. 启动服务: npm run dev; 浏览器打开:http://localhost:8083/ 即可以访问。

以下启动 Vue.js 前端项目

# 启动 Vue.js 前端项目

1. 在根目录下进入web项目:cd web,

2. 安装依赖包,执行: yarn install 或者 npm install 命令,

3. 启动项目: yarn serve 或者 npm run serve; 浏览器打开:http://localhost:8080/ 即可以访问。

四、接口说明(重要)

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

五、FAQ

没有yarn环境,npm 可以吗?

答:可以的,建议使用 yarn,yarn 比 npm 速度快,主要是安装版本统一。

启动 Koa2 项目报错,请问原因?

答:首先,请检查一下使用 npm 或 yarn 安装依赖包没。然后,再请检查一下确保安装好数据库,新建好数据库:boblog,请看上面的数据库配置。最后看下启动打印日志是否有报错的信息。

... 更多问题请到 Issues查阅,或者有问题请到 Issues 提问。

License

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

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

MIT, by 梁凤波

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_805078.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

大型网站架构系列——分布式消息队列

转载自:https://www.cnblogs.com/itfly8/p/5155983.html 消息队列概述消息队列使用场景1、消息队列概述: 消息队列中间件是分布式系统中重要的组件,主要解决 应用耦合,异步消息,流量削锋 等问题。实现高性能&#xff…

XMLHTTP: 网站超级粘合剂

Microsoft.NET: XMLHTTP: 网站超级粘合剂发表于 Saturday, June 05 11:25:57 CST by joezxh joe.zhang 投递 "简介许多ASP开发者都希望在自己的网站中能够使用到微软提供的支持XML的新功能。其中,有些人发现可以使用XML来装饰网站,但是&#xff0c…

下载代码去 pudn.com每个编程人员都需要的网站

下载代码去 pudn.com每个编程人员都需要的网站�B7Windows编程�B7嵌入式/单片机�B7Java编程 �B7网络编程�B7通讯编程�B7多媒体编程 �B7数值算法�B7游戏编程�B7系统安全 &a…

建立社交网站(Social network)的WordPress的三大顶级插件(译)

面试的时候被问到如何使用CMS建设社交网站,完全一头雾水,然后去google、百度了,发现可以使用Drupal或Joomls或WordPress快速建立,特别是WordPress,有一些建设社交网站的现成插件 本文翻译自:http://wpmu.or…

好网站--中国代码网China-Code.Net-代码、源代码、源码下载网站

好网站--中国代码网China-Code.Net-代码、源代码、源码下载网站http://www.china-code.net/

站长下载 - 源码下载,网站源码,站长工具 - 中国站长站

站长下载 - 源码下载,网站源码,站长工具 - 中国站长站http://down.chinaz.com/

学会使用计数器统计用户活跃度,适合软件,网站,手机应用

用了几年了,一直觉的这个不错:http://www.51.la/ 其实网上有很多免费资源,只是每个人知道的太少了,你有10个,20个不错的都可以选择,往往你却一个也不 知道 每天有多少人访问您的网站?他们从何而…

目前国内知名的编程网站有哪几个?

目前国内知名的编程网站有哪几个?近来很少关注了

Pinterest联合创始人Evan Sharp:视觉网站标配“网格布局”的设计过程

摘要:凭借网格布局设计,Pinterest已成为视觉网站的代名词。在专访中,Pinterest联合创始人Evan Sharp为我们分享了网格布局的设计过程及Pinterest中新功能的设计思路。2009年,当Evan Sharp和两位朋友产生创办Pinterest的想法时&…

Pinterest联合创始人Evan Sharp:视觉网站标配“网格布局”的设计过程

摘要:凭借网格布局设计,Pinterest已成为视觉网站的代名词。在专访中,Pinterest联合创始人Evan Sharp为我们分享了网格布局的设计过程及Pinterest中新功能的设计思路。这就是他伟大的网址:http://www.pinterest.com/ 2009年&#…

解决网站防挂IFRAME木马方案

今天一上服务器2000多个<iframe src"http://ca.winvv.com/cn.htm" width0 height0></iframe> 被注入&#xff0c;我晕&#xff01;检查了半天&#xff0c;原来是FckEditor编辑器上传漏洞导致。在找资料的同时&#xff0c;发现CSS有一个有趣的属性express…

大型网站技术架构(一)大型网站架构演化

2019独角兽企业重金招聘Python工程师标准>>> 看完了有一本书&#xff0c;就应该有所收获&#xff0c;有所总结&#xff0c;最近把《大型网站技术架构》一书给看完了&#xff0c;给人的印象实在深刻&#xff0c;再加上之前也搞过书本上讲的反向代理和负载均衡以及ses…

使用Web标准建站

使用Web标准建站第1天:选择什么样的DOCTYPE 前言 大家好&#xff01;这个系列文章是按阿捷自己制作这个站点的过程编写的。之前阿捷也一直没有制作过一个真正符合web标准的网站。现在边参考国外资料边制作&#xff0c;同时把过程中的心得和经验记录下来&#xff0c;希望对大家有…

不可忽视的力量,插件主题网站

在当前Web2.0时代&#xff0c;Blog&#xff0c;RSS&#xff0c;Wiki等服务充斥着整个互联网。近日&#xff0c;用户个性化定制搜索巨头Google宣布&#xff0c;将向Web 开发人员开放Gadget框架&#xff0c;使其能够在自己的网页上增添Universal Gadget。这意味这用户可以根据自己…

关于“解决实现注册用户后,自动具备访问网站的权限的问题”文章中配置出现找不到角色的问题的解决办法...

根据网上教程“一步一步SharePoint 2007”中学习moss&#xff0c; 在“一步一步SharePoint 2007之二十&#xff1a;解决实现注册用户后&#xff0c;自动具备访问网站的权限的问题(2)——配置Role”中出现了创建用户时说找不到角色的错误。解决办法如下&#xff1a;转载于:https…

如何使用谷歌的自定义搜索引擎来搜寻一个ASP.NET网站【转】

转&#xff1a;http://www.cnblogs.com/jaic-xiao/archive/2008/09/23/search_zj_cnblogs_thanks__scott_mitchell.html ASP.NET中的站点地图功能与SiteMapPath, TreeView, 和 Menu控件帮助访问者浏览您的网站并找到信息。然而&#xff0c;ASP.NET没有提供任何内置的搜索功能&a…

用rsync实现网站镜像和备份[zt]

用rsync实现网站镜像和备份http://blog.chinaunix.net/u2/72296/showart_1093380.html 服务器端# more /etc/rsyncd.conf uid nobody gid nobody use chroot no max connections 4 pid file /var/run/rsyncd.pid lock file /var/run/rsync.lock log file /var/log/rsyn…

html h5 页面 字体大小 fontsize 5px 不生效_必途必:如何通过网站页面布局优化提升seo关键词排名?...

大多数做SEO的人不会忽视网站的页面优化。很多人把注意力集中在网站主页的页面优化上。网站页面优化也是网站内部优化的第一步。通过页面内容的布局调整和设计&#xff0c;可以创建一个用户喜欢并有利于搜索引擎抓取和识别的页面&#xff0c;从而提高搜索引擎的排名。让网站获得…

在本机上快速搭建自己的网站服务器并让外网访问

在本机上快速搭建自己的网站服务器并让外网访问 利用phpstudynat123在本机上快速搭建自己的网址服务器并让外网访问phpstudynat123 1 在百度搜索phpstudy和nat123并下载安装&#xff08;默认就行&#xff09; 2 phpstudy不需要设置&#xff0c;打开并启动服务&#xff0c;然后…

图片特效的网站

一个图片特效的网站 2008-07-02 13:02:39标签&#xff1a;图片 网站 特效 一个    [推送到技术圈] 版权声明&#xff1a;原创作品&#xff0c;如需转载&#xff0c;请与作者联系。否则将追究法律责任。一个不错的图片特效网站&#xff0c;源代码下载下来就可以用。本文出自…