有的人只学到js就找到了实习的工作,有的人学了框架做了项目练习,但是基础不够扎实,一样也找不到工作。
说到底,找工作就是实力+运气。技术扎实、学历好就代表你硬实力强,你找工作就不怎么需要运气。相反,如果你学历差技术还很弱,那你找工作运气就非常重要。
碰运气式的找工作,只需要跟网上说的那样,大致掌握HTML、CSS、JavaScript、Vue,能鼓捣出一两个项目,就能去碰碰运气,尝试找一些基础的代码搬砖工作。
我个人是很讨厌网上这些说学完前端三件套就能上手框架的言论的,在我看来说这些话的人很不负责任,在学框架之前,是要先把node、npm、webpack给学好的,模块化、组件化、模板化、工程化,这些都是学框架的前置知识,基础不扎实,学框架就是学个语法,学的都是表面的东西,实际到做项目会错误百出。
所以,如果你想要凭实力找到一份工作,并且有着不错的薪资,那你可以耐心的看完这篇文章,按照我这份学习路线去学。只要你能把提到的这些知识点掌握到应用开发层面,找一份10-15K的工作没有任何问题。(根据学历以及所在城市薪资水准有一定的上下浮动)找到工作之后,用几年的时间去消化吸收,更进一步的掌握,年薪拿个三四十万也是没有任何问题的。
想要凭硬实力去找工作,你需要学习下面这些内容
①HTML/CSS篇
这个阶段的学习周期大概是15天左右,你需要掌握以下这些知识点:
HTML
- 文档结构
- DTD
- 注释
- 网页三要素
- SEO
- 标签
- 属性
- 结构
- 规范
- 书写风格
- 语义化
CSS
- 选择器
- 优先级
- 权重
- 定位
- 浮动
- flex
- 盒子模型
- BFC
- 字符串类
- 包装类
- 渲染原理
- 代码规范
- 性能优化
- 布局思维
- CSS3动画特效
除上面这些知识点之外,还需要掌握一些实战技巧,例如量图规划、结构规划、类名分组、间距处理、样式复用这些。要做到熟练掌握HTML、CSS核心语法,掌握多种布局技巧,能够独立绘制前端静态页面。可以做一个企业内部的多页面的项目实战进行自我检测。
学习编程最重要的一点就是要多敲代码、多做项目练习,只有练习多了才能够理解运用,所以每个阶段学完之后都要找一到两个练手的项目做。如果你学完了HTML和CSS,缺少练手的项目,可以在文章末尾处加入我创建的WEB前端交流群,932/112 /117 . 我把这个企业内部的多页面项目实战的素材和源码上传到了群文件,大家可以自行下载练习,平时学习过程中遇见有不懂的也可以随时在里面问,大家都会帮忙解答,学习氛围非常好。
②JavaScript篇
这个阶段的学习周期在50天左右,需要掌握的下面这些知识点:
ECMAScript
- 语言基础概念
- 语句语法
- 数据类型
- 隐式转换
- 运算符
- 运算规则
- 作用域解析
- JS解释引擎
控制流程
- for/for of/for in
- 短路运算
- 位运算
- 三目运算
- Switch
- 垂直过滤
- while do while
- 排序
- 去重
- 终止
- 返回
内置API
- 字符串API
- 数组API
- 对象API
- 日期API
- 正则表达式
- 工具类
机制原理
- 存储机制
- 深拷贝/浅拷贝
- 字面量
- 包装对象
- 同步/异步
- 闭包模块化
- 性能调优
- 工厂模式
- 执行上下文
- 垃圾GC
- 闭包
- debug方式方法
函数式编程
- 纯函数
- 偏函数
- 递归函数
- 柯里化函数
- 回调函数
- 缓存函数
- 组合函数
- 通道函数
- 防抖节流
- 高级函数
- IIFE函数
面向对象
- 构造函数
- 原型/原型链
- 原型指向
- 封装
- 继承
- 多重继承
- 包装对象
- this指向
- this偏移
DOM
- DOM概念
- 节点与遍历树
- GUI渲染行为
- 虚拟DOM
- 节点增删改查
- 位置与偏移
- 对象与标签
- Event时间
- 鼠标/键盘
- 定时器
- 监听器
- 事件委托
- 代理/分流
- 事件冒泡
- 默认行为
- 事件降频
- 行为锁
- 运动框架
- 物理模拟
- 碰撞检测
- 拖拽模组
- 重绘/重排
BOM
- window对象
- Navigator
- location
- history
- hash
- screen
- document
ES扩展
- 版本解读
- 兼容处理
- Let
- const
- 解构赋值
- 对象解构
- 箭头函数
- reset参数解构
- class面向对象
- set/get/extends
- super/static
- Symbol/promise
- async/await
- Defineproperty
- proxy代理
- 合并空值运算
- 链式询问
- 对象修饰
- 代理拦截
- Modules
把JS的这些知识掌握,就可以接着往下学了。这阶段的达标水准就是能够使用原生javascript进行业务开发,能实现常见的DOM库和工具库,能够修改第三方库源码以供业务特殊需求使用。学完之后可以做一个泡泡龙游戏自我检测。这个项目的源码、素材我也上传到文末这个WEB前端学习群932/112 /117 的群文件了,需要可以点击下方插件自行下载。
③H5移动端篇
这个阶段的学习周期,在30天左右,需要掌握的内容如下:
移动端开发
- 移动端适配概念
- 尺寸与分辨率
- PPI/DPI/DIP/DPR
- 布局视口
- 理想视口
- 视觉视口
- rem适配方案
- vw/vh适配方案
- 高清适配方案
- Meta权限管理
- 刘海屏适配
- 图片高清适配
- 1px像素适配
- 移动端事件
- 默认行为处理
H5API
- 新增标签
- 新增属性
- 多媒体
- 页面生命周期
- 状态监听
- Blob/FileReader
- sessionStorage
- localStorage
- fullScreen全屏
- Notifications通知
- worker多线程
- 网络状态
- 地理信息开发
- canvas交互
- 默认行为处理
预处理
- sass语法
- less语法
- stylus语法
- css编程
- css模块化
- css表达式
- css循环判断
- 继承
- 嵌套
- 混入
模板引擎
- art-template模板语法
- handlebars模板语法
- 原生js模板引擎
- 渲染机制
UI库
- 学习快速上手UI库
- 文档学习
- 案例调试
- layerUI
- easyUI
- bootstrap
- WEUI
- Vonic
- mintUI
- elementUI
- Vant
DOM与其他库
- jQuery/zepto
- touchjs/iScroll/swiper
- validator/Lodash
- axios/babel
- wangEditor
- store/qs/cy
开发管理
- 原生库开发
- 第三方库hack
- 需求分析
- 业务规划
- 技术栈选型
- 文件输出规则
- 模型设计
- 底层搭建
- MVC设计模式
- 业务逻辑分类
- 数据分离
- 交互业务封装
- 模块对接
- 面向对象式业务设计
到这里移动端的内容就可以告一段落了,这个阶段的达标水平是能够独立实现移动端H5开发适配各种移动设备,并且能够处理各种兼容问题,能够利用原生js结合H5新特性实现各种功能组件,例如 音频视频播放器、懒加载、下拉刷新等业务组件。这个阶段可以做一个H5播放器进行自测。这里给大家准备了一些H5移动端的学习笔记,学习过程中常见的一些问题在这些学习笔记上都有讲解,有需要可以点击文末的卡片加入到这个WEB前端群932/112 /117 免费获取。平时学习过程中遇见有不懂的地方也可以随时在里面问,大家都会帮忙解答,学习氛围非常好。
④Node服务端开发
这个阶段的学习周期大概在50天左右,需要掌握下面这些内容:
NPM
- npm安装
- npm配置
- npm包管理
- npm本地包安装
- npm依赖管理
- npm版本控制
- npm项目初始
Node
- V8引擎概念
- AMD/CMD/UMD
- fs文件操作
- IO流
- 异常处理
- 中间件
- HTTP模块
- URL/PATH模块
- EventLoop事件轮询
- 同步/异步
- 阻塞/非阻塞
- 宏任务
- 微任务
- 模块管理
- 模块应用
- stream流
- Buffer对象
- Static静态封装
- 路由封装
前后端交互
- HTTP通信交互
- 请求响应、
- MIME
- URI解析
- TCP/IP协议
- socket协议
- 代理/缓存
- 网关/隧道
- ajax异步交互
- 跨域处理
- ajax封装
- axios使用
- 请求拦截
- 请求预验
- Method
- content-type
- cookie/session
- 通信加密RSA/MD5
- 登录注册
接口设计
- 传统接口设计
- 接口文档
- 文档定义
- 数据接口概念与标准
- 状态码设计
- 响应格式
- 协商协议
- 合约说明
- 资源定位符
- 缓存机制
- HTTP头管理
- 松耦合实现
- RESTful设计原则
- RESTful实现
数据库
- 基础概念
- NoSql行为操作
- CAP
- 基础语法
- shell/MongoDB驱动
- 增删改查
- 高级查询操作
- 通道查询
- 多条件查询
- 索引处理
- 聚合管道
- population联表
- validation验证
- 异常处理
服务端项目
- 数据库设计
- 服务端路由设计
- API管理分类
- 注册登录
- 原生路由开发
- 权限/用户/分类
- 模块化功能封装
- 校验库封装
- 行为中控
Node部分掌握这些知识点就OK了,这个部分的达标水准是能够理清完整的WEB应用情景和交互行为,从理论到实践掌握常规数据库设计、路由设计、工程化、模块化、组件化、权限、鉴权、加密、跨域、认证,能够完成从前端到后台到数据库一整条线路的注册、登录、查询、修改、管理等功能。可以尝试做一个博客项目后台实战。
同样的,学习node过程中常见的一些问题,我也整理成学习笔记了,需要可以点击文末的卡片加入这个学习群,我免费分享给大家。
⑤VUE框架篇
这个阶段大概需要40天左右,需要掌握的内容如下:
webpack
- 工程化概念
- webpack配置运行
- plugin插件
- loader使用
- 出入口配置
- 模块依赖处理
- devServer使用
- 文件切分
- 动态加载
- package管理
- 性能优化
- 测试处理
Vue基础
- 工具与插件
- mv*设计模式
- mvvm原生实现
- 生命周期
- 命令属性
- 组件化
- 虚拟DOM
- 数据驱动
- 模板语法
- 条件列表
- 计算属性
- 修饰表单
- 监听过滤
- 组件通信
- 动画动效
- 高级组件
Vue工程化
- webpack配置vue项目
- vue单文件组件
- vuecli命令服务
- 工程平台
- animate
- 兼容处理
- socket/loadsh
- preset
- 静态资源
- 环境变量
- 工程部署
- 打包优化
- 模式转换
- 构建目标
VueRouter
- 路由概念
- 嵌套路由
- 动态路由
- 路由试图
- 编程式导航
- History
- hash模式
- 命名视图
- 重定向/别名
- 导航守卫
- 路由原信息
- 路由拦截
- 滚动懒加载
- 故障处理
- 路由带参
Vuex
- Store
- state
- getter
- mutation
- action
- module
- EventBus对比
- 状态管理模式
- vuex辅助函数
- vuexAPI
- vuex模块化处理规则
- 对象风格提交
- 模块重用
项目开发
- PC+mobile无缝切换
- websocket聊天室
- 第三方组件
- 工具库使用
- 令牌管理
- 文章分类
- 登录注册
- 路由权限管理
- 加密校验
- Auth认真
- HTTP封装
- 富文本编辑
- 文章查询
- 分页管理
- 懒加载
- 组件分类封装
- 组件混合
- 高级组件开发
- ERROR封装
- 重置数据响应
- 通知组件封装
- 工程平台应用
- 项目打包
- 体积优化
- 速度优化
把这些知识点掌握,你就具备找一份工作的实力了。这个阶段的达标水平是能够熟练运用vue、vuex、vuerouter、vue-cli、webpack、postcss、babel以及各种第三方库,实现项目开发需求,独立完成完整的前端现代化工程项目,并且深入框架原理掌握mvvm核心,能够用原生javascript模拟实现vue的内核双向绑定响应式模型。vue这部分的学习笔记,我也帮大家整理好了,有需要也可以点击文末卡片加群,932 112 117获取。
这些内容学完之后,可以做一个Vue博客项目实战进行自测,做完之后就可以准备简历进行投递了。并且我相信你很快就能收到一份满意的offer。
最后再给各位新晋的前端工程师一点建议:入职只是开始,想要在这个行业长期的发展,还是需要不断的去学习。
如果大家对于学习前端还有什么疑虑,可以加入下面这个WEB前端群和我交流,我从事这一行十年了,想通过分享我的经验,能让大家少走一些弯路。我希望把这个WEB前端群打造成一个非常好的前端圈子,有好的工作也可以互相内推。