前端学习路线图—流程篇：
二、前端学习路线图—视频篇：
前端视频篇第一阶段-准备篇 |
本阶段前端课程共计5个知识点，5个免费视频涵盖 |
1、周期与目标： 学习周期：15天 学完后目标： 1、熟悉媒体查询和响应式设计，使得设计有适配不同的移动; 2、熟悉基础CSS的格式和CSS盒模式; 3、理解网页间是如何链接的、如何设计多列布局，可以处理表单字段和媒体元素; 4、理解如何创建和浏览一个基本的网页。 |
2、知识点: 1）开发工具的安装配置的介绍 sublime、webstorm、Visual Studio Code 2）HTML 理解如何浏览和创建网页、基本的语法规范、常用标签及属性、网页之间的链接与跳转、标签节点层级节点 3）CSS 基本语法和三种书写位置、选择器和格式化排版、盒模型的高级用法、常用布局模型 4）JavaScript入门 基础语法和变量、数据类型和数据类型转换、条件判断、循环语句、函数、数组等内置对象 5）京东首页实战 CSS代码抽象与复用、 浮动的盒子布局、padding 和 margin 使用、层级的使用、定位特性的各种使用场景 |
教程下载：
前端与移动开发基础 ：http://pan.baidu.com/s/1jIcd84e（此教程对应知识点1 2 3 5知识点）
2、CSS梅兰商城项目实战视频教程 http://pan.baidu.com/s/1pLlRwDl
Javascript教程：
JavaScript基础视频教程：http://pan.baidu.com/s/1skMeNvB
JavaScript 基础加强：http://pan.baidu.com/s/1skDXr6t
（此教程对应4知识点）
前端视频篇第二阶段-基础篇 |
本阶段前端课程共计4个知识点，共计1个免费配套视频涵盖 |
1、周期与目标： 学习周期：20天 学完后目标： 1、能够基于jQuery实现炫酷效果和复杂的功能模块； 2、能创造或添加自定义效果到网页上； 3、能熟练添加标准的动画效果到网页上； 4、熟练操作DOM模型。 |
2、知识点： 1）JavaScript基础 JS语言的基本构成、变量、数据类型、表达式、选择结构、循环结构、短路语句、函数基础 2）DOM + BOM DOM基本结构、节点对象的操作、事件特性及使用、常见的内置DOM对象、常见的BOM功能 3）网页特效与进阶 在网页特效中常用的编程接口、动画编程、事件对象和冒泡、缓动框架封装和旋转木马案例、正则表达式及应用 4）Jquery 选择器、基本操作API、动画API、事件API、插件机制、原理分析、项目实战 |
推荐教程
JavaScript 基础加强 ：http://pan.baidu.com/s/1skDXr6t （对应知识点1）
前端视频篇第三阶段——核心篇 |
本阶段前端课程共计5个知识点，合计3个免费视频涵盖 |
1、周期与目标： 学习周期：20天 学完后目标： 1、能够基于jQueryMobile/Zepto等框架进行移动端js功能开发； |
2、知识点： 1）HTML5 + CSS3 语义化结构、多媒体 、本地存储、其他常见API、CSS3 选择器、CSS3 边框、背景、阴影、CSS3 过渡和动画、CSS3 伸缩布局、Canvas 2）服务端编程 端的概念、Web 服务器的概念、服务器搭建、XML与JSON 3）PHP PHP基础语法 、PHP服务端编程基础 4）AJAX 基本编程接口、异步数据交互、模板引擎的使用、跨域的实现方案、增量加载 5）移动Web开发 响应式布局、Bootstrap框架深度使用、Zepto.js库、预编译CSS |
推荐视频：
最新H5+CSS3教程视频 ：http://pan.baidu.com/s/1eSJtHiM（此免费视频对应上述1知识点）
《年最新AJAX教程： http://pan.baidu.com/s/1qXWqpDa（此免费视频对应上述 4知识点）
《传智前端就业班视频分享：移动web开发课程》http://pan.baidu.com/s/1cuztnw （此免费视频对应上述 5知识点）
前端视频篇第四阶段——进阶篇 |
本阶段前端课程共计4个知识点，合计2个免费视频涵盖 |
1、周期与目标： 学习周期：15天 学完后目标： 1、熟练使用闭包、高级函数、立即执行函数(匿名函数)等； 3、熟悉JavaScript基本语法。 |
2、知识点： 1）面向对象在JS中的体现与实践 面向对象理论、对象的基本概念、对象的属性和方法、通过字面量创建对象 2）开发过程中常用的模式与思想 开闭原则、MVC思想、高内聚低耦合、工厂模式 3）JavaScript高级特性 通过构造函数创建对象、原型对象、继承的多种实现方式、原型链、函数的本质以及 Function 构造函数、作用域链、闭包、沙箱模式 4）封装一个自己框架 选择器框架、CSS操作封装、属性操作封装、其他DOM操作的封装、事件框架的封装 |
视频教程推荐：
JavaScript-高级面向对象视频教程：http://pan.baidu.com/s/1o8POXKm
JavaScript高级框架设计：http://pan.baidu.com/s/1nvNjnnF