进阶攻略|前端完整的学习路线

众所周知css并不能算是一们真正意义上的“编程”语言，它自己没法未完成像其它编程语言同样的嵌套、继承、设置变量等工做。为了解决css的不足，开发者们想到了编写一种对css进行预处理的“中间语言”，能够实现一些“编程”语言才有的功能，而后自动编译成css供浏览识别，这样既必定程度上弥补了css的不足，也无需一种新的语言来代替css以供浏览器识别。因而css预处理语言SASS就应运而生了。

进阶阶段

互联网的快速发展和激烈竞争，用户体验成为一个重要的关注点，致使专业前端工程师成为热门职业，各大公司对前端工程师的需求量都很大，要求也愈来愈高，优秀的前端工程师更是稀缺，学完以上的基础，作完项目，差很少就能够了吗？答案是No，想要成为一个更加优秀的工程师，进阶阶段攻略必不可少。

快速开发框架和基础库

Express简介：http://www.runoob.com/nodejs/nodejs-express-framework.html

MVC简介：http://www.runoob.com/design-pattern/mvc-pattern.html

jQuery ：http://www.jq22.com/jq1-jq4

Zepto教程：http://www.runoob.com/w3cnote/zepto-js-source-analysis.html

Swiper 教程：http://www.swiper.com.cn/

iScroll教程： http://wiki.jikexueyuan.com/project/iscroll-5/

Sea.js 手册与文档：http://www.zhangxinxu.com/sp/seajs/docs/zh-cn/module-definition.html

MooTool 中文手册：http://www.chinamootools.com/

模块化

ES6 Module整理：http://www.javashuo.com/article/p-tciiupjf-cv.html

CommonJS中文网：http://www.php.cn/js-tutorial-360130.html

webpack 教程：http://www.runoob.com/w3cnote/webpack-tutorial.html

browserify 教程：http://www.gulpjs.com.cn/docs/recipes/browserify-with-globs/

JS模块化工具requirejs教程：http://www.runoob.com/w3cnote/requirejs-tutorial-1.html

ECMAScript 语法 : http://www.w3school.com.cn/js/pro_js_syntax.asp

Gulp构建化工具官网:https://gulpjs.com/

SuperSlide.js教程： http://www.superslide2.com/

zoom.js教程：http://lab.hakim.se/zoom-js/

Node.js教程:http://www.runoob.com/nodejs/nodejs-tutorial.html

UI框架：这里就不一一介绍了，参考上一篇文章：《前端最全的框架总结》

WeUI：http://www.runoob.com/w3cnote/weui-for-weixin-web.html

Highcharts 图表教程：http://www.runoob.com/highcharts/highcharts-tutorial.html

ionic 教程：http://www.runoob.com/ionic/ionic-tutorial.html

Framework教程： http://www.w3cplus.com/resource/tags/187.html

NPM 使用介绍:http://www.runoob.com/nodejs/nodejs-npm.html

Framework即架构，它是一个语言开发软件，提供了软件开发的框架，使开发更具工程性、简便性和稳定性。NET Framework经过COM Interop（COM互操做）技术支持COM+和MTS。一个传统的COM应用程序可以调用一个.NET组件，同时.NET组件（在.NET中称为.NET Assembly）也可以调用一个COM组件。这一很是强大的双向互操做特性使你能够在应用程序中混合使用两类技术。

高级阶段

在前端这个行业摸爬滚打久了，天然学到的东西会愈来愈多，在大多数人眼里，互联网前端开发是一个有着高薪水、高职业荣誉感的行业。没错，随着互联网大环境的快速崛起，HTML5的发展，绝对属于既有“钱景”还有前景的的朝阳行业。高收入、前景光明，即便对前端开发的要求愈来愈高，也仍是有许多新人愿意来一试身手，纷纷打破头往这个行业里面涌。从小白到前端大神的华丽转身就在此咯

PHP教程：http://www.runoob.com/php/php-tutorial.html

Ruby教程：http://www.runoob.com/ruby/ruby-tutorial.html

MySQL教程：http://www.runoob.com/mysql/mysql-tutorial.html

Redis 教程:http://www.runoob.com/redis/redis-tutorial.htm

MongoDB 教程：http://www.runoob.com/mongodb/mongodb-tutorial.html

Hybrid混合式开发： http://www.infoq.com/cn/articles/hybrid-app-development-combat/

