学习web 前端，首先，好的学习方法很重要，另外，知道要学习哪些阶段也是必不可少。以下分析web 前端学习的6 大阶段，相信对于刚刚接触前端的新手来说会有很大的帮助。

第一阶段：Web 页面制作

整体目标：掌握传统pc 端网页布局和制作

阶段目标 : 精通掌握HTML5 的应用；

掌握CSS 在开发中的使用；

学会页面标准化布局；

掌握ps 基础，切图，基础网页设计等

实战案例 : 高防大型网站的模板：

门户网站主要模板（新浪）

商城全部模板（京东）

第二阶段：编程基础技术

整体目标：JS 完成一些常见网页特效开发

阶段目标 : 掌握 JS 基本语法与流程控制相关操作；

使用 JS 结合 HTML 实现代表性的 JS 特效制作；

可以独立完成网页中常见特效的编写以及第三方特效插件的使用；

掌握文件操作&canvas ；

了解ECMAScript6 新特性;

实战案例 : 结合js 实现动态页面京东，淘宝，腾讯视频。

第三阶段：移动互联网应用

整体目标：掌握现在主流的页面制作技术，可以完成微网站的制作和微信小程序开发，并可以做到多设备兼容。

阶段目标 : 掌握HTML5 新增的智能表单的使用； 

  掌握优化的各种方式； 

  掌握响应式页面布局技术;

使用touch 框架搭建移动端页面、宣传页面； 

  掌握swiper+animate 框架；

掌握微网站的开发过程与微信小程序开发；

   掌握如何开发移动端web 应用;

了解移动应用的流行框架 zepto 并掌握移动端的手势与触摸事件

实战案例 : 饿了么，华侨城 仿北京银行 仿太平洋保险，仿微信，Swiper+animate 项目，Zepto+touch 项目，微信小程序

第四阶段：特效开发高级实战

整体目标：通过实际项目开发，精通前端常用框架的实际应用及问题解决，以及常见特效开发、前后台交互开发

阶段目标 : 利用jQuery 框架进行js 特效开发

掌握Bootstrap 的使用

了解AJAX 的运行原理

使用MUI 库，完成Android 和IOS 的移动设置应用开发

实战案例 : 京东商城，腾讯视频PC 端，MUI 项目

第五阶段：

整体目标：了解 WEB 服务器工作原理，并可以简单的搭建自己的应用程序服务器端

阶段目标 : 掌握 HTTP 与 WEB 工作原理

掌握 Socket 长连接实时网络通信技术

掌握 NoSQL 中的 MongoDB 的应用

了解 PHP 语法；了解 MySQL 数据库的基本操作

实战案例 : 京东，淘宝，腾讯视频

第六阶段：

整体目标：能够独立使用 HTML5 完成 APP 开发制作

阶段目标 : 使用web 制作LBS 应用程序;    在应用中使用多线程技术完成UI 交互与数据处理并行;    熟悉vue 框架、图表highcharts 的使用;

了解和掌握触屏和手势相关的事件使用方式，能够通过媒体查询和多列布局属性实现屏幕自适应，实现响应式布局；

了解和掌握不同的设计模式以及其适合的企业APP ，并且能够将其应用在程序设计中；

掌握组件的核心理念，熟练运用数据绑定及表单处理并了解Angular4 应用运用的响应式编程的理念；

通过对react 的学习，可以很好地理解模块化，组件化的概念，并熟练运用相关的语法；

实战案例 : 腾讯视频，京东商城，华清官网，乐淘商城完成四维一体综合项目（PC 端，移动端，微信端，混合APP ）

以上就是一个完整的前端学习阶段了。这是经过大量的行业需求分析而制定的，具备了全面的前端开发所需要的知识点，帮助你融会贯通各项技术的原理机制，成为理论与实战兼备的高级前端开发人才。