Vue全家桶+SSR+Koa2全栈开发美团网
Vue全家桶+SSR+Koa2全栈开发美团网
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第1章 课程导学
第1章 课程导学
1导学_[itjc8.com].mp4
Vue全家桶+SSR+Koa2全栈开发美团网
@快乐动起来呀
nuxt.js koa2
SMTP服务 邮箱
系统完整
体验逼真
技能全面
数据真实
通俗易懂
706569906@qq.com
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第2章 Vue基础知识
第2章 Vue基础知识
2-1 概述&脚手架_[itjc8.com].mp4
Vue2 基础
环境搭建
模板语法
计算属性
类与样式
条件&列表宣染
事件处理
深入了解组件
路由基础
Vuex基础
vue-cli@3
vue@2.5
npm install -g @vue/cli
yarn global add @vue/cli
vue -V 3.0.1
2-2 模板语法（1）_[itjc8.com].mp4
2-3 模板语法（2）_[itjc8.com].mp4
2-4 样式与遍历_[itjc8.com].mp4
类与样式
对象语法
适合较多的class名或者动态的class
数组语法
适合较少的class名
ul>template>li 分组
<template v-for=item in arr>
<li :key="item+1">yy</li>
<li :key="item">{{item}}</li>
</template>
2-5 事件_[itjc8.com].mp4
事件处理
定义&缩写
事件的定义及缩写
内联写法
事件传参和事件对象
事件修饰符
快速结合键盘事件提升效率
2-6 组件（1）_[itjc8.com].mp4
深入了解组件
props
组件的参数传递
slot
插槽在组件抽象设计中的应用
自定义事件
父子组件的通信方式
2-7 组件（2）_[itjc8.com].mp4
2-8 路由基础_[itjc8.com].mp4
2-9 Vuex基础用例（1）_[itjc8.com].mp4
2-10 Vuex基础用例（2）.mp4
2-11 Vuex高级用例（1）_[itjc8.com].mp4
vuex module 命名空间使用 [modle/add] mapActions(module1,['add','two'])
2-12 Vuex高级用例（2）_[itjc8.com].mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第3章 Koa2基础知识
第3章 Koa2基础知识
3-1 Koa-generator_[itjc8.com].mp4
Koa2基础
koa-generator
koa2路由
redis基础
async和await语法
koa2中间件
cookie和session
mongoose基础
安装
npm install -g koa-generator
创建项目
koa2 project html引擎 或者 koa2 -e project 用ejs模板引擎
run the app:
> SET DEBUG=koa* & npm start koa2-learn
http://localhost:3000/
global.console.log('index') node全局对象是global
> npm install --update-binary
npm run dev
出错代替
安装全局nodemon
nodemon bin/www
3-2 Koa异步async_[itjc8.com].mp4
3-3 Koa中间件_[itjc8.com].mp4
3-4 koa路由和cookie_[itjc8.com].mp4
cookie和session的定义
cookie和session的作用
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第4章 Mongoose和Redis基础
第4章 Mongoose和Redis基础
4-1 mongoose（1）_[itjc8.com].mp4
mongodb的概念&安装
mongodb可视化工具RoBo 3T安装及应用
mongoose的作用
中文文档
mongoose的应用
which mongod mongod
https://robomongo.org/download RoBo 3T
https://mongoose.shujuwajue.com 中文
npm i mongoose
4-2 mongoose（2）_[itjc8.com].mp4
curl -d 'name=koo&age=28' http://xx.xx.xx/xx
4-3 Redis（1）_[itjc8.com].mp4
redis的概念&安装
redis的应用场景
redis的用法
https://www.runoob.com/redis/redis-install.html
redis-server
koa中间件
npm i koa-generic-session koa-redis
> redis-cli
4-4 Redis（2）_[itjc8.com].mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第5章 Nuxt.js基础知识
第5章 Nuxt.js基础知识
nuxt 拿st
5-1 5-2 Nuxt.js基础（2）Nuxt.js基础（1）.mp4
Nuxt.js概述
Vue 2
Vue Router
Vuex（included only when using the store option）
Vue Server Renderer（excluded when using mode：'spa'）
vue-meta
Nuxt.js安装
vue init nuxt-community/koa-template
https://zh.nuxtjs.org/guide/installation
https://github.com/nuxt-community/koa-template
vue init nuxt-community/koa-template nuxt-learn
> npm i -g nrm
nrm ls
nrm use npm
重新编译下 npm install --update-binary
Nuxt.js基础
路由&示例
页面模板&示例
异步数据&示例&SSR剖析
或用&示
Vuex应用&示例
在pages目录下创建文件
文件即是路由 不用配置路由
layout 模板 公布布局样式
5-3 Nuxt.js基础（3）_[itjc8.com].mp4
npx create-nuxt-app <项目名>
5-4 Nuxt.js基础（4）.mp4
Vue SSR工作原理
1、SSR概述
2，SSR实现的原理
3、Vue SSR的宣染流程
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第6章 实战准备
第6章 实战准备
6-1 环境准备与项目安装.mp4
实战准备
环境准备
项目安装
辅助工具安装
配置改装
项目安装
1 npm install-g npx
2 npx create-nuxt-app project-name
To get started:
cd mt-app
npm run dev
-
To build & start for production:
cd mt-app
npm run
build
npm start
6-2 辅助工具安装与配置改装.mp4
配置改装
使用ES6的import/export
修改build配置
设置babel 安装sass
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第7章 开发美团网首页
第7章 开发美团网首页
7-1 需求分析.mp4
首页开发
需求分析
模板设计
组件设计
数据结构设计
接口设计
先想再做
7-2 首页Header开发-城市定位服务设计.mp4
7-3 首页Header开发-头部引导导航设计.mp4
7-4 首页Header开发-搜索界面设计.mp4
dl dt dd 二级
7-5 Bug修复.mp4
7-6 首页搜索.mp4
7-7 首页菜单（1）.mp4
7-8 首页菜单（2）.mp4
<template v-for='(item,index) in list'>
<h1 :key="index"></h1> :key在这写 template
</template>
settimeout延长
7-9 章节小结.mp4
7-10 Footer补充.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第8章 开发美团网首页-登录注册
第8章 开发美团网首页-登录注册
8-1 注册（1）.mp4
8-2 注册（2）.mp4
npm i koa-router koa-redis nodemailer
8-3 注册（3）.mp4
npm i koa-passport passport-local
8-4 注册（4）.mp4
8-5 注册（5）.mp4
8-6 注册（6）.mp4
npm i koa-bodyparser koa-generic-session
8-7 注册（7）.mp4
8-8 注册&登录（1）.mp4
加密库 crypto-js
window.encodeURLComponent('中文编码')
8-9 注册&登录（2）.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第9章 开发美团网首页-Search搜索
第9章 开发美团网首页-Search搜索
9-1 城市服务.mp4
9-2 菜单数据.mp4
SSR 查看源代码 服务器给的模板 是有内容的
9-3 Geo接口实现.mp4
9-4 Search接口实现（1）.mp4
9-5 Search接口实现（2）.mp4
用自己数据结构 映射
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第10章 切换城市页
第10章 切换城市页
10-1 切换城市（1）.mp4
10-2 切换城市（2）.mp4
10-3 切换城市（3）.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第11章 美团网产品列表页
第11章 美团网产品列表页
11-1 页面设计（1）.mp4
11-2 页面设计（2）.mp4
11-3 地图组件开发.mp4
高德开放平台 js版本
11-4 入口文件编写（1）.mp4
11-5 入口文件编写（2）.mp4
11-6 页面调试.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第12章 美团网产品详情页开发
第12章 美团网产品详情页开发
12-1 需求分析.mp4
12-2 静态模板.mp4
数据过滤 没图片的
12-3 产品详情页入口-静态文件.mp4
12-4 产品详情页-接口.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第13章 购物车开发
第13章 购物车开发
13-1 购物车&订单-需求分析.mp4
13-2 购物车&订单-页面创建.mp4
13-3 购物车接口实现.mp4
13-4 购物车调试.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第14章 订单页开发
第14章 订单页开发
14-1订单.mp4
14-2 订单接口.mp4
14-3 订单调试.mp4
D:\Vue教程\Vue全家桶+SSR+Koa2全栈开发美团网\第15章 课程总结
第15章 课程总结
15_1课程总结.mp4
用到的技术
nuxt.js koa2
706569906@qq.com
atom编辑器少用x
vue2.5
安装
npm install -g koa-generator
创建项目
koa2 project html引擎 或者 koa2 -e project 用ejs模板引擎
http://localhost:3000/
https://koa.bootcss.com/#
npm i mongoose
nuxt.js
http://bj.meituan.com
elemnetUI
加密库 crypto-js
window.encodeURLComponent('中文编码')
lodash (延迟方法) _.debounce
js-pinyin库
高德开放平台
浙公网安备 33010602011771号