WEB前端进阶课思维导图模板_ProcessOn思维导图、流程图

第7模块：微信公众号开发

微信公众号开发实战

微信公众号介绍、申请、服务端接入

如何让自己成为开发者

微信消息管理、自动回复文本、图片、语音、音频等功能实现

消息管理中间件co-wechat的使用

如何获取accessToekn、并保证它的有效性

自定义菜单功能实现

使用co-wechat-api快速开发自定义菜单

章节特色

如何接入微信公众号平台

如何更有效的管理菜单

封装自己的公众号开发模块

第8模块：混合式APP开发

React-native全家桶

React-nactive vs 传统ios和Andriod开发模式

React-native 核心API和组件实战

React-native 网络请求

Redux管理数据

React-navigation 管理路由

ant-design-mobile的React-native版本

单页应用

Redux管理数据

React-router路由

移动APP版实战和发布

React-Native开发豆瓣电影项目实战

使用RN搭建项目架构

使用React-navigation实现路由导航、404跳转

优化页面二次打开

配合Redux、Redux-thunk、Redux-saga实现数据的状态管理

使用Redux-logger实现状态跟踪

使用Redux-persisit实现数据持久化

项目性能优化：首屏优化、交互优化、长列表优化、动画优化

构建自己的Android和IOS原生应用

项目发布上线、真机测试等流程

章节特色

前端工程师如何使用RN开发原生APP

混合Hybrid应用是什么

如何构建自己的Android和IOS原生应用

第9模块：web安全护航

Web安全

安全意识与常见的Web项目相关的漏洞原理解析与防御

XSS漏洞

CRSF漏洞

SQL注入

Cookie安全策略

点击劫持

传输安全和HTTPS加密

错误监控收集

处理异常日志的正确姿势

Sentry在项目中实战

章节特色

在安全领域中前端可以做什么

常见的web安全漏洞有哪些

如何构建更安全更保障的web应用

第10模块：WEB工程化

前端工程化

前端工程化发展史

前端生态工具webpack、Babel、ESlint

webpack入门

entry

output

loader

插件 plugins的使用

模块解析

热替换

Webpack进阶

Babel进阶和编译优化处理

代码审查进阶

错误监控收集

从0到1使用webpack打造自己的脚手架工具

章节特色

常见的webpack插件的作用

如何定制自己的webpack插件

如何使用Git Hooks校验代码质量

现代的前端工作流是怎么样的

第11模块：自动化测试

单元测试

业务驱动开发 VS 测试驱动开发

黑盒测试和白盒测试

测试覆盖率

前端项目的单测集成

Node项目的单测集成

端与端测试

前端e2e测试

章节特色

黑盒和白盒测试是什么

Vue中如何做单元测试

React中如何做单元测试

压力测试如何去做

第12模块：前端性能优化

性能指标

业务场景

性能指标

性能报告和分析

性能优化范畴

浏览器解析

资源加载和利用

浏览器存储

Nginx调优

前端代码优化

BOM/DOM交互优化

常见写法优化

浏览器原理

webkit内核原理剖析

章节特色

如何找出系统中的性能瓶颈

常见性能优化策略

如何设计缓存机制

在Vue和Reac内部如何做性能优化

如何做搜索引擎优化SEO

第13模块：专业必备技能提升

数据结构和算法入门

算法基础

算法复杂度

排序算法

递归算法

搜索算法

数据格式

数组

链表

树

二叉树

图

前端设计模式

学习设计模式的重要性和必要性

工厂模式

单例模式

装饰器模式

代理模式

观察者模式

设计模式应用实战

常见经典面试题精讲

其他

职场素养

沟通表达

团队合作

目标管理

时间管理

心态管理

就业指导

笔试和面试技巧

第1模块：JavaScript基础+进阶(选修)

JavaScript基础

变量

数据类型

流程控制

函数

JavaScript常用内置对象

数组Array

字符串String

对象Object

日期对象Date

数学对象Math

正则表达式RegExp

定时器

DOM

重点理解什么是DOM、节点树

常用节点属性和节点方法

获取元素节点的方式

样式设置

BOM

window对象的常用属性和方法

location对象的常用属性对象

JavaScript交互特效案例实战

衣服相册切换

关闭小广告

百度换肤

千千音乐盒实现全选和反选

表单验证

上传图片验证

随机验证码校验

发布评论

日期特效

数字时钟

长图滚动

JavaScript事件

理解什么是事件流、事件冒泡、事件捕获

DOM0级、DOM2级事件、IE事件处理

事件对象的常用属性

事件代理的应用

阻止事件冒泡和默认行为

运动框架封装

匀速运动

缓动运动

透明度动画

多物理动画

链式动画

同时运动

JavaScript进阶

函数

函数调用模式

函数参数

apply、call、bind应用

作用域

预解释

执行上下文

程序执行流和执行环境

作用域链

闭包

正确理解闭包

常见闭包问题注意点

