先说说观点，强烈建议大家自学，不要参加培训班。我从事Web前端工程师工作已经6年多了。在此之前，我在蚂蚁金服工作了2年。后来因为受不了加班就离开了。像这样的互联网公司几乎没有不加班的，基本都是996，虽然工资很高，但是总加班没生活条件谁也受不了。由于我在这个行业有6年的工作经验，对这个行业的情况还是比较了解的。在蚂蚁金服、腾讯、百度、美团、饿了么这样的大公司里，你几乎找不到。任何一个培训班出来的程序员，基本都是自学成才，技术不错或者有专业背景，因为培训班出来的人基础都很薄弱，而且都是经验丰富的面试官。只要在面试的时候随便聊几句，就能看出你是不是刚从培训班出来的。一旦发现自己刚从培训班出来，面试就直接结束了。但是自学就不一样了。一般来说，自学需要很长时间。经过长期的学习和积累，能够打下良好的基础，每一步都掌握得非常扎实，能够长期坚持自学。他们普遍意志力强，学习能力强，公司肯定偏向这类人。我们这个行业有一个奇怪的现象，就是很多做web前端技术的人根本活不过35岁，能坚持做技术10年以上的人寥寥无几。在其他行业，因为他长期没有进步，技术一直停滞不前。大家都知道，如果我们这个行业不能继续进步，就会被后来的人赶上，被淘汰。可以说，99%的中途转行都是因为语言基础不好，不主动学习而速成的。因为没有养成良好的学习习惯，他们都认为参加了培训班之后，就可以一劳永逸，以后不用再学习了，但是在任何行业都是一样的。一直原地踏步不进步的人，肯定会被所在行业淘汰。这是自然规律。有人问Web前端现在还能学吗？完全不用担心饱和度。如果Java有点饱和，我相信。毕竟Java语言已经存在了20多年，但是Web前端这个概念却长期没有被重视，所以目前各个互联网公司都是供不应求。对于web前端技术人才，字节跳动等公司前段时间发布招聘需求，月薪基本在30K以上。各种渠道求内部人才，还是招不到人。组，还是很难招到一个好的web前端人才，所以就目前的web前端市场来说，完全可以学，前端入门还是比较容易的。与Java相比，更适合初学者。学者。我提倡的学习方式是：自学+有人指导。其实作为一个真正想做这行的人，首先必须要有对技术的热爱，喜欢编程。学习的耐心和毅力是必须的。在整个学习过程中，都有一个人指导他，提高他的学习效率，尽量少走弯路。剩下的其实都是自己学的。有时候觉得很可笑，为什么那么多人认为参加线下培训班不是自学？我想持有这种想法的人一定走不远。学习这种东西，终究是自己的事，不是别人能左右的。如果你觉得自己在学习过程中有很多困惑，走了太多弯路，解决一个问题需要好几个小时，不知道自己应该学多少才能找到工作，可以提问我随时，工作不忙的时候来回答大家。下面是我建立的一个3000人的Web前端开发交流学习群。已经5年了，聚集了2000多名前端学习者。希望大家一起进步，以后一起创业。这是WEB前裙。前三位输入296，中间三位输入212，后三位输入562。给其他专业或行业想学习web前端技术的小伙伴一些建议：1.稍懂一点的都知道Web前端的技术更新非常快，所以我们在学习的时候一定要了解最新的技术体系。2、Web前端没有一个特别完整的内容，因为前端是属于一个职位的，如果你要做这个工作，你需要知道你需要学习哪些内容。在找到工作之前，没有必要学习所有内容。知识是无穷无尽的，但它有一些主流技术是必须掌握的。如果是初级的前端开发工作，可以在学完主要技术后再尝试找工作。尝试在工作中学习以了解更多信息。3、语言基础是核心竞争力。不管以后开发了多少前端框架，都只是工具，你只需要掌握使用工具的技巧即可。对于前端开发者来说，学习JavaScript是最重要的。JavaScript学不好，就不要继续学了，没有任何意义。4.如果有机会找大佬指导入门，那就找大佬指导。想靠自己实现就业，就业水平很低。凡是自己探索的人，都要少走弯路。有的人走了弯路还能回来，但大多数人的结果都是因为“难回头”而最终放弃。最后总结一下2021年web前端的学习内容，可能内容太多，但是从竞争力的角度，我会尽量把大前端的学习内容都列出来全栈工程师。按照我的标准上学，保底就业工资在15K以上。如果你在网上找不到这些学习资源，可以上这个WEB前端裙子。前三位输入296，中间三位输入212，后三位输入562。一、HTML/CSS3的一些前端概念概述，vscode开发工具的使用，markdown文档工具的使用，浏览器平台环境、标签基础、DTD和META语义、选择器、权重和优先级、匹配规则、浮动和清除、BFC、类名组合规则、SEO前端技巧、定位、叠加技巧、伪类、伪元素、框模型、代码规范、性能优化、渲染原理、CSSSprites、iconfont字体图标、布局思路、布局样式css3动画、css3选择浏览器、css3过渡、flex布局、背景渐变、css3实用动态效果、3D模块、css3变量,em/rem/vw企业内部多页项目实战（非仿站）附完整PSD及切图2.JavaScript部分JavaScript概念、基本认知、发展历程、应用范围、优缺点。ECMAScript语言概述、语句语法、数据类型、运算符、隐式转换、运算规则、控制流、作用域、作用域链、作用域分析、js解释引擎、字符串属性方法、forof/forin数组属性方法、对象、广义对象概念、对象特性、存储机制、深拷贝、对象应用、工厂模式、构造函数、原型、原型链、原型指向、封装、多重继承、包装对象、this、this指向、js数据处理、垃圾GC、闭包原理及应用，调试方法论，浏览器控制台工具应用，面向对象开发，函数式开发，纯函数，递归函数，回调函数，组合函数，缓存函数，柯里化函数，偏函数，函数防抖节流，高级函数，IIFE函数、模块化、数学对象、高级数组方法（reduce、filter、map、every、some、forEach、find、findIndex、include）等，高级对象方法（entires、defineProperty、freeze、fromEntries、assign、keys、create,hasOwnProperty)等this通过bind、call、applypointtooffset、同步异步、闭包模块化、数据变形处理、性能处理DOM/BOMDOM对象和方法、Node和遍历树、DOM选择器、DOM节点增删改查、修改、DOM风格操作、DOM位置获取与偏移、DOM对象与标签区别、DOM虚拟化、DOM事件、Event对象、定时器与监听器、事件委托、事件代理、事件分流、事件冒泡、默认行为、事件捕获、防抖,节流,滚动,键盘行为,事件降频,行为锁定机制,拖动模块,碰撞检测,距离判断,三角函数,方向判断,运动框架,弹性运动,重力加速度,DOM树,CSSOM树,渲染分析、加载、回流、重绘、浏览器线程和阻塞。BOM深入、窗口对象、导航器、历史、屏幕、位置、spa概念、局部参数传递、日期对象使用、日期格式化封装、随机封装、DOM切片容器JS业务应用扩展JSON对象、数据分析、JSON方法、模板渲染、缓存懒加载、正则表达式RegExp、元字符、修饰符、正向查找、贪婪模式、替换方法、分组和不分组、测试、匹配和执行正则库打包、表单验证、图片预存懒加载、自定义封装滚动组件、多轮播（loop、parallax、carousel）、tab切换、楼梯导航、天花板导航、拖拽导航、JavaScript编码风格指南、控制台应用技巧ECMAScript5---ECMAScript9扩展版解读、应用环境、让、const,解构赋值,箭头函数,对象解构,重置参数解构,class,set,get,extends,super,static,privateimplementation,symbol,promise,proxy代理拦截,async/awaitobjectnewAddAPI,arrayaddAPI,字符串添加API、原型属性、对象修改、代理拦截、链式查询、空值合并运算符、BubbleBobble面向对象游戏开发三、HTML5/HTML5移动开发标签比较APIHTML5概念、定义、新特性、DTD、新H5标签、新语义H5标签、H5表单H5拖动事件视频、音频、全屏、FileReader文件流、Blob对象、sessionStorage、localStorage、网络状态、页面生命周期、网页状态监控、地理信息与定位、canvas、worker多线程、Notifications桌面通知播放器开发画布交互特效开发移动端适配/事件移动端适配概念、大小和分辨率原理、PPI和DPI计算、DIP和DPR设备像素概念、viewport视口概念、布局视口、视觉视口,理想视口视口适配方案(Metaviewport)缩放设置,屏幕窗口大小API,媒体查询@media,rem适配,vwvh适配移动端适配方案,灵活rem方案,vhvw方案,复合方案,高清适配方案,移动端字体缩放解决方案,1px边框问题解决方案,半像素线图高清适配,image-set,srcset,js拼接URL技巧,IPhonex刘海屏适配,安全区域,fit和envMeta权限管理,兼容性优化,IOS头部底部闪屏回退输入框问题,输入法空格问题,默认首字母大写问题,滑动卡顿问题等终端样式美化及访问判断触摸事件组封装、点击延迟处理、FastClick使用、禁用缩放设置理想视口常用类库/工具jquery：元素选择、增删改查、事件处理、位置获取、动画过渡、进阶方法、特效应用zepto：移动jquery、DOM操作、移动事件、点击延迟处理、触摸事件组基础UI库：layerUI、easyUI、bootStrap、UI模块化、UI库使用技巧、文档解读、案例调试、表单系统iScroll、touchjs等移动事件库使用swiper：移动网站触摸滑动、轮播插件、模块化应用、源码解读art-template：模板引擎模板语法、渲染方式、原生模板引擎实现CSS预处理：sass、少用stylus深度学习、预处理语法、css编程、敏信、预处理函数、继承、嵌套vscode高级插件及配置liveserversass模板应用、预处理应用date-picker移动端原生组件开发需求分析、业务规则、技术栈选择、文件输出规则、技术分析MVC模型概念与设计、业务逻辑分类视图层适配方案原型布局构建模板生成工具功能开发、面向对象业务设计功能类日期对象开发交互业务封装模块对接优化设计面向对象高级编程4.Nodejs与工程开发部分Node原生基础Node基础概念、NPM命令、V8引擎概念、JavaScript模块化CMDAMDUMD、EventLoop事件循环、同步异步、阻塞非阻塞、任务队列、宏任务、微任务、原生Node模块、核心模块和require、模块、触发事件和路径模块、fs模块、Buffer对象、URL模块、HTTP模块、streamNode原生封装HTTP和文件服务器NodeFrameworkexpress框架使用、中间件、核心对象、路由配置、模板引擎、数据脚本、Router核心、CORS配置、错误处理、验证封装、PM2管理、nodemoon管理MORGAN日志处理、查询定时抓包,中间件开发,bodyParse等第三方中间件的使用,文件流上传下载,文件流切分,webpack工程构建工程概念,工程工具介绍,webpack基础知识,webpack配置与运行,plugin插件,loader使用,进出配置、模块模块、依赖处理、devServertarget、文件切分、构建打包、热处理、包管理、性能优化、测试处理、使用第三方插件、babel等前端数据交互HTTP通信交互原理、请求响应、MIME、URI地址、消息解析、端口、消息流、测试监控抓包、TCP/IP握手机制、网络业务模型代理、缓存、网关、隧道等概念、方法和请求头分类基本XMLHTTPRequest对象方法属性、方法、ajax异步交互、同源策略原理原生js封装ajax交互、jqueryajax封装交互、jsonp跨域处理、cors跨域处理、携带cookie和跨域处理、代理服务器跨域处理、cookie验证与通信、axios库使用代理、封装、拦截、合并、二次封装通信加密策略、数据对称加密、数据非对称加密、RSA加密实践、MD5加密实践登录注册与认证机制、真实性认证、Token认证、JWT认证、会话状态管理、oauth认证RESTful接口设计RESTful设计原则、状态码设计与规范、服务器响应规则与格式、前后端接口协议制定、传统RESTful改进API设计规范、资源定位、JSON模式、契约描述、资源标识符号、缓存友好API、HTTP头管理、文档定义、松散耦合原则、一致性、重用、稳定性原则数据库存储MongoDB基本概念、NoSQL和SQL、CAP定理、RDBMS、MongoDB语法、说明、监控和GUI、MongoDBDriver、Mongoose应用数据库创建、集合增删改查、文档增删改查、数据库查询、高级查询操作、通道查询、多条件查询、反向过滤、索引处理,aggregate聚合管道,validation校验,人口联表,middleware中间件处理,查询ERROR类二次封装博客后台项目实战数据库设计,服务器路由搭建,接口设计及API管理,通信交互管道封装,注册登录,路由导航,前端路由管理,权限管理,用户管理,分类管理,标签管理、文章管理、模块化功能封装、验证库封装、承诺链行为封装、异步模块处理、SPA单页应用初级实现、原生集中式行为控制器、模板化+模块化+预处理+工程化实现前端页面组件封装组件基本概念，组件设计原则，组件封装，组件耦合与解耦，工程化+模板化+模块化实现原生组件化功能，五，Vue框架部分Vue基础Vue开发准备，工具与插件，mvcmvpmvvm设计理念，原生js实现MVVM核心框架、vue设计模式、生命周期、命令与属性、组件化数据驱动与双向绑定、虚拟DOM概念原理、模板语法、条件与列表、数组监控、计算属性、事件处理、修饰与表单,listener,filter,methodswatchcomputedfilter比较,组件开发,动态组件,组件通信,高级组件通信,slot,vue动画,实例对象,set,get,nextTick,vue插件vue工程babel,webpack配置vue,vue单文件组件、vue-cli、工程平台处理、postCss、animate、core、socket、lodash工具、vue-cli插件、preset、静态资源处理、环境变量和Membrane或切换、工程部署、工程构建vueRoutervue路由概念、嵌套路由、路由视图、动态路由、路由匹配、程序化导航、历史、哈希模式管理、命名视图、重定向和别名、导航守卫、路由元信息、滚动和延迟加载、导航故障处理vuexvuexcore概念、EventBus比较、状态管理模式、Store、state、getter、mutation、action、moudulvuex辅助函数及API函数、vuex环境选择、vuex模块化处理规则与技巧、对象样式提交方式、模块复用等vue项目实战vue博客项目实战PC+移动端、elementUI、vantUI、websocket聊天室、虚拟娃娃、vueScroll、store、qs、nprogress、编辑器、文章分类、词云效果、spa单页应用、移动PC无缝切换、注册完成和登录、vue加密认证、http包管理、错误处理包、vuex核心状态管理、本地存储状态更新、token处理、文章富文本编辑、点赞、收藏、访问、评论、组件封装、组件复用、组件混合、高级组件开发，复合组件通信,处理vue原生DOM行为,vue常见错误处理,重置vue数据响应,个人信息修改,头像上传,通知组件打包,postcss应用,项目打包优化
