你好，我自己主要是做后台开发，对前端稍有了解，所以我觉得初学者更快入门web前端，以下是关于web前端方面的教程知识点。web前端是app开发、h5网页等主流的程序语言，而且待遇报酬高，较其他计算机语言更加容易入门。
1）先学html5+css基本语法
2）学些css的框架，比如less，bootstrap等
3）js是必然会涉及的，学jquery吧，简单易学，实例多
4）别光看，多动手，把1）到3）串起来，做个项目，或虚拟一个，比如购物车，或博客
几个要点，供参考
专注一条线，前端涉及知识点太多，别都学，杂而不精。
前端+HTML5德 学习内容：
第一阶段：前端页面重构：PC端网站布局、HTML5+CSS3基础项目、WebAPP页面布局；
第二阶段：JavaScript高级程序设计：原生JavaScript交互功能开发、面向对象开发与ES5/ES6、JavaScript工具库自主研发；
第三阶段：PC端全栈项目开发：jQuery经典特效交互开发、；
第五阶段：混合（Hybrid）开发：各类混合应用开发；
第六阶段：NodeJS全栈开发：WebApp后端系统开发。
主流框架下面介绍了5种比较流行的前端框架
1. AngularJSAngular JS 是一个有Google维护的开源前端web应用程序框架。它最初由Brat Tech LLC的Misko Hevery于2009年开发出来。Angular JS是一个模型-视图-控制器（MVC）模式的框架，目的在于使HTML动态化。与其他框架相比，它可以快速生成代码，并且能非常轻松的测试程序独立的模块。最大的优势是在你修改代码后，它会立即刷新前端UI，能马上体现出来。它是用于SPAs（单页面应用）开发中最常用的javascript框架。Angular JS是一个全功能的框架，可能也是最流行的框架。缺点就是学习起来有点困难。
优点：模板功能强大丰富，并且是声明式的，自带了丰富的Angular指令；
是一个比较完善的前端MVVM框架，包含模板，数据双向绑定，路由，模块化，服务，过滤器，依赖注入等所有功能；
ng模块化比较大胆的引入了Java的一些东西（依赖注入），能够很容易的写出可复用的代码，对于敏捷开发的团队来说非常有帮助，我们的项目从上线到目前，UI变化很大，在摸索中迭代产品，但是js的代码基本上很少改动。
良好的文档。
双向数据绑定简化了流程的某些部分。
缺点：验证功能错误信息显示比较薄弱，需要写很多模板标签；
ngView只能有一个，不能嵌套多个视图，虽然有angular-ui/ui-router 解决，但ui-router 对于URL的控制不是很灵活，必须是嵌套式的；
对于特别复杂的应用场景，貌似性能有点问题，特别是在Windows下使用chrome浏览器，不知道是内存泄漏了还是什么其他问题，没有找到好的解决方案，奇怪的是在IE10下反而很快，对此还在观察中；
ng提倡在控制器里面不要有操作DOM的代码，对于一些jQuery 插件的使用，如果想不破坏代码的整洁性，需要写一些directive去封装插件，但是现在有很多插件的版本已经支持Angular了，最好能够和cordova插件结合进行混合式开发；
Angular 太笨重了。
双向数据绑定检查数据模型的变化，这可能导致可能的性能问题并且更快地耗尽设备的电池。
理解代码和调试困难。
2. ReactJSReact JS 不像一个框架反而更像一个库，但绝对是值得一提。AngularJS是一个MVC模式的框架，但ReactJS是一个由Facebook开发的非MVC模式的框架。它允许你创建一个可复用的UI组件，Facebook和Instagram的用户界面就是用ReactJS开发的。你可以用React进行很复杂的更新并且应用运行仍然很快，因为框架本身能很快的处理他们。你也能写许多可复用的小文件，而不是编写一个大文件。对于要处理大量数据的大型程序来说这是最好的选择。这个框架的缺点之一就是它只处理应用程序的视图层，所以你可能需要结合其他工具来一起处理。
优点：1.掌握起来很容易。
2.在React中很容易维护隔离的组件。
3.组件的不断重新渲染提供了有效的安排
复杂。
4.方便的架构 - Flux - 与MVC竞争激烈。单向数据流
提供数据和DOM元素的可维护性和有效安排。
它是当今广泛使用的最轻量级框架。
缺点：1.DOM操作库的一些问题是可能的（例如，jQuery）。
2.频繁的重新渲染可能会减慢处理大量数据的APP的工作。
3. MeteorJSMeteorJS 发布于2012年，涵盖了开发周期的所有阶段，包括后端开发、前端开发、数据库管理。它是一个由NodeJS编写的开源框架。MeteorJS是一个简单和容易理解的框架，所有的包和框架都可以轻松使用。代码层的所有改变能够立即更新到UI界面，服务的和客户端都只需要用javascript开发。他主要用于IKEA和马自达等公司的实时应用开发。不建议用于大型或复杂的程序。
优点：1.易学
2.偏向客户端
3.响应式
4.代码高度重用
缺点：1.运算密集型应用能力差
2.成熟度不高
3.约束少
4.初次加载时间长
4. Vue.JS在了解React和Angular后，你可以尝试了解下VueJS，一个用于用户界面开发的渐进式javascript框架。它是一个能快速开发和跨平台的方案。与Angular和React相比较，它被证明速度更快，并且吸收了这两者的优点。Vue的创始人是尤雨溪，他曾在Google工作并使用Angular。他的想法是直接抽取出他喜欢的Angular的特性，不再引入其他复杂的理念而打造一款新的框架。所有的Vue模板都是基于HTML，你可以在GitHub上找到很多资源。它也提供双向绑定和服务端渲染。在Vue中，你可以使用模板语法或使用JSX直接编写渲染函数。
Vue.js 是一套构建用户界面的渐进式框架。
Vue 只关注视图层， 采用自底向上增量开发的设计。
Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
优点：1.双向数据绑定 也就是所谓的响应式数据绑定。这里的响应式不是@media 媒体查询中的响应式布局，而是指vue.js会自动对页面中某些数据的变化做出同步的响应。
也就是说，vue.js会自动响应数据的变化情况，并且根据用户在代码中预先写好的绑定关系，对所有绑定在一起的数据和视图内容都进行修改。而这种绑定关系，就是以input 标签的v-model属性来声明的，因此你在别的地方可能也会看到有人粗略的称vue.js为声明式渲染的模版引擎。
这也就是vue.js最大的优点，通过MVVM思想实现数据的双向绑定，让开发者不用再操作dom对象，有更多的时间去思考业务逻辑。
2.组件化开发
在前端应用，我们是否也可以像编程一样把模块封装呢？这就引入了组件化开发的思想。
Vue.js通过组件，把一个单页应用中的各种模块拆分到一个一个单独的组件（component）中，我们只要先在父级应用中写好各种组件标签（占坑），并且在组件标签中写好要传入组件的参数（就像给函数传入参数一样，这个参数叫做组件的属性），然后再分别写好各种组件的实现（填坑），然后整个应用就算做完了。
3.Virtual DOM
现在的网速越来越快了，很多人家里都是几十甚至上百M的光纤，手机也是4G起步了，按道理一个网页才几百K，而且浏览器本身还会缓存很多资源文件，那么几十M的光纤为什么打开一个之前已经打开过，已经有缓存的页面还是感觉很慢呢？这就是因为浏览器本身处理DOM也是有性能瓶颈的，尤其是在传统开发中，用JQuery或者原生的JavaScript DOM操作函数对DOM进行频繁操作的时候，浏览器要不停的渲染新的DOM树，导致页面看起来非常卡顿。
而Virtual DOM则是虚拟DOM的英文，简单来说，他就是一种可以预先通过JavaScript进行各种计算，把最终的DOM操作计算出来并优化，由于这个DOM操作属于预处理操作，并没有真实的操作DOM，所以叫做虚拟DOM。最后在计算完毕才真正将DOM操作提交，将DOM操作变化反映到DOM树上。
4.轻量高效
5. BackboneJSBackbone是一个MVP模型，它依赖于Underscore.js库。它旨在开发单页面web应用，并保证不同部分的web应用同步。它采用命令式的编程风格，与使用声明式编程风格的Angular不同。Backbone也与后端代码同步更新，当模型改变后HTML页面也随之改变。Backbone被用来构建Groupon, Airbnb, Digg, Foursquare, Hulu, Soundcloud, Trello等许多知名应用。
优点：将数据和界面很好的分离开来。
将事件的绑定很好的剥离出来，便于管理和迭代。
使得Javascript程序的模块化更加清晰、明了。
