共计 6147 个字符，预计需要花费 16 分钟才能阅读完成。
我是往年刚毕业的应届生，本科电子业余，目前人在北京做 WEB 前端工程师，满打满算在学校自学了 7 个月的 WEB 前端，毕业后的一个月始终在北京找工作，大略找了 20 多天面试了 30 家左右，拿到 3 个 offer，最初抉择了当初这家公司，待遇是税前 11K，五险一金加节假日福利，工作工夫是朝 10 晚 7 双休，有的时候须要加班。
之所以过后抉择自学 WEB 前端，是因为我的业余电子，如果进来做本业余的工作，那根本都是进入电子厂当小工，对于那些电路板我的确没有多大的趣味，感觉跟旧时的工人差不多，因为我大一接触过 C 语言，所以对于编程有肯定的理解，而且对于这些逻辑上的货色也比拟感兴趣，最次要的是因为做软件工程师比其余行业工资都高，这是最吸引我的中央，都晓得 90 后很穷，的确都缺钱花，那么缺钱花怎么办？我本人也晓得，就是靠着本人的致力赚，埋怨那些货色都没什么用，钱又不是埋怨来的。
自学的教程是在网上买的，过后花了几百块钱，是 2019-2020 年的教程，我就是跟着教程一步步地走，因为本人比拟喜爱看书，也有急躁看书，就本人买了一本 JavaScript 书籍，我集体的感觉初学者还是跟着视频教程学比拟靠谱，看书太干燥比拟难以了解，视频则是由老师把知识点解说得通俗易懂，对于初学者会更敌对，能够等学到 JavaScript 局部再联合书籍进行坚固晋升。
依据我自学的教训给大家几点小倡议：
- 首先你应该有一个比拟好的学习教程，这是学习 WEB 前端的基本。如果你没有一份零碎的教程，能够用我过后自学的这份，我能够收费分享给大家。因为网盘链接放不上来，须要的能够到这个 WEB 前端裙，484 757 760。外面有全套的零碎教程，能够跟着学，有什么不懂的中央能够随时在外面问，大家都会帮忙解答，学习气氛好。
- 而后你应该晓得学习 WEB 前端的难点在哪里？学前端难的不是 JavaScript，也不是各种框架。依据我学习的教训来看，学习 WEB 前端最难的就是保持。学习一项技术，总是会遇见艰难，可能克服这些艰难，保持往下学，天然就能找到工作。
- 第三点很多人感觉本人学了前面的就把后面的常识遗记了，而且还感觉视频教程中的都能听懂，但让本人写却写不进去代码，不晓得如何实现。对于这两个问题，我想大部分人都遇到过，依据我集体的教训来看，这次要是因为本人当初所学的知识点没有通过大量的练习题和我的项目进行实际，只是在短期内脑海中的记忆，并没有造成一个粗浅的记忆，因为本人没有经验啊，因为本人没有写过案例和我的项目。学编程技术是为了做更好的互联网产品，可是你却很少写代码，这样的学习办法怎么能是正确的呢？所以，学习前端肯定要多练习敲代码，假如你每天有 6 个小时的工夫学习前端，起码要拿出 3 个小时用来练习敲代码，这样才是正确的学习形式。
学到什么水平能力待业？
对于学到什么水平可能待业这个问题，这里分享一下我找到 11K 工作把握的技术栈，你可能把这些知识点把握了，找一份工作就很简略。
首先就是 HTML/CSS3 以及工具局部：
vscode 开发工具应用、markdown 文档工具应用、浏览器平台环境、标签根底、DTD 与 META
语义化、选择器、权重与优先级、匹配规定、浮动与革除、BFC、类名组合规定、SEO 前端技巧、定位、叠加技巧、
伪类、伪元素、盒子模型、代码标准、性能优化、渲染原理、CSS Sprites、iconfont 字体图标、布局思路、布局定式
css3 动画、css3 选择器、css3 过渡、flex 布局、背景突变、css3 实用动效、3D 模块、css3 变量、em/rem/vw
学完这些能够实现一个企业外部多页面我的项目实战（非仿站）有残缺 PSD 与切图
而后就是 JavaScript 局部，你须要把握以下知识点：
JavaScript 概念、根底认知、倒退历史、利用范畴、优缺点。
ECMAScript
语言概览、语句语法、数据类型、运算符、隐式转换、运算规定、管制流程、作用域、作用域链、作用域解析、js 解释引擎、字符串属性办法、for of/for in
数组属性办法、对象、狭义对象概念、对象个性、存储机制、深拷贝、对象理论利用、工厂模式、构造函数、原型、原型链、原型指向、封装
多种继承、包装对象、this、this 指向、js 数据处理、垃圾 GC、闭包原理与利用、debug 方法论、浏览器控制台工具利用、面向对象开发、函数式开发
纯函数、递归函数、回调函数、组合函数、缓存函数、柯里化函数、偏函数、函数防抖与节流、高级函数、IIFE 函数、模块化
数学对象、高级数组办法（reduce、filter、map、every、some、forEach、find、findIndex、include）等
高级对象办法（entires、defineProperty、freeze、fromEntries、assign、keys、create、hasOwnProperty）等
this 通过 bind、call、apply 指向偏移、同步与异步、闭包模块化、数据形变解决、性能解决
DOM/BOM
DOM 对象与办法、节点与遍历树、DOM 选择器、DOM 节点增删改查、DOM 款式操作、DOM 地位获取与偏移、DOM 对象与标签区别、DOM 虚拟化、DOM 事件、
Event 对象、定时器与监听器、事件委托、事件代理、事件分流、事件冒泡、默认行为、事件捕捉、防抖、节流、滚动、键盘行为、事件降频、行为锁机制、
拖拽模组、碰撞检测、间隔判断、三角函数、方向判断、静止框架、弹性静止、重力加速度、DOM 树、CSSOM 树、渲染解析、加载、回流、重绘、浏览器线程与阻塞。
BOM 深刻、window 对象、navigator、history、screen、location、spa 概念、本地传参、日期对象应用、日期格式化封装、随机封装、DOM 分片容器
JS 业务利用扩大
JSON 对象、数据解析、JSON 办法、模板渲染、缓存懒加载、正则表达式 RegExp、元字符、修饰符、正向预查、贪心模式、replace 办法、分组与不分组、test、match 与 exec
正则库封装、表单校验、图片预存懒加载、自定义封装滚动组件、多重轮播（循环、视差、旋转木马）、选项卡切换、楼梯导航、吸顶导航、拖拽导航、
JavaScript 编码格调指南、console 利用技巧
ECMAScript5 — ECMAScript9 扩大
版本解读、应用环境、let、const、解构赋值、箭头函数、对象解构、reset 参数解构、class、set、get、extends、super、static、private 实现、symbol、promise、proxy 代理拦挡、async/await
对象新增 API、数组新增 API、字符串新增 API、原型属性、对象润饰、代理拦挡、链式询问、空值合并运算符、泡泡龙面向对象游戏开发
HTML5 / 挪动端开发 局部
HTML5 标签与 API
HTML5 概念、定义、新增个性、DTD 比照、新增 H5 标签、新增语义化 H5 标签、H5 表单
H5 拖拽事件 video、audio、fullScreen、FileReader 文件流、Blob 对象、sessionStorage、localStorage、
网络状态、页面生命周期、网页状态监听、地理信息与定位、canvas 画布、worker 多线程、Notifications 桌面告诉
播放器开发 canvas 交互特效开发
挪动端适配 / 事件
挪动端适配概念、尺寸与分辨率原理、PPI 与 DPI 计算、DIP 与 DPR 设施像素概念、视口 viewport 概念、布局视口、视觉视口、现实视口
视口适配计划（Meta viewport）缩放设置、screen 窗口大小 API、媒体查问 @media、rem 适配、vw vh 适配
挪动端适配计划、flexible rem 计划、vh vw 计划、复合计划、高清适配计划、挪动端字体缩放解决、1px 边框问题解决、半像素线
图片高清适配、image-set、srcset、js 拼接 URL 技巧、IPhonex 刘海屏适配、平安区域、fit 与 env
Meta 权限治理、兼容优化、IOS 头部底部闪屏回退输入框问题、输入法空格问题、默认首字母大写问题、滑动卡顿问题等
终端款式丑化与拜访判断
Touch 事件组封装、click 提早解决、FastClick 应用、禁用缩放设置现实视口
罕用类库 / 工具
jquery: 元素抉择、增删改差、事件处理、地位获取、动画过渡、高级办法、特效利用
zepto：挪动端的 jquery、DOM 操作、挪动端事件、click 提早解决、touch 事件组
根底 UI 库: layerUI、easyUI、bootStrap、UI 模块化、UI 库应用技巧、文档解读、案例调试、表单零碎
iScroll、touchjs 等挪动端事件库应用
swiper：挪动端网站触摸滑动、轮播图插件、模块化利用、源码解读
art-template: 模板引擎 模板语法、渲染办法、原生模板引擎实现
CSS 预处理：sass、less 应用 stylus 深刻学习、预处理语法、css 编程、Minxin、预处理函数、继承、嵌套
vscode 高级插件与配置 liveserver sass
模板化利用、预处理利用
date-picker 挪动端原生组件开发
需要剖析、业务规定、技术栈选型、文件输入规定、技术剖析
MVC 模型概念与设计、业务逻辑分类
view 层适配计划 原型布局搭建 模板化生成
工具函数开发、面向对象式业务设计 性能类日期对象开发
交互业务封装 模块对接 优化设计 面向对象高级程序设计
Nodejs 与工程化开发 局部
Node 原生根底
Node 根底概念、NPM 命令、V8 引擎概念、JavaScript 模块化 CMD AMD UMD、EventLoop 事件循环、同步异步、阻塞非阻塞、工作队列、宏工作、微工作、
原生 Node 模块、外围模块与 require、module、触发器 events 与 path 模块、fs 模块、Buffer 对象、URL 模块、HTTP 模块、stream 流
Node 原生封装 HTTP 与文件服务器
Node 框架
express 框架应用、中间件、外围对象、路由配置、模板引擎、数据脚本、Router 外围、CORS 配置、错误处理、校验封装、PM2 治理、nodemoon 治理
MORGAN 日志解决、查问正则捕捉、中间件开发、bodyParse 等第三方中间件应用、文件流上传下载、文件流切分
webpack 工程化构建
工程化概念、工程化工具介绍、webpack 基础知识、webpack 配置与运行、plugin 插件、loader 应用、入口进口配置、模块 modules、依赖解决、dev Server
target、文件切分、build 打包、热处理、package 治理、性能优化、测试解决、第三方插件应用、babel 等
前后端数据交互
HTTP 通信交互原理、申请响应、MIME、URI 地址、报文解析、端口、报文流、测试监听抓包、TCP/IP 握手机制、网络业务模型
代理、缓存、网关、隧道等概念、method 与申请头分类
根底 XMLHTTPRequest 对象办法属性、办法、ajax 异步交互、同源策略原理
原生 js 封装 ajax 交互、jquery 的 ajax 封装交互、jsonp 跨域解决、cors 跨域解决、携带 cookie 与跨域解决、代理服务器跨域解决、
cookie 验证与通信、axios 库的应用 代理、封装、拦挡、合并、二次封装
通信加密策略、数据对称加密、数据非对称加密、RSA 加密实际、MD5 加密实际
登录注册与鉴权机制、Authenticity 认证、Token 认证、JWT 认证、session 状态治理、oauth 认证
RESTful 接口设计
RESTful 设计准则、状态码设计与标准、服务器响应规定与格局、前后端接口协议制订、传统 RESTful 改良
API 设计规范、资源定位、JSON 模式、合约阐明、资源标识符、缓存敌对 API、HTTP 头治理、文档定义、松耦合准则、一致性、重用、稳定性准则
数据库存储
MongoDB 根底概念、NoSQL 与 SQL、CAP 定理、RDBMS、MongoDB 语法、指令、监控与 GUI、MongoDb 驱动、Mongoose 利用
数据库创立、汇合增删改查、文档增删改查、数据库查问、高级查问操作、通道查问、多条件查问、反向筛选、索引解决、aggregate 聚合管道、
validation 验证、population 联表、middleware 中间件解决、查问 ERROR 类二次封装
博客后盾我的项目实战
数据库设计、服务端路由搭建、接口设计与 API 治理、通信交互管道封装、注册登录、路由导航、前端路由治理、权限治理、用户治理、分类管理、标签治理
、文章治理、模块化性能封装、校验库封装、promise 链式行为封装、
异步模块解决、SPA 单页面利用高级实现、原生集中行为控制器、模板化 + 模块化 + 预处理 + 工程化实现前端页面
组件化封装
组件化根底概念、组件设计准则、组件封装、组件耦合与解耦、工程化 + 模板化 + 模块化实现原生组件化性能、
vue 框架局部
vue 根底
vue 开发筹备、工具与插件、mvc mvp mvvm 设计理念、原生 js 实现 MVVM 外围框架、vue 设计模式、生命周期、命令与属性、组件化
数据驱动与双向绑定、虚构 DOM 概念原理、模板语法、条件与列表、数组监测、计算属性、事件处理、润饰与表单、监听器、过滤器、
methods watch computed filter 比照、组件化开发、动静组件、组件通信、高级组件通信、插槽、vue 动画、实例对象、set、get、nextTick、vue 插件
vue 工程化
Babel、webpack 配置 vue、vue 单文件组件、vue-cli、工程平台解决、postCss、animate、core、socket、lodash 工具、vue-cli 插件、preset、动态资源解决、
环境变量与膜还是切换、工程化部署、工程构建
vue Router
vue 路由概念、嵌套路由、路由视图、动静路由、路由匹配、编程式导航、history、hash 模式治理、命名视图、重定向与别名、导航守卫、路由元信息、滚动与懒加载
导航故障解决
vuex
vuex 外围概念、EventBus 比照、状态管理模式、Store、state、getter、mutation、action、moudule
vuex 辅助函数与 API 性能、vuex 环境抉择、vuex 模块化解决规定与技巧、对象格调提交形式、模块重用等
vue 我的项目实战
vue 博客我的项目实战 PC + 挪动端、elementUI、vantUI、websocket 聊天室、虚构人偶、vueScroll、store、qs、nprogress、editor、
文章分类、词云成果、spa 单页面利用、挪动 PC 无缝切换、残缺注册登录、vue 加密鉴权、http 封装治理、错误处理封装、vuex 外围状态治理、本地存储状态更新、令牌解决、
文章富文本编辑、点赞、珍藏、拜访、评论、组件封装、组件复用、组件混合、高级组件开发、复合性组件通信、vue 中解决原生 DOM 行为、vue 常见错误处理、
重置 vue 数据响应、个人信息批改、头像上传、告诉组件封装、postcss 利用、我的项目打包优化
而后上面这些是跟这些技术相配套的教程，能够到这个 WEB 前端学习裙，484 757 760 获取。
