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

原创 快疯了 教程 javascript 466阅读 2018-08-10 17:28:09 举报

koa2+mysql+vue+vant 构建简单版移动端博客

具体内容展示

开始正文

github地址
<br/>

觉得对你有帮助的话,可以star一下^_^
<br />
必须安装:<br/>
mysql <br/>
node.js<br />
vue-cli<br/>

目录结构


<br/><br/>

代码步骤

<br/>
app 目录下 打开 node 运行vue-cli vue init webpack 新建Vue项目<br/>
安装以下依赖模块:
<br/>

"axios": "^0.18.0",
"js-cookie": "^2.2.0",
"js-md5": "^0.7.3",
"nprogress": "^0.2.0",
"vant": "^1.1.15",
"vue": "^2.5.2",
"vue-router": "^3.0.1"

详细具体看github源码
<br />
<br />

koa2 目录下 打开 node 运行 npm init 编写信息<br/>
安装以下依赖模块: <br/>

"jsonwebtoken": "^8.3.0",  // 生成token
"koa-bodyparser": "^4.2.1", // 解析requeset body
"koa-cors": "^0.0.16", // koa跨域
"koa-router": "^7.4.0", // koa-router
"koa-static": "^5.0.0", // koa静态文件
"koa2": "^2.0.0-alpha.7", // koa2
"mysql": "^2.16.0", // mysql
"uuid": "^3.3.2" // 生成userId

<br/>

在 koa2/config.js 进行 mysql 链接配置

<br />

编写 sql 配置 <br />

在 koa2/mysql.js 进行编写 sql 语句

编写 koa2 配置

在 koa2/app.js 进行编写 koa2 配置

分析登录注册

详细分析一下 登录 注册
<br />
登录 -> 有账号 -> 校验密码 -> 成功 -> 返回Token<br />
<br />
登录 -> 没有账号 -> 注册 -> 判断是否有账号 -> 没有-> sql注册 <br />
///////////////////-> 注册 -> 有账号 -> 去登录<br /><br />

注册<br/>

signUp.js

登录
<br />
signIn.js

生成Token, 解析Token

createToken.js , checkToken.js 原理
<br />

<br/>

其他的接口就不做解释了 <br />

项目打包后,放在 Koa2 / public / 下,就可以访问 localhost:3001 查看页面了

Github地址

都是基本的mysql语句操作,和业务逻辑, 具体看github源码

觉得对你有帮助的话,可以star一下 ^_^

评论 ( 4 )
最新评论
呵呵弟 2018-09-18 23:09:16 4F

很不错,用mysql

lawrence 2F 2018-09-03 22:10:21 3F

不加班么?

快疯了 1F 2018-09-03 15:36:31 2F

上班没事做了,就去研究了一下

lawrence 2018-08-31 15:21:35 1F

这个是楼主自己开发的么?