闭包的10种应用

this指向

this的默认绑定规则

this的隐式绑定和隐式丢失的情况

this的显示绑定

new绑定this指向

严格模式下this如何指向

面向对象编程

理解原型对象、prototype和constructor

创建对象的5种模式，并分别对比他们的用途

实现继承的5种方式，并重点理解原型链继承和组合式继承

Object对象的相关方法

深浅拷贝的用法

前端模块化

Ajax技术

第2模块：ES6精讲

let和const

解构赋值

Symbol

Map和Set

Reflect和Proxy

字符串、数字、对象、数组

强大的函数

迭代器

Promise对象

Generator函数

async 函数

class 类

模块 module

装饰器

第3模块：Vue.js 全家桶实战

Vue进阶和组件化开发

官方脚手架Vue-cli3及相关配置/Typescript/Eslint

vue-devtools开发调试插件

详讲Vue模板语法基础

如何编写自定义指令

组件化实战：如何编写高质量UI组件

组件化实战：普通组件和高阶组件的区别

生命周期钩子函数详解

生命周期钩子函数应用

Vue组件通信机制

内容分发Slot

计算属性 VS watch

事件处理

ES6 Promise处理异步操作

ES7 异步终极解决方案 Async + await

Vue的常用UI组件库实战

Vue 生态圈UI组件库选型对比：Element-ui、Vux、iview、Mint-UI、Cube-ui

常用UI组件布局

常用UI组件：弹窗、数据表格等

UI组件库基础：Vue动画特效初探、表单处理和验证

UI组件库实战

手写：从0到1封装自己的表单组件

Vuex状态数据管理实战

组件数据传递 vs Vuex

核心组件之State

核心组件之Getter

核心组件之Mutation

核心组件之Action

核心组件之Module

中小型项目与大型项目中Vuex的数据流设计

项目中如何做数据持久化

手写Vuex、理解内部原理

Vue-router单页SPA实战应用

掌握多页应用MPA和单页应用SPA的区别

掌握前端路由的实现原理

前端路由设计的优点

路由管理

嵌套路由

命名路由

动态路由匹配

路由重定向

history模式和Hash模式

路由懒加载

Vue路由守卫原理

路由权限控制

手写自己的vue-router

Vue全家桶+webpack大型商城项目实战

项目背景

项目架构分析

项目选型UI组件库

Vue组件化模块设计

Mock Server模拟数据接口

路由权限控制在项目中体现

Vuex 数据流体系设计

项目优化、上线、打包操作流程

项目部署

Typescript 在vue中实战

TS核心

强类型

基础类型

接口

泛型

装饰器原理与实践

Vue进阶

Vue Hooks实战

性能优化

自动化测试 karma + mocha + chai

devtools

服务器渲染SSR

Nuxt.JS从入门到放弃

掌握Vue的MVVM响应式原理

模拟Vue.js实现自己的MVVM框架MVue

响应式机制

依赖收集

监听器管理

模板编译

实现代理proxy

数据双向绑定

Vue源码解析

Vue.js源码构建

new Vue发生了什么

Vue 实例挂载实现

Virtual DOM 虚拟DOM实现

模板编译+代码生成

Vue源码内部优秀的设计思想

章节特色

如何设计一个易用可扩展的组件，领会组件化开发思想

如何仿照Element-ui源码，设计自己的组件库

如何在Vue中管理复杂的数据流

掌握Vuex内部的原理

掌握Vue-router内部原理

如何在vue中使用懒加载做性能优化

Vue开发复杂应用的最佳实践

项目中如何做技术选型

Vue原理深度剖析

第4模块：React 全家桶实战

React 16.8入门到进阶

React官网脚手架Creart-react-app实战

JSX是什么

虚拟DOM原理挖掘

JSX常用模板语法

setState状态管理

React组件化思想

组件通信时参数传递和校验

React表单处理

React数据表格

React动画特效

React生命周期钩子

React中的普通组件和高阶组件HOC

React Fibler 架构剖析

React 新功能之Hooks实战

Ant-design组件库

React 常用UI库对比与选型

And-design入门

布局组件

弹窗组件

表单组件分析+设计

手写源码：设计属于自己的表单组件

Redux状态数据管理

组件传递 VS Redux

单向数据流和双向数据绑定

核心组件之Action

核心组件之Reducer

核心组件之Dispatch

React-redux连接Redux和React

React-redux核心组件Provider和connect

middleware中间件剖析

Redux-thunk中间件处理异步任务

手写Redux源码

手写thunk异步中间件

React-router 单页应用

路由管理

路由和组件

路由重定向

路由的权限设计

生命周期

路由懒加载

Redux终极解决方法Dva

目前最流行的数据流方法

Dva是什么

Dva之Generator

Redux-saga中间件应用

React企业级开发框架Umi

umi入门

约定式路由

配置式路由

权限路由

Hash路由

Mock数据模拟

路由懒加载