Linux教程:http://www.runoob.com/linux/linux-tutorial.html

Vue.js 入门教程：http://www.runoob.com/w3cnote/vue-js-quickstart.html

AngularJS教程：http://www.runoob.com/angularjs/angularjs-tutorial.html

React.js 教程：http://www.runoob.com/react/react-tutorial.html

Require.js 教程： http://requirejs.org/

BackBone中文文档：http://www.css88.com/doc/backbone/

Knockout.js 教程：http://www.aizhengli.com/knockoutjs/knockoutjs.html

Ember.js教程：https://emberjs.com/

ECMAScript6:http://blog.csdn.net/daily886/article/details/53765658

微信小程序开发资源汇：http://www.runoob.com/w3cnote/wx-xcx-repo.html

移动端教程：http://www.runoob.com/w3cschool-app

完整线路图：http://blog.csdn.net/u011047006/article/details/52597178

polymer中文网：https://polymer-zh.cn/

Deft.js官网：http://deftjs.org/

ASP.NET MVC教程：http://www.runoob.com/aspnet/mvc-intro.html

拓展技能

前端的技术多到学不完，因此，对于开发中经常使用的，必定要多看多练，作到对某一项精通，其他的都是换汤不换药，再辅助性道德进行学习，能够不断拓展本身的知识面，下面是一些拓展技能，虽不涉及技术，但必定能够提升自身的竞争力。花瓣，必应，千图本是设计师的网站，做为前端工程师，有时也会充当UI的角色

SEO优化:http://www.searcheo.cn/post/seo.html

站长之家：http://www.chinaz.com/

Python基础教程：http://www.runoob.com/python/python-tutorial.html

必应网：https://cn.bing.com/

花瓣网：https://huaban.com/

千图网：http://www.58pic.com/

开发工具

Web市场上有不少Web前端开发工具，有的是开源的，能够免费的使用它们用来教学或调试程序，有的使用方便，有的拥有强大的功能等，每一种都有不一样的优点。咱们能够从中学习适合本身是工具。Web前端开发工具种类不少，因此极大地知足了不一样需求的开发人员的不一样需求等等。这些平台颇有趣，交互性强，特别适用于初学者。

Markdown菜鸟教程网：http://blog.csdn.net/simplebam/article/category/6685809

Eclipse 教程：http://www.runoob.com/eclipse/eclipse-tutorial.html

ps使用教程：http://www.16xx8.com/

HBuilder 使用教程:http://www.runoob.com/w3cnote/hbuilder-intro.html

WebStorm使用教程：https://www.jetbrains.com/webstorm/

Dreamweaver：http://www.qinxue.com/220.html?sysref=dreamweaver

Github 简明教程：http://www.runoob.com/w3cnote/git-guide.html

SVN 教程：http://www.runoob.com/svn/svn-tutorial.html

Google使用全攻略：https://www.w3cschool.cn/googlesyqgl/

nodepad++：

轻量化，软件下载下来只有6MB，解压后不过10MB左右，其中还包括了语言文件帮助文件等。绿色开源，Notepad++是一款符合GPL协议的开源软件，一样能够在官方下载ZIP包解压即用。和不少文本编辑器同样，提供了代码补全，代码高亮功能，但其中有的需依赖插件的扩展。

Fireworks：

是Adobe推出的一款网页做图软件，软件能够加速 Web 设计与开发，是一款建立与优化 Web 图像和快速构建网站与 Web 界面原型的理想工具。Fireworks 不只具有编辑矢量图形与位图图像的灵活性，还提供了一个预先构建资源的公用库，

Sublime：

Sublime Text具备漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操做系统。

编译工具：

Grunt 教程：http://www.w3cplus.com/blog/tags/372.html

Gulp 基于流的自动化构建工具：http://www.gulpjs.com.cn/

Brunch 构建工具：http://hao.jobbole.com/brunch/

Yeoman构建工具：http://www.jianshu.com/p/9f3e6bcdb274

webpack：http://www.runoob.com/w3cnote/webpack-tutorial.html

babel编译工具：http://www.ruanyifeng.com/blog/2016/01/babel.html

Git版本管理：http://www.uml.org.cn/pzgl/201204285.asp

前端工具库：http://www.qdfuns.com/tools.php

另外，还有不少工做中使用的工具，在下一篇文章《前端工程师必备工具》有完整的介绍，敬请期待。未完待续。。