在初学者心目中web前端开发就是学习html、css、JavaScript;如果是在2016、2017年是的前端的小伙伴只需要掌握这些就够了，但是随着行业的不断发展，前端技术得到广泛的应用，前端岗位从web前端开发到前端全栈开发，对技术知识点的要求也在不断的变化，那么web前端开发需要掌握哪些技术呢?华清远见的小编姐姐为你详细描述：

具体来说前端可以分为以下四个大的学习模块，循序渐进的开始学习：

1、HTML+CSS(基础)

目标与能力界定：与UI对接，能100%重构网站静态页面的开发，为后期编写页面逻辑、动态效果打基础

html、css这部分是属于公共基础部分，不仅学习前端必须学习，就算从事Java开发、web安全等岗位这都是必须要掌握的基础技术。而这部分的学习内容相对来说比较容易入门，比较简单，能快速的掌握，对于除学者来说能提升大家的学习兴趣。建议学习完这部分后可以尝试模仿一些网站进行还原，记住学一万遍不如练一遍。

重难点提醒：css3进阶属性，动效，高级布局，响应式布局，移动端适配，移动端弹性布局。

2、JavaScript基础

目标与能力界定：编程基础概念，培养逻辑思维能力。能够独立完成网站的页面开发(包括合理布局，JavaScript操作DOM)

JS是整个前端的核心技术语言，在网站想想要实现一些炫酷的功能就必须要涉及到JS。JavaScript,IS是很强大的一门语言，但是他的内容实在大多了，而且有很多内容是糟粕， 新手是无法区分精华与糟粕的，这就造成了新手无从下手学习。JS也是一门复杂的语言，需要很明白的人给你讲才不会乱，否则你很难理解其中的要点。还是建议有人带着你系统学习。网络上看似有很多免费的体系，但是核实的绝不会给你讲解。

JavaScript基础需要学习的知识要点：

ECMA 基础语法

逻辑分支选择

逻辑分支选择

ECMA 函数

ECMA 内置对象(Array)

ECMA 内置对象(Math、Date)

ECMA 内置对象 (string)

DOM 基础

DOM 样式

BOM对象

事件

事件对象(Event)

表单和正则表达式RegExp

jQuery 基础

重难点提醒：ECMA 函数

建议综合拉练1-2个：jQuery 项目

3、JavaScript进阶+Node+H5 API

目标与能力界定：深入面向对象编程，具备移动端开发能力，处理浏览兼容问题，深入学习ES6/ES7语法规范，前后端分离开发思想

建议学习模块：

JS 面向对象

H5 API Canvas

jQuery 及插件封装 移动端插件开发

Node服务器与数据库 H5 API

ES6/ES7

本阶段的知识点相对来说有难度的比较多了，比如：JS 面向对象里面的递归;Node服务器里面的知识点：HTTP/S协议(请求头，响应头，get，post，浏览器缓存);ES6/ES7里面的：Promise(asycn,await)、typescript。

到了这个阶段就不是像学习HTML里面标签那么轻松啦!

4、web全栈+框架

目标与能力界定：深入了解Node，数据库操作，前后端分离技术，前后台协作开发。深入学习组件化开发思想，技术复习，实战项目。

框架在2018年以前可能你会VUE、React、微信小程序三大框架里面的其中一个就OK，那么到了2020年哪怕是应届毕业生你找实习工作也不行啦，这些都是必须要学习的。而且前端的框架技术更新是非常快的3-6个月就会更新一次，所以最好是有人带着你学习，要不然学习了半年后等你找工作的时候发现为什么企业都不用这些技术了而浪费了大把的时间。

最后友情提示：除了以上的四大点内容，你还需要了解以下知识体系：

函数式编程，LBS(高德地图)

数据解构与算法简介(O时间复杂度)

PWA，ServiceWorker，Taro

SSR(nuxt)

混合开发(uni-app，ReactNative)