ES6 是 JavaScript 新的语法规范，让代码更规范、可读性高、方便操作。本周将开启 ES6 的学习，这是学习前端必备的一步。掌握 ES6 相关知识后，能够更便捷的编写代码，提高开发效率。

1. 1、ES6 基本语法与使用
2. 2、掌握 ES6 中变量和常量的使用与区别
3. 3、学习可以嵌入表达式的字符串字面量-模板字符串
4. 4、掌握箭头函数的特点与应用
5. 5、掌握如何自动解析数组或对象中的值
6. 6、了解对象字面量更加简洁与灵活的表达方式
7. 7、掌握参数默认值的使用

本周将继续学习ES6的基础，通过进一步学习ES6引入的新特性，了解ES6的新方法，掌握新的集合类型，更深入的了解数据的遍历。

1. 1、剩余参数与展开运算符的对比进行学习 2、了解如何实现减少逻辑或操作符的使用 3、认识ES6中新增的数据结构 4、了解ES6中新增的方法 5、了解遍历原理，以及学习新的循环方式

Promise 和 Class（类）是 ES6 中非常重要的知识点。Promise 是异步编程的一种解决方案，比传统的回调函数更合理和更强大。Class（类）来作为对象的模板使用，强化面向对象的使用。

1. 1、学习如何高效解决回调地域问题
2. 2、了解如何运用 ES6 Promise 进行异步编程
3. 3、掌握 Class 基本语法的使用
4. 4、掌握更加清晰与便捷的对象继承方式
5. 5、掌握更高级的面向对象编程思想

ES6 在语言标准的层面上，实现了模块功能。可以实现将一个大程序拆分成互相依赖的小文件。而 Babel 的使用，完美的解决了 ES6 的兼容性问题，让 ES6 有更多可能性，使前后端差异越来越小。

1. 1、了解企业级的开发形式——模块化的使用
2. 2、学习将一个复杂的功能拆分，从而提高复用率
3. 3、了解如何更好的维护代码
4. 4、掌握 Babel 转换器的使用，解决 ES6 的兼容问题
5. 5、学习如何将 Webpack 与配合 Babel 使用，完成更高效的开发
6. 6、掌握 Webpack 项目构建配置

本周将开启前后端数据交互的学习，来理解前后端开发的区别，了解网络通信的相关概念，并对与后台通信、获取数据有一个初体验。概念比较抽象，先作为了解。在后面项目开发环节，随着对知识的运用，对概念会有更深一步的理解。

1. 1、了解如何区分前后端
2. 2、理解 HTTP 协议，熟悉网络通信相关概念
3. 3、学习本地存储的多种方式，了解数据缓存机制
4. 4、了解 JSON 数据的几种书写格式
5. 5、熟悉原生 Ajax 请求流程与细节
6. 6、掌握常见的跨域技巧
7. 7、学习如何自己封装 Ajax
8. 8、了解基于 promise 的Ajax 插件——Axios

组件化开发是一种高级编程思想，适用于团队协作开发，是企业中常见的一种开发模式。本周会使用组件化方式来完成“仿穷游商城首页”的重构。掌握组件化开发能够更好的促进团队协作，提高开发和调试效率，可维护性更高。

1. 1、综合运用 H5/CSS3/ES6 等知识，使用“组件化的开发思想”重构旅游网首页
2. 2、了解项目组件化划分方式
3. 3、了解模块化与组件化区别
4. 4、采用模块化与组件化结合的开发方式
5. 5、使用 Webpack 构建项目
6. 6、运用 art-template 模板引擎，高效开发
7. 7、真实的数据接口，实现前后台联动
8. 8、通过自己封装的 Ajax 向后端请求数据
9. 9、使用 Class、Module 模块完成轮播图的基类，实现模块化，提高复用率

移动开发基础是进行 WebApp 开发第一步。本周将开启前端学习的新篇章。通过移动端基础知识的学习，能够独立实现适配不同移动端终端的页面。

1. 1、了解移动基础概念
2. 2、了解移动端屏幕、移动端浏览器、操作系统的不同
3. 3、掌握 Flex 布局的使用
4. 4、掌握移动端常用的 rem 和 vw 适配方案
5. 5、学习流体布局的使用

移动端高质量的开发，是移动端开发的必备技能。本周继续移动端的学习，学习移动端的事件、开发中的常见问题，以及如何使项目的性能更加优化。

1. 1、掌握移动端常用的 touch 事件
2. 2、掌握 Grid 网格布局
3. 3、学习响应式布局
4. 4、移动端开发中常见的问题
5. 5、学习如何从 HTML、CSS、JavaScript 三方面优化性能

接下来的一周，我们将迎来 WebApp 项目的开发，实现从 PC 端开发迈向移动端。从项目分析、组件划分、结构搭建、功能实现、性能优化。体验真实企业中移动端项目的开发流程

