价值百万的全业务真实产品架构 支撑公司日常经营管理需求
数据埋点/运营管理/作品管理后台等业务需求+组件库/组件平台/脚手架等开发需求
全程遵循顶级大厂内部标准的产品开发规范
全过程对标大厂流程标准，能力向下兼容，中小厂同样适用
◆大厂前端编码规范
◆大厂多人协作流程规范
◆大厂前端研发流程规范
◆大厂git操作、构建流程和发布流程规范
◆大厂技术方案、需求、接口文档规范
便于团队成员了解工作、便于架构日常管理、便于新同事快速上手、便于部门积累工作经验
适合哪些人群？
在校大学生
刚刚毕业的技术小白
零基础想转行的非在职IT人员
有基础想转行的在职IT人员
希望得到技能提升的IT研发人员
课程涵盖“Web前端架构师”所有的应会必会技术栈
技术解决方案库 涵盖职场常见技术难题
- 基于前后端分离模式开发解决方案
- 基于Flex 的快速布局解决方案
- 基于token的前端登录解决方案
- 基于Webpack 前端工程化解决方案
- 基于vue-element-admin 二次开发解决方案
- 第三方登录前端解决方案
- 基于JWT 的接口鉴权解决方案
- 基于less 的 CSS 预处理解决方案
- 基于Mock.js 的响应式布局解决方案
- 基于ECharts.js 的大数据可视化解决方案
- 基于vuex-persistedstate状态持久化解决方案
- 基于TypeScript 的大型项目强类型语言开发解决方案
- 基于Vue2.0/Vue3.0技术栈开发解决方案
- 基于Element UI桌面端组件库开发解决方案
- 基于Express 的快速 Web 服务开发解决方案
- 基于React.js 全套技术栈 SPA 开发解决方案
- 基于Ant Design Mobile移动端组件库开发解决方案
- 基于Vue3.0封装组件库开发解决方案
- 基于UEditor 的富文本处理解决方案
- 基于ESLint 的代码规范质量解决方案
- 前端SKU解决方案
- 基于百度地图 API 的地图业务解决方案
- 基于Axios 的异步请求解决方案
- 基于vue3.0进行中大型项目开发解决方案
- 基于Git 的源代码管理解决方案
- 基于Vuex 的集中式状态管理解决方案
- 微信支付/支付宝支付 第三方支付解决方案
紧跟市场动态，捕捉企业需求，实时扩展技术点！
-
HTML/HTML5
常用浏览器以及内核
web标准
HTML语法规范
HTML基本结构标签
标签语义化
HTML常用标
相对和绝对路径
注释和特殊字符
表格和列表
HTML表单
HTML5新增标签
HTML5新增属性
-
CSS/CSS3
CSS语法规范
CSS选择器
CSS样式
元素显示模式
CSS背景
CSS三大特性
盒模型
浮动和清除浮动
CSS四种定位
精灵图和字体图标
CSS进阶
CSS3新增选择器和属性
-
移动web
2D&3D转换
视口
二倍图
物理像素和物理像素比
移动端技术选型
流式布局
Flex(伸缩)布局
媒体查询
Less(变量、嵌套、运算)
rem适配
Boostrap
响应式布局
-
JavaScript
JavaScript变量
数据类型和运算符
流程控制语句
循环(for、while、do while)
数组和冒泡排序
函数
作用域和预解析
对象和内置对象
WebAPI
面向对象编程
正则表达式
sessionStorage和localStorage
-
jQuery
jQuery常用API
jQuery选择器
jQuery链式编程
jQuery属性操作
jQuery遍历对象
jQuery事件绑定和解绑
jQuery多库并存
jQuery对象拷贝
图片懒加载
全屏滚动插件
瀑布流插件
ECharts.js
-
ES6/ES2015+
let、const、var的区别
解构赋值
箭头函数
剩余参数
拓展运算符
Array数组方法
Array实例方法
ES6模板字符串
startsWith、endsWith和repeat方法
set数据结构
Promise
async/await
-
网络请求与响
客户端与服务器
Ajax
Postman接口测试工具
art-template模板引擎
XMLHttpRequest
XML和JSON
封装Ajax函数
XHR Level2新特性
Axios
同源策略、跨域、JSONP
HTTP协议、请求、响应、状态码
防抖和节流
-
Nodejs
fs、path、http模块
模板化和模块加载机制
CommonJS
npm
开发npm包并发布
nodemon
node创建web服务器
Express
Express路由
中间件、中间件分类、自定义中间件
Express编写接口
cors、jsonp接口
-
数据库
常见数据库及分类
库、表、行、字段之间的关系
MySQL数据库相关软件
MySQL数据库环境安装
MySQL Workbench
MySQL使用
sql语句和.sql文件
mysql模块
web开发模式
session
cookie
JWT
-
Vue2.0/Vue3.0
Vue指令和自定义指令
事件和属性绑定
Vue生命周期
计算属性和侦听器
Vue组件和传值
Promise+Fetch+Axios
Vue路由
Webpack
Vue-cli/p>
ElementUI、VantUI
Vuex
Composition API
-
微信小程序
小程序账号注册和开发工具使用
小程序代码的构成
小程序的宿主环境
小程序组件和样式
小程序协同工作和发布
小程序数据和事件绑定
条件和列表渲染
小程序全局配置和页面配置
数据请求和页面导航
分包和自定义tabBar
小程序UI组件库
uniapp框架
-
React.js
create-react-app脚手架
JSX
React组件和通讯方式
React生命周期
render props模式
高阶组件
React原理
组件更新机制
组件性能优化
虚拟DOM和Diff算法
React路由
Ant Design Mobile
Web前端课程大纲
| 阶段 | 周次 | 主要学习方向 |
|---|---|---|
| 阶段1：语言基础班 HTML+CSS+ JavaScript+ jQuery+ HTML5 |
语言基础班 第01周 |
•安装软件，讲解课程体系
•HTML4.01知识学习
•CSS层叠样式表
•HTML+CSS美团购项目
•HTML+CSS美团购项目验收
•JavaScript ECMAScript
•JavaScript DOM
•JavaScript BOM
•JavaScript基础美团购项目特效开发
|
| 语言基础班 第02周 |
•JQuery的基本语法和使用
•JQuery事件进阶
•JQuery动画
•JQuery特效开发
•HTML5新增标签
•HTML5 Canvas画图
•HTML5 音视频标签
•HTML5新特性
•CSS3 渐变属性
•CSS 边框圆角
•CSS3 媒体查询
•CSS3 新布局模型
|
|
| 阶段2 HTML+CSS+JavaScript |
正式班 第01周 |
•安装软件，讲解课程体系
•HTML4.01知识学习
•CSS层叠样式表
•HTML+CSS美团购项目
•HTML+CSS美团购项目验收
•JavaScript ECMAScript变量、判断、循环
•JavaScript ECMAScript函数、数组、对象
•JavaScript DOM操作
•JavaScript BOM操作
•JavaScript基础美团购项目首页特效开发
•JavaScript基础美团购项目登录注册开发
•JavaScript基础美团购项目城市选择开发
•JavaScript基础美团购项目测试和上线
|
| 正式班 第02周 |
•JavaScript基础美团购项目个人开发
•JavaScript基础美团购项目个人开发
•JavaScript基础美团购项目评分
•JavaScript基础美团购项目点评
•JavaScript高级浮点数的加减乘除运算
•JavaScript高级函数、对象、数组知识
|
|
| 阶段3 JavaScript高级+jQuery |
正式班 第03周 |
•JavaScript高级日期处理
•JavaScript高级对象深浅克隆
•JavaScript高级DOM三级处理
•JavaScript高级性能优化
•JavaScript高级Ajax
•JavaScript高级ES6
•JavaScript高级项目封装类似jQuery的库
•JavaScript高级项目开发商品页面
•JavaScript高级项目开发商品详情页面
•JavaScript高级项目开发分页页面
|
| 正式班 第04周 |
•JavaScript高级项目个人开发
•JavaScript高级项目验收
•JavaScript高级项目点评
•jQuery选择器
•jQuery DOM操作
•jQuery 事件进阶
•jQuery 动画
•HTML5 Canvas绘图
•HTML5 本地存储
|
|
| 阶段4 HTML5+ BootStrap+ Node.js |
正式班 第05周 |
•HTML5 文件操作
•HTML5 多线程处理
•CSS3新属性
•CSS3 新布局模型
•HTML5+CSS3移动端项目首页开发
•HTML5+CSS3移动端项目登录注册页面开发
•HTML5+CSS3移动端项目个人开发
•HTML5+CSS3移动端项目评分
•HTML5+CSS3移动端项目点评
|
| 正式班 第06周 |
•BootStrap框架基本使用
•BootStrap插件的使用
•BootStrap框架模板
•BootStrap快速建站
•BootStrap框架点评
•BootStrap框架点评
•Node.js核心模块
•Node.js事件驱动
•Node.js Buffer对象
•Node.js服务搭建
|
|
| 正式班 第07周 |
•Node.js构建WEB应用
•Node.js页面渲染
•Node.js性能测试
•Node.js项目工程化
•Vue.js变化侦测
•Vue.js虚拟DOM
•Vue.js模板编译
•Vue.js解析器
•Vue.js代码生成器
•Vue.js架构设计
|
|
| 阶段5 Node.js+Vue.js项目 |
正式班 第08周 |
•Vue.js 全局API实现原理
•Vue.js 生命周期
•Git版本控制基本使用
•Git代码版本控制冲突解决方案
•Vue.js+Node.js项目项目后端API开发
•Vue.js+Node.js项目项目前端页面开发
|
| 正式班 第09周 |
•Vue.js+Node.js项目项目前端页面开发
•Vue.js+Node.js项目分组开发
•React Flux 架构模式
•React Reducx高阶应用
•React native原生应用
•React 工程化构建工具 webpack
|
|
| 阶段6 React.js+ Node.js项目 |
正式班 第10周 |
•React运行Node.js开发环境
•React使用ESlint
•开发一个网站的准备
•搭建React+Node.js开发环境
•React+Node.js数据流
•React+Node.js生命周期
•React+Node.js项目后端API开发
|
| 阶段7 数据可视化+小程序 |
正式班 第11周 |
•React.js+Node.js项目前端页面开发
•React.js+Node.js项目分组开发
|
| 正式班 第12周 |
•Angular.js 双向模型绑定
•Angular.js MVC模式
•Angular.js服务
•Angular.js单元测试
•ECharts数据可视化
•ECharts组件详解
•ECharts可视化图
•可复制的通用可视化产品搭建全流程
•D3.js数据可视化
•D3.js和Echarts如何使用
|
|
| 正式班 第13周 |
•SASS和LESS学习
•SASS和LESS区别
•SASS和LESS使用
•SASS和LESS开发中的应用
•小程序开发WXSS样式基础
•小程序开发配置开发工具
•使用组件
•项目插件
•项目实战
|
|
| 阶段8 算法+网站优化 |
正式班 第14周 |
•TypeScript类
•TypeScript模块
•TypeScript接口
•TypeScript装饰器
•算法和数据结构
•设计模式和进程线程
•WEB安全
•大型网站性能优化实战
•前端、网络、后端、全链路性能优化详解
|
| 阶段9 一对一面试辅导实现高薪就业 |
正式班 第15周 |
•结业考试
•试卷解答
•面试和成功求职的独门秘技
•按需撰写简历的不二法则
•已就业老学员的心得分享
•精准投递简历规划未来方向
•模拟面试：一对一辅导
|
常见问题
- 在线就业班和自己看视频有什么区别？
- 学费要多少？
- 担心没有自制力，坚持不下去怎么办？
- 学不会怎么办？
- 零基础可以学会吗？
- 学多长时间可以找到工作？