umi+dva+antd实战操作

服务器渲染SSR

React中服务器渲染SSR

轻量级的 React 服务端渲染应用框架 next.js

React企业级后台管理项目实战

掌握使用create-react-app脚手架初始化react项目开发

前后台分离的后台管理的SPA, 包括前端PC应用和后端应用

包括用户管理 / 商品分类管理 / 商品管理 / 权限管理等功能模块

前端: 使用React全家桶 + Antd + Axios + ES6+ + Webpack等技术

后端: 使用Node + Express + Mongodb等技术

采用模块化、组件化、工程化的模式开发

掌握项目优化、打包、上线等流程

React原理剖析

火热的0配置的打包工具parcel

ReactDom.render原理剖析

掌握虚拟DOM原理

React.Component基类实现

render实现

组件渲染实现

生命周期方法实现

diff算法对比、对比策略

异步的setState实现

setState内部队列机制

React虚拟DOM原理剖析

章节特色

真实DOM和虚拟DOM对比

JSX到底是什么

React Fiber架构到底是什么

HOC高阶组件灵活运用，设计属于自己的表单组件

React新功能Hooks实践应用

React和Vue框架对比

React单向数据流架构分析

如何在React中管理数据流

Redux中间件机制

React-router4是什么

如何在路由系统中使用懒加载做性能优化

Redux-saga中间件是什么

Dva是什么

真实DOM和虚拟DOM对比

第5模块：打通任督二脉 Node.js

Nodejs核心入门

非阻塞IO

事件驱动

常见并发方式对比

模块CommonJS

Nodejs内建模块

第三方模块

自定义模块

核心API

fs/buffer/http/stream模块

实现一个简易迷你express框架

Nodejs 异步

Promise应用异步

co模块解决

async/await应用

异步fn/client/server

cb

Event-loop

Nodejs 线程和进程

进程和线程

Cluster

IO和网络编程

Nodejs IO (fs/net/stream)

io & 网络层 WebServer

4、7层协议

http2.0

https

常见数据库、缓存

MySQL

MonogoDB

Redis

爬虫项目数据持久化

鉴权

cookie认证

token+jwt

第三方登录Oauth2

github

web框架之路

Koa2 实战

中间件原理

模板引擎

resetful的api设计

eggjs和koa区别

MVC分层

中间件

插件编写

定时任务

本地开发、调试、单元测试

ORM框架 sequelize

RESTful API设计接口的原则

鉴权

基于koa2开发项目实战CMS

使用koa作为基础框架,整合了koa-router作为基础路由框架,并提供Router进行权限管理

整合Vue.js作为前端框架，纯前后端分离的CMS项目开发

整合validator.js作为参数校验库

整合了mongoose框架，方便进行非关系数据库操作。

项目中实现错误处理中间件middleware

整合了jsonwebtoken框架，并提供了access_token和refresh_token的令牌机制

提供了配置、日志、权限等诸多基础功能，当然得益于 koa 的生态，你也可以使用任何其它三方库

koa和egg源码剖析

手写koa2源码，带你从0到1实现

手写中间件机制

仿照eggjs从0到1搭建自己的MVC框架

部署运维

Nodejs 部署和运维

Nginx

负载均衡

pm2

docker容器部署

章节特色

Node异步到底有什么优点

前端微服务是什么概念，如何设计

数据库设计范式是什么

Koa2框架的优点

Nodejs中进程和线程到底是什么

如何理解Nodejs中的流

Mongodb数据库如何使用，与Mysql的区别在哪里

如何设计MVC分层设计

什么是服务器渲染

掌握企业级项目开发流程

JWT前后端权限设计

如何用pm2部署线上Nodejs应用

如何使用Docker自动化部署全栈项目

第6模块：全栈小程序

微信小程序入门

小程序使用场景

开发环境搭建

小程序中Flex布局

常用小程序API:登录、扫码、支付、个人信息

常用小程序组件开发：轮播图、下拉刷新

开发自己的第一个小程序

小程序进阶

云开发实战

通过云开发构建自己的全栈小程序

云函数实现爬虫和登录

云存储

云数据库

云开发实现微信支付

云开发实现订单模块

小程序生态

类小程序应用：快应用/百度小程序/支付宝小程序

一套代码编译大厂商家小程序Taro/Mpvue

使用mobx管理小程序数据流

小程序坚果商城项目实战

小程序原生+Vant Weapp+云开发

首页、分类、购物车、个人中心页面实现

基于云开发数据库、云函数、模型设计

登录、支付、订单、地址功能实现

小程序上线发布流程实现

章节特色

小程序到底是什么

小程序、支付宝小程序、百度小程序、如何了解这些生态

小程序开发环境如何真假调试

如何使用React的语法开发小程序

如何使用Vue的语法开发小程序

小程序的云开发时什么操作和流程

如何上线自己的小程序应用

小程序和传统web开发的区别到底有什么不同

云开发实现微信支付