|
〖课程介绍〗:
现阶段,电商系统随处可见,具有很大市场潜力;同时因为商城系统复杂,涉及到丰富的知识点,如果能进行电商系统的开发,其它各类型的前端系统也能掌握。本课程以Vue全家桶作为主要的技术体系,模拟小米商城,带大家从0开始开发网页和交互功能。你能进行完整的项目架构、体会页面开发的全流程、学习丰富的技术栈和各类组件知识,还能了解Git、动画、开发调试等方面的知识。同时项目本身具有很强的实用性,稍作修改,便能“为我所用”。相信此课程能助你快速进击中级工程师。
[课程目录] :
第1章课程简介
对课程的整体内容做介绍,并讲解Node环境安装和配置,以及Node版本如何做卸载
和升级
1-1课程导学试看
1-2 Node环境安装
1-3 Node升降级
第2章Git安装和配置
首先介绍Git软件的安装和配置,其次对Git命令做详细的操作演示。
2-1 Git的安装
2-2 Git配置
2-3 Git配置SSH公钥
2-4 VSCode操作Git
2-5 Git常用命令
第3章Vue Cli4.0安装和使用
首次对Vue脚手架4.0版本做安装和演示,并对可视化功能做详细介绍
3-1 VueCIli4.0安装
3-2 VueCli4.0使用
3-3 Vue-DevTools安装使用
第4章项目基础架构
此章节全力讲解前端基本项目架构,通过此章节可搭建一个通用性的前端架构 ,内容.
涵盖跨域方案、路由封装、错误拦截等
4-1跨域-CORS
4-2跨域-JSONP
4-3跨域接口代理
4-4接口梳理试看
4-5目录结构设置
4-6基本插件介绍
4-7路由封装
4-8 Storage封装
4-9接口错误拦截
4-10接口环境设置
4-11 Mock设置( 1 )
4-12 Mock设置( 2)
第5章商城首页
介绍了首页各个组件的静态代码实现,并实现了图片懒加载插件集成和Modal动画实现。
5-1 Nav-Header组件(1 )试看
5-2 Nav-Header组件( 2 )
5-3 Nav-Header组件( 3 )
5-4 Nav-Header组件( 4)
5-5 Nav-Header组件(5 )
5-6 Nav- Footer组件
5-7 Service-Bar组件
5-8首页轮播功能实现
5-9首页轮播菜单实现(1 )
5-10首页轮播菜单实现(2 )
5-11首页广告位实现
5-12手机商品实现( 1 )
5-13手机商品实现(2)
5-14 Modal组件实现( 1 )
5-15 Modal组件实现( 2)
5-16 Modal动画实现
5-17 Modal交互补充
5-18图片懒加裁实现
第6章登录页面
登录页面交互和接口完整代码实现
6-1登录交互实现
6-2拉取用户信息
第7章Vuex集成
Vuex插件的入「]和实战应用。
7-1 初步了解Vuex
7-2 Vuex框架搭建
7-3 Vuex实战应用& R; b3 C' A% g! w9 U
第8章 产品站页面9 N) ~# ~2 G' F' B* s, x' ^" j1 ~
介绍产品站页面吸顶组件、参数组件、视频模块以及Slide动画等实现。5 b& ]$ [5 i% h( b+ C4 `
' Y/ u9 a6 l- O6 P6 H! C A% t! n
8-1 产品站参数组件实现% Z+ I, b. q0 A: j: \. x5 M
8-2 组件吸顶实现) L7 B6 e' h1 \- x1 W2 p9 a2 z
8-3 视频模块实现' k1 J* L% P) `$ O8 ]) u7 T
8-4 Slide动画实现(1), T2 q2 Q* }% w$ K `! [, F$ b- C. a" W
8-5 Slide动画实现(2)6 h2 f$ i* x) _. ]* ]( d) s4 G
8-6 产品站交互实现
第9章 商品详情页面
商品详情交互接口实现。
9-1 商品详情交互实现
第10章 购物车页面
主要讲解了购物车头部组件以及购物车所有功能的动态交互实现。3 m- g% E9 D6 I" S0 k
10-1 Order-Header组件- D" v" Q- i: b' B6 Q; W
10-2 购物车列表渲染+ T6 b) v5 y; Z5 ]1 F
10-3 购物车全选和非全选
10-4 购物车商品更新和删除
10-5 购物车结算
第11章 ElementUI集成2 s1 q( o0 m- f2 K- T6 u4 W
ElementUI框架的入门介绍和课程中的实战集成运用) D, A- g$ U! C* d; C' V
+ r9 q. L5 o) C1 ?: p" b. |( r, R
11-1 ElementUI入门梳理4 @1 G0 H& o4 {; N8 q1 C" l3 X
11-2 ElementUI运用9 i: ?9 p' ~) h( m. B3 U) T+ ~
11-3 Babel介绍
11-4 退出功能实现
第12章 订单确认页面( o1 i8 Z; b H6 @4 F `
订单确认页面中部分静态模块实现以及接口功能实现& p1 X q) m; S7 I7 T2 N
3 u% ^# N4 c7 E6 y
12-1 订单父组件结构封装6 h5 Q; c( I3 O
12-2 地址和商品数据加载
12-3 地址删除功能实现" v* L% l5 I3 Z0 U0 H0 a
12-4 新增地址表单静态实现
12-5 新增地址交互实现
12-6 地址编辑和订单提交1 U) i/ H- N% z0 T# [" H" ~2 ?% f
第13章 订单结算2 n A4 R; O3 }) {' o$ ~7 d& L
主要讲解订单结算交互实现,同时包含微信支付和支付宝支付同后台对接
13-1 订单详情数据加载( ^3 K" m5 a( u0 K, M8 v4 r$ X
13-2 支付宝支付对接( G2 j' r: T/ d, f" I
13-3 微信支付对接6 F" b- g- U8 s+ ~4 u
13-4 微信支付状态轮询1 ?+ Q4 C3 I3 w, L, t( }2 R
第14章 订单列表
介绍了订单列表的数据渲染和分页功能实现
2 P( W" o! S0 {5 U1 i
14-1 调整Order父组件结构; t- b5 p5 v+ {; a9 G
14-2 订单列表数据渲染4 F' e. N" L# y
14-3 Loading和NoData优化6 f7 \: y- n* g3 b9 \* g
14-4 订单列表分页-分页器
14-5 订单列表分页-加载更多
14-6 订单列表分页-滚动加载
第15章 上线部署: `" |; a* Q' Q/ R. F/ K
代码打包和线上环境部署
15-1 保留分页器6 r3 e9 N$ ^7 M+ Q# T8 _3 Y! X" O
15-2 vue.config配置介绍
15-3 路由按需加载方案(1)
15-4 路由按需加载方案(2)
15-5 删除预加载-真正按需
15-6 服务器部署准备工作- ?' ?! x- J4 h5 w0 v' q' r
15-7 Nginx安装和配置7 m5 M; Q2 {9 F3 n1 F% u
15-8 Node环境搭建% O4 W* I. R4 \ W
15-9 项目部署- _$ E6 U' O6 m% a O
第16章 课程总结
课程整体内容总结9 J9 B# O7 d+ E l z
16-1 课程总结
【下载地址】
|
|