收藏

ES6+ 开发电商网站的账号体系 JS SDK

覆盖ES6+语法新特性,纯原生JS开发,强化基本功!

ES6+ 开发电商网站的账号体系 JS SDK

难度 中级 时长 13小时 学习人数 244 综合评分 9.40
  • 第1章 课程简介 1 节 | 13分钟

    本章主要对整个课程的内容进行简要介绍,包括前置知识简介、章节安排、代码效果展示等,会从大的方面对ES6+在实战中的意义进行介绍和比较,让你对课程有一个初步印象

    收起列表

    • 视频: 1-1 课程导学 (12:39)
  • 第2章 ES6+实战所需要的环境 6 节 | 31分钟

    本章主要介绍ES6+实战中必备的两个工具:Babel和webpack,以及工程化中脚手架工具的重要性和意义,介绍html-bundler这样一个脚手架工具(后面实战会用到)

    收起列表

    • 视频: 2-1 ES6浏览器支持情况 (01:59)
    • 视频: 2-2 webpack讲解与示例 (03:36)
    • 视频: 2-3 Babel讲解与示例 (05:32)
    • 视频: 2-4 html-bundler具体用法 (08:55)
    • 视频: 2-5 环境准备 (08:59)
    • 视频: 2-6 本章小结 (01:38)
  • 第3章 需求分析与架构设计 4 节 | 37分钟

    本章讲解为什么要进行这样的设计,以及前端开发从需求分析、总体设计到模块设计再到代码编写的整个过程,进行思路的梳理,以及SDK常用开发套路的介绍

    收起列表

    • 视频: 3-1 .需求分析 (08:59)
    • 视频: 3-2 架构设计 (11:52)
    • 视频: 3-3 业务模块demo (08:20)
    • 视频: 3-4 公共模块demo (07:02)
  • 第4章 最常用ES6语法讲解以及课程环境搭建 6 节 | 52分钟

    本章主要对后面用到最多的几个ES6+语法进行前置讲解,包括import和export,let和const,箭头函数等。使用html-bundler搭建课程环境,讲解一些webpack和babel一些最新的相关插件和配置

    收起列表

    • 视频: 4-1 创建项目 (13:24)
    • 视频: 4-2 真实环境安装小结 (03:27)
    • 视频: 4-3 import & export讲解1 (08:35)
    • 视频: 4-4 import & export讲解2 (06:54)
    • 视频: 4-5 let&const 讲解 (10:48)
    • 视频: 4-6 箭头函数讲解 (08:08)
  • 第5章 登录模块开发-骨架及渲染部分 8 节 | 56分钟

    本章开始进行登录模块开发,主要讲解模块骨架搭建和视图渲染部分,并在项目中讲解ES6+中的Object.assign, 模板字符串等语法。介绍消除浏览器自带自动填充的技巧

    收起列表

    • 视频: 5-1 业务开始 (09:04)
    • 视频: 5-2 Object.assign (05:05)
    • 视频: 5-3 export (05:44)
    • 视频: 5-4 模板字符串 (07:34)
    • 视频: 5-5 基本模板和自动补全1 (15:27)
    • 视频: 5-6 自动补全2 (06:59)
    • 视频: 5-7 getID (04:21)
    • 视频: 5-8 渲染结束 (01:39)
  • 第6章 登录模块开发-表单验证/事件/请求部分 9 节 | 68分钟

    本章主要讲解登录模块中的事件绑定/表单验证/向服务器请求数据/前端数据Mock等内容,结合项目讲解ES6+中的async和await, Array.from, Promise 等API,以及新版浏览器的fetch API。并且对async和await,Promise, fetch之间的关系及结合使用进行了讲解...

    收起列表

    • 视频: 6-1 选取元素 (02:04)
    • 视频: 6-2 import和export时的重命名 (02:04)
    • 视频: 6-3 建好骨架 (04:08)
    • 视频: 6-4 fetch, async&await (19:04)
    • 视频: 6-5 promise讲解 (10:13)
    • 视频: 6-6 await使用注意 (01:42)
    • 视频: 6-7 表单验证 (18:38)
    • 视频: 6-8 表单验证展示 (06:10)
    • 视频: 6-9 登录结束 (03:01)
  • 第7章 注册模块开发 - 手机号注册部分 11 节 | 113分钟

    本章主要讲解注册模块中的手机号注册,活人验证部分,讲解活人验证的原理和实现,结合项目讲解ES6+中的class、Symbol等语法点。

    收起列表

    • 视频: 7-1 活人验证原理介绍和搭建骨架 (08:40)
    • 视频: 7-2 第一步的模板 (05:16)
    • 视频: 7-3 活人验证骨架搭建 (09:42)
    • 视频: 7-4 symbol语法讲解1 (07:05)
    • 视频: 7-5 symbol&class语法讲解2 (12:18)
    • 视频: 7-6 滑块界面渲染部分 (05:13)
    • 视频: 7-7 验证滑块整体完成(1) (09:22)
    • 视频: 7-8 验证滑块整体完成(2) (08:07)
    • 视频: 7-9 调用验证滑块 (14:30)
    • 视频: 7-10 完成第一步手机号提交 (17:30)
    • 视频: 7-11 完成第二步手机号验证 (14:57)
  • 第8章 注册模块开发 - 个人信息部分 10 节 | 93分钟

    本章主要讲解注册模块中的个人信息填写部分,包括表单验证、省市区三级联动插件等技术点,结合项目回顾之前讲到的ES6+中的class、Symbol、async/await等语法点。

    收起列表

    • 视频: 8-1 开始 (02:59)
    • 视频: 8-2 模板渲染 (10:11)
    • 视频: 8-3 .字符串unicode支持讲解 (09:55)
    • 视频: 8-4 .正则表达式unicode支持讲解 (06:23)
    • 视频: 8-5 . 正则unicode在表单验证业务中的运用 (08:44)
    • 视频: 8-6 . 搭建省市区三联插件框架1 (10:52)
    • 视频: 8-7 . 搭建省市区三联插件2 (20:36)
    • 视频: 8-8 . 完成省市区三联框架3 (06:48)
    • 视频: 8-9 . 三联插件中新的语法点 (05:58)
    • 视频: 8-10 . 完成注册用户信息流程 (10:06)
  • 第9章 注册模块开发 - 支付方式绑定和整体串联部分 4 节 | 50分钟

    本章主要讲解注册模块中的支付方式绑定,将整个注册流程串起来并回顾注册流程中涉及的技术点。

    收起列表

    • 视频: 9-1 绑定支持方式 (16:48)
    • 视频: 9-2 绑定支付方式完成 (07:05)
    • 视频: 9-3 如何在单页应用中使用SDK (15:54)
    • 视频: 9-4 如何在react中使用sdk (09:12)
  • 第10章 账号设置模块开发 8 节 | 99分钟

    本章主要讲解账号设置部分,包括收货地址管理、安全设置、个人资料编辑,对之前一些大的语法点进行巩固和复习,穿插一些小的记忆性API。

    收起列表

    • 视频: 10-1 用户资料页设置01 (02:57)
    • 视频: 10-2 用户资料页设置02 (08:42)
    • 视频: 10-3 改造省市区插件 (07:42)
    • 视频: 10-4 收货地址设置-模板 (17:52)
    • 视频: 10-5 收货地址设置 (17:06)
    • 视频: 10-6 收货地址管理-事件绑定01 (09:16)
    • 视频: 10-7 收货地址管理-事件绑定02 (18:08)
    • 视频: 10-8 安全设置页面 (16:38)
  • 第11章 密码找回模块开发 3 节 | 42分钟

    本章主要讲解密码找回部分的开发,包括手机号找回和邮箱找回,对之前一些大的语法点进行巩固和复习,穿插一些小的记忆性API。

    收起列表

    • 视频: 11-1 重置密码_1 (17:18)
    • 视频: 11-2 重置密码_2 (15:50)
    • 视频: 11-3 课程回顾 (08:23)
  • 第12章 整体串联和总结 11 节 | 100分钟

    本章会讲解开发完成的SDK如何落地在下游业务上构成一个完整的流程,并对整个项目进行回顾与总结,包括项目中用到的ES6+语法点、SDK开发的套路、账号体系的前端业务等

    收起列表

    • 视频: 12-1 课程总结(ES6+) (08:08)
    • 视频: 12-2 课程总结(开发流程与设计方法) (06:14)
    • 视频: 12-3 课程总结(真实环境搭建) (06:13)
    • 视频: 12-4 html-bundler介绍(1) (15:47)
    • 视频: 12-5 html-bundler介绍(2) (11:28)
    • 视频: 12-6 课程总结(语法应用一) (09:41)
    • 视频: 12-7 课程总结(语法应用二) (06:28)
    • 视频: 12-8 课程总结(语法应用三) (08:22)
    • 视频: 12-9 课程总结(语法应用四) (03:35)
    • 视频: 12-10 课程总结(SDK开发要点) (12:01)
    • 视频: 12-11 课程总结(账号体系开发要点) (11:36)
本课程已完结


讲师

大渔老师 Web前端工程师

BAT资深研发工程师, 前端方向,先后在创业公司、CSDN、BAT任职, 曾著有《CSS高效开发实战》,曾经作为stuq讲师出品过《riot js前端框架入门》, 《从零到一Hybrid APP开发实践》等直播课程。有iSlider等star数上千的开源项目。

课程预览

检测到您还没有关注慕课网服务号,无法接收课程更新通知。请扫描二维码即可绑定
重新观看
意见反馈 帮助中心 APP下载
官方微信

学习咨询

选课、学习遇到问题?

扫码添加指导老师 1V1 帮助你!

添加后老师会第一时间解决你的问题