1. 1、综合运用 H5/CSS3/ES6/移动知识，重构旅游网 WebApp 的首页、目的地页
2. 2、符合企业标准的开发流程，从项目分析、项目搭建、模块开发到数据对接
3. 3、采用模块化与组件化结合的开发方式
4. 4、使用 Webpack 构建项目
5. 5、运用 art-template 模板引擎，高效开发。
6. 6、完成 18 个典型组件开发（搜索、商品、导航等组件）
7. 7、运用 Swiper 高效移动端插件开发轮播图
8. 8、使用 Ajax 处理与获取数据
9. 9、如何处理多次请求的解决方案
10. 10、如何运用组件化思维，拆分和复用组件
11. 11、完成各组件性能的优化

本周开始学习爆火的轻应用开发技术——小程序 。通过对小程序知识的学习，能够独立开发企业级小程序，拥有解决主流小程序功能需求的能力。

1. 1、大项目：结合 Flex/Template 模板，开发慕课小程序首页/活动页/热门排行页
2. 2、了解小程序注册流程/注册方式/注册主体
3. 3、掌握小程序的全局生命周期和页面级生命周期
4. 4、掌握小程序基础语法与常用 API
5. 5、掌握小程序开发工具的调试办法
6. 6、掌握小程序多页面下的开发工作流及目录结构

Vue.js 是企业开发另一热门框架，易用、灵活、高效，对于初学者很友好。本周通过对 Vue.js 基础和 Sass 布局技术的学习，为后续的全栈项目开发打下基础。

1. 1、掌握 Webpack 项目构建配置
2. 2、掌握基础语法与常见 API
3. 3、组件的使用及组件的生命周期
4. 4、Axios 网络请求及路由使用
5. 5、Vuex 的引入、应用场景及项目中的实现
6. 6、使用 Vue.js 技术栈进行项目开发的方式方法
7. 7、掌握 Sass 布局基础

从本周开始进入到电商全栈项目开发，首先使用 Vue.js 前端实战的第一部分首页和商家详情页，还原实际开发流程，综合运用所学知识，完成页面开发，掌握开发中常见问题解决技巧。

1. 1、综合运用 Sass 和 Vue.js 完成登录页/注册页/首页/商家详情页
2. 2、使用 vue-cli4.0 创建开发环境
3. 3、使用 axios 发送 Mock 请求
4. 4、使用路由守卫实现基础登陆校验功能
5. 5、动态路由 / 异步路由与组件拆分复用
6. 6、首页 / 商家详情页数据渲染
7. 7、Vue.js 项目中常见问题的解决方案

Vue.js 前端项目实战的第二部分，实现电商核心业务订单和地址管理模块，掌握开发中常见问题解决技巧，真实数据访问，开发完整的 Vue.js 电商前端项目。

1. 1、综合运用 Sass 和 Vue.js 完成订单提交页/地址列表页/地址编辑/地址新建页
2. 2、使用 axios 发送 Mock 请求
3. 3、动态路由/异步路由与组件拆分复用
4. 4、订单提交页/地址列表页数据渲染
5. 5、Vue.js 项目中常见问题的解决方案
6. 6、步骤大作业：完成订单列表页和购物车列表页开发

学前端不止于前端，从本周开始学习服务端基础知识，掌握什么是服务端以及服务端必备 Node.js，夯实基础，迈进前端全栈开发。

1. 1、案例：搭建 Node.js 服务器及创建 MongoDB 数据库
2. 2、了解什么是服务端，服务端与前端的关系
3. 3、掌握 commonjs 模块化与 npm 插件使用
4. 4、掌握 inspect 调试方法

真实企业开发离不开数据库，Koa2 框架有效的提高开发效率，本周掌握前端必备的前端全栈开发知识，为后面开发全栈项目蓄力。

1. 1、了解 koa2 中间件与洋葱圈模型
2. 2、了解关系型数据库与 MongoDB 基础 API 详解
3. 3、掌握 Node.js 操作 MongoDB 方法与 mongoose 规范数据模型

本周开始进入到电商全栈项目的后端开发，对标企业标准开发流程。从登录实现方案、项目需求分析、接口和数据结构设计到业务开发，帮你打通前后端任督二脉，突破全栈技术瓶颈，为就业加码。

1. 1、综合运用 Node.js+koa2+MongoDB，实现电商全栈项目的后端
2. 2、掌握企业的开发流程与技巧，从 0 到 1 一步步实现
3. 3、项目采用前后端分离开发模式
4. 4、核心业务的数据库设计与实现
5. 5、真实数据接口和设计与实现
6. 6、Koa 工作流程及常见 Koa 中间件使用
7. 7、掌握前后端数据联调技巧，打通前后的数据交互
8. 8、常见 MongoDB 与 Nodejs 集成
9. 9、了解 cookie 和 session 的关系
10. 10、大作业：订单和购物车列表页的数据库和接口设计

TypeScript 和 React.js 是企业开发热门框架之一 。通过对 TypeScript 和 React.js 基础的学习，为后续的旅游项目开发打下基础。

1. 1、理解 JSX 语法与编程思想 React UI 渲染原理
2. 2、掌握模块化样式加载与事件处理
3. 3、了解 TS 编译流程及配置 TS 编译器
4. 4、掌握副作用钩子使用及其作用
5. 5、掌握类组件与高阶组件解决交叉问题
6. 6、了解并掌握类组件于函数式组件区别于应用
7. 7、掌握组件间数据传递及组件的生命周期

使用 TS + React 进行「欢乐购」项目的开发，及最终实现 Git 部署和 Gulp 工程化，掌握构建企业级项目和解决核心业务问题的能力，快速接入企业项目。

1. 1、综合运用 TypeScript 和 React.js 项目的前端页面
2. 2、包括闪屏、登录&注册功能开发、首页基础业务模块开发及倒计时&更多功能开发、商品内容搜索（热门搜索、历史搜索及删除功能）及搜索列表页开发、附近门店（定位功能）及门店切换功能开发。

面试是通往成功就业的关键一步，本周包含布局基础以及 JS 和 ES6 等常见考点和经典面试题分析，带你把知识串成线，掌握前端面试技巧，顺利通关基础技能面试。

1. 1、H5 语义化/CSS布局/定位/图文样式/响应式面试解题技巧
2. 2、原型和原型链的5个原则与面试解题技巧
3. 3、变量类型/计算/构造函数的面试解题技巧
4. 4、作用域和闭包的执行上下文/this面试解题技巧
5. 5、异步和单线程/常见的内置对象面试解题技巧
6. 6、DOM 本质/节点操作/BOM操作面试解题技巧
7. 7、AJAX 与事件解面试题技巧

框架、小程序以及全栈相关内容也是面试必考。本周带大家梳理的常见考点和经典面试题分析，理清面试解题方法论，完成最后一厘米的冲刺。

1. 1、Vue.js 原理/MVVM 面试解题技巧
2. 2、组件生命周期/父子组件传值面试解题技巧
3. 3、组件异步加载/缓存/抽离公共逻辑面试解题技巧
4. 4、vue-router/data 监听面试解题技巧+5道 Vue.js 真题演练
5. 5、React 基础语法/事件面试解题技巧
6. 6、React 组件生命周期/父子组件通讯面试解题技巧
7. 7、React 函数组件与 class 组件区别面试解题技巧
8. 8、Redux/react-router 面试解题技巧
9. 9、简历制作指导、投递与面试流程与技巧

结合最新技术栈，vue3.2+vite4+ant-design-vue 组件库完整的管理后台业务，包括：登录、权限、小慕读书电子书上传、管理、解析等，基于 NestJS 最新后端框架的企业级后端项目开发

1. 1. 学习管理后台前端框架 vben 的下载、启动、运行模式及进阶特性，以及 vite 插件原理
2. 2. 实现 NestJS 框架快速入门，掌握其核心组件 Controller、Provider 的应用，以及 Restful API 开发与调试
3. 3. 完成管理后台后端数据库接入，包括业务模块设计、NestJS 连接MySQL、数据库实体创建及表关联查询逻辑实现
4. 4. 进行登录功能的前后端开发，涵盖源码分析、接口设计、密码校验、 JWT 应用及前后端联调等
5. 5. 开展菜单权限相关开发，涉及原理分析、前端动态路由改造、菜单数据 API 开发及页面功能实现与优化
6. 6. 完成电子书相关功能开发，包括列表展示、上传、解析、新增、详情、编辑和删除等功能的前后端实现
7. 7. 推进高级权限功能开发，包含用户、角色、权限管理模块及角色与菜单关联等功能的设计与实现

React18 的颠覆级更新不在于新的 API，而在于底层渲染机制的变化，本课程带你深入了解并发渲染（concurrent rendering）的原理，使用，和如何升级老项目。

1. 1、剖析企业级项目的用户需求、角色，以及标准项目流程
2. 2、探讨优质需求文档标准、项目功能点拆解与合理前端排期
3. 3、根据需求分析进行技术选型
4. 4、掌握 MAC 开发工具，完成 NodeJS、pnpm、VSCode、MySQL 安装及 mysql workbench 使用
5. 5、学习后端编程思想，掌握 NestJS、数据库模型设计、TypeORM 及 GraphQL 相关操作
6. 6、实现前端项目初始化，掌握 React Hooks 等通用能力建设。
7. 7、进行 PC 管理端登录注册、门店、课程等模块开发，包括页面编写、接口开发、功能优化等
8. 8、完成项目的部署上线