前端无论怎么变化,核心终究是:HTML,CSS,Javascript
注意,该学习路径是在短时间内学习的核心要点
每天学习7个小时计算
0.准备阶段
- 要求学历至少大专以上
- 英语要求会记住单词
- 思维逻辑要求是正常人
- 电脑一台
- 开发工具vscode 网上下载
- 关键核心:有对前端编码的兴趣和学习的毅力
1.入门阶段
学完可以做基本的静态网页,可以看面试题中的HTML,CSS部分,这个是非常基础的本分。
学习时间:70h(2周)
学习内如下:
HTML
- 语义标签:html5新标签
CSS
- 选择器
- 盒子模型
- 定位、浮动
- 动画
- CSS常用属性:边框、圆角、背景、宽高、溢出
- BFC
- flex属性以及布局
- css 常用单位:px、%、rem、vh、vw、em
HTML,CSS综合布局练习
- 达到看到现有网站,自己心里很清楚怎么实现界面效果的
- 响应式布局方案:%,rem, 媒体查询器,vh,vw,缩放
- 看bootstrap,样式源码
2.Javascript基础
学完可以开发一个前端网站了,但距离实习还差很远
学习时间:35h(2周)
学习内容如下:
- js基础语法:变量、流程控制、循环、运算符、比较符、函数、数据类型、回调函数
- dom编程:常用的增删改查dom的方法、属性、事件
- bom编程:window常用的浏览器属性、方法
- ajax、Fetch API
3.Javascript进阶
这个阶段的内容非常重要,关系到之后的进一步学习
学习时间:35h(1周)
学习内容如下:
- js作用域
- js原型链、继承
- 闭包、立即执行函数
- es5中的常用遍历函数
- 引用数据与基础数据的区别,以及如何复制引用数据
- this指向问题
4.构建工具学习
学习时间:28h(4天)
学习内容如下:
- nodejs 中的express 玩demo学习
- webpack构建工具常用配置学习
5.Vue
主要看官网文档,加上github搜索项目练习
学习时间:70h(2周)
学习目标,熟练使用vue的各种语法,以及常用UI框架
6.ES6
该阶段是js的新语法,必须掌握,工作中会使用
学习时间:70h(2周)
- 新的变量定义,数据结构
- 箭头函数
- 对象新属性
- promise、async、await
- class
注意5,6会一起学习
7.github,掘金搜索前端面试相关的面试题集锦,大量刷题,大量记忆(不要觉得low ,短时间内的高效方法),但要理解搞懂
准备方向:
- HTML
- CSS
- JS/ES6
- Vue各种原理
- webpack loader,plugin自定义
- 常用排序算法
- http协议,tcp握手,OSI7层网络模型
- event loop,宏任务,微任务
- 跨域方式
- 前端常用的设计模式
以上学习路径,是非常基础,全部学习完,0基础的朋友至少需要3个月;有编程经验的朋友,学习时间可以大幅缩减。