web前端怎么入门学习
零基础如何系统的学习web前端开发，相信这是很多初学者都会疑虑的问题！这里不多说废话，直接进入正题，零基础如何学习前端开发！
前端与移动开发学习线路图
前端开发总的线路图，这里只是说了一下知识点，下面有更精准的阶段学习，含配套视频。
第一阶段：
能学到什么？会做什么？
- 掌握 HTML 语法及使用技巧；
- 掌握 CSS 语法及使用技巧；
- 掌握 DIV+CSS 布局方式；
- 掌握常见网页布局模式；
- 掌握 HTML5 常用标签；
- 掌握 Photoshop 切图以及插件切图；
- 能够熟练使用开发人员工具进行页面调试；
- 能够完成基本的动画效果；
- 能够根据PSD文件独立完成静态页面的开发工作；
- 能够使用CSS3新属性美化修饰网页。
配套视频：
Web前端入门教程_Web前端入门视频教程
第二阶段：
能学到什么？会做什么？
- 掌握 HTML5 新布局标签、多媒体标签；
- 掌握 CSS3 2D、3D 变换、动画效果；
- 了解移动端屏幕、移动端浏览器、操作系统的不同；
- 掌握常用移动端调试方法；
- 掌握常用移动端适配方法；
- 掌握 CSS 预处理器 less 的使用；
- 掌握常用移动端框架使用方法；
- 掌握常见移动端页面开发；
- 掌握响应式布局开发；
- 掌握 Bootstrap 开发响应式页面；
- 掌握适配不同终端的网页开发技术选型
配套视频：
移动web移动教程
第三阶段：
能学到什么？会做什么？
- 能够掌握 JavaScript 基本语法；
- 掌握常见 JavaScript 算法；
- 掌握 DOM 的各种操作；
- 熟练使用面向对象思想进行 DOM 编程；
- 掌握 JavaScript 的高级语法；
- 熟练使用 jQuery 操作 DOM；
- 熟练使用和编写 jQuery 插件；
- 独立完成电商网站的页面搭建（包括 HTML 结构、CSS 样式、JavaScript 特效）；
- 掌握应对业务编程的能力；
- 掌握 JavaScript 常见兼容性方案；
- 掌握团队合作开发流程。
配套视频：
JavaScript教程_JavaScript视频教程
JavaScript-高级面向对象视频教程
第四阶段：
能学到什么？会做什么？
- 能够建立客户端服务器交互模型，熟悉网络通信相关概念；
- 能够使用 Node.js 进行 Web 服务端开发；
- 能够掌握 JavaScript 异步编程模型；
- 能够掌握 JavaScript 模块化编程方式；
- 能够使用 Node.js 操作 MySQL 数据库；
- 能够理解 HTTP 协议；
- 熟悉原生 Ajax 请求流程与细节，并掌握常见跨域技巧；
- 能够基于 jQuery 的 Ajax 相关 API 熟练开发常见的前端功能；
- 能够独立开发基于后台接口的动态网站、Ajax 数据交互的项目；
- 能够独立完成企业网站从前台到后台的基本开发工作
配套视频：
web前端教程Ajax教程
Nodejs教程精讲
第五阶段：
能学到什么？会做什么？
- 掌握使用 D3.js 进行大数据可视化交互开发；
- 能够掌握使用 Vue 技术栈进行项目开发；
- 能够掌握使用 React 技术栈进行项目开发；
- 能够掌握源代码管理工具的使用；
- 能够熟练掌握前后端分离开发模式；
- 能够掌握使用主流框架开发门户网站、管理系统、移动 Web 等客户端；
- 能够掌握 Webpack 项目构建配置流程；
- 能够掌握 Web 项目的部署与发布模式；
- 能够掌握常见网站业务模块开发。
配套视频：
2018年Vue.js深入浅出教程
reactjs入门教程
ReactJs精品教程
第六阶段：
能学到什么？会做什么？
- 能够掌握小程序的开发基础；
- 能够独立开发小程序项目；
- 能够掌握 Canvas 的使用；
- 能够掌握小游戏开发基础；
- 能够独立开发小游戏项目；
- 能够掌握小程序/小游戏的部署与发布；
- 能够掌握小程序开发框架 WePY 的使用；
- 掌握第三方 AI 平台的使用。
配套视频：
小程序实战开发
第七阶段视频正在抓紧时间录制中，等有了消息，我会第一时间更新的，以上就是零基础前端开发初学者如何系统学习了！
Web前端应用场景会随着移动互联和大数据而得到更加丰富，很多内容需要通过前端进行展示，学习Web前端首先是一个很好的选择。
Web前端的学习对于从零开始的学习者来说是很容易上手的，语法简单，使用环境简单，零基础的初学者在学习过程中容易建立起学习的信心，并且前端开发对基础知识的要求比较低。
不过，前端学习的内容会比较多，所以，在学习过程中要有一套系统的学习方法。
Web前端学习
前端三大基础：HTML、CSS 、JavaScript
前端三大基础，学习顺序为：HTML＞CSS＞JavaScript。
其中，JavaScript要学习的东西多而混乱，要取其精华，去其糟粕，对于语言精华，应该深入学习。
不光要看书，还得练习，练习方面的建议是去W3Cschool官网看看，边学边练，每章后还有小测试。
学完上面的技能，你就可以简单的设计一般的静态网页了，不过这还远远不够。
推荐几本书籍：
《html5从入门到精通》
这本书讲的很系统，作为入门书籍，也比较容易懂，最重要的是有光盘教学，可以放电脑上看看。
css的书籍，这本书也有涵盖html5，有承上启下的作用。
比较出名的一本javascript，被读者称为犀牛书，很推荐。
框架：React、Angular 或者 Vue
学习完前端的三大基础之后，你还需要了解最新的前端框架。
这里就提出Vue 、Angular 、React，大部分人称为VAR，这三个是目前最流行的前端框架。
为什么没有jQuery？确实，初学者认为使用jQuery就可以写出任何特效效果，但是它并不是前端的全部，在工作时间久了之后才会发现，jQuery只是满足当下的业务需求，技术框架是随时会变的。
当然，学习jQuery没有问题，只是多学会框架，有助于提升你的个人技术能力，和你的职场竞争力。
打包工具：Webpack 和 gulp
- 进阶：Node.js 体系（包括 Node.js 服务端开发，npm 等）
Github developer-roadmap 项目整理了一份Web前端开发人员学习路线图，值得看一看。
图片中不同颜色的意义：
- 黄色：推荐；
- 灰色：尽可能学习；
- 橙色：任选其一。
Web前端发展
学习Web前端最好能够向全栈方向发展，这样可以让你在职场中更具有竞争力。
Web全栈程序员是目前科技公司招聘的受欢迎岗位，并且需求量变得越来越大，所以，学习前端要想更上一层楼，有更好的发展，有必要了解一下Web全栈。
