说在开始的话:

我上大学那会,虽说主要是学Java语言,但是web前端也稍微学了一些,那时候对前端也没多在意,因为涉入的不深,可以搞一个差不多可以看的界面就可以了,其他也没过多在意。

因为稍微了解一点点前端,所以看到前端相关资源的时候,总是也会忍不住也收藏下来,这篇文章就把我平时看到的一些关于WEB前端知识体系的脑图给列举出来,因为我一直觉得在学习每门语言之前一定要对这门语言有个概况性认知,不然连自己学到什么程度都不知道(就如我上大学学前端一样,以为前端就这么简单,结果……)。

1、2015-2016前端知识体系

2015-2016前端知识体系.jpg

这是我在看2015-2016前端知识体系这篇文章时,看到的这个脑图,文章也对脑图进行了详细的介绍,可以看看哦,看完后相信你对整个前端会有个概况性的认知的~

2、[Web前端工程师]学习路径

Web前端工程师.png

这个是我在看实验楼学习网站上的Web前端工程师学习路径时看到的,主要是里面有很多的项目课程,这在学完基础之后是非常有用的,多做一些小项目开发始必须的。

3、[前端工程师]需要涉及的知识

front-image.jpg

这个在@拔赤的微博里保存下来的一张图,分享这张图所带的文字是:“2012前端工程师知识结构”。

4、前端知识脑图

前端知识脑图.jpg

这张脑图呢,是在(@寒冬winter)的微博里保存下来的一张图,分享这张图所带的文字是:秋季校招快开始了,我来提前划个重点吧……

嗯,关于前端的知识结构就分享这4张吧,因为我看了看其他的几张也都大同小异,主要是我没记录图片的出处(>_<),所以就不放出来了,我想以上四张对于前端的认知就足够了,对于想入门做前端工程师的小伙伴也是足够了,剩下的就需要踏踏实实的学基础,以及勤动手了。

5、前端测试工具

前端测试工具.png

最后再分享一张前端测试工具的图,但是这张图片我不知道出处了,所以请原作者看到后一定要记得联系我啊,我加上出处。分享这张图的目的是:在我们学习的过程中,往往不太知道怎样进行测试,也不太注重这方面,但是测试确实很重要滴,所以就分享出来了。

说在后面的话

其实上面的图片呢也只能帮助想入门的小伙伴,对于已经入门的小伙伴就需要自己去积极的找一些资源了,我把我看到的一些资源发出来吧,可以参考参考:

参考站

http://www.jianshu.com/p/00baf1e65322

jpg改rar

WEB前端知识体系脑图的更多相关文章

  1. web前端知识体系总结

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  2. 自己总结的web前端知识体系大全【欢迎补充】

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  3. web前端知识体系大全

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  4. web前端知识体系小结(转)

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  5. Web前端知识体系精简

    Web前端技术由html.css和javascript三大部分构成,是一个庞大而复杂的技术体系,其复杂程度不低于任何一门后端语言.而我们在学习它的时候往往是先从某一个点切入,然后不断地接触和学习新的知 ...

  6. Web前端知识体系

    看到一篇不错的文章,拿来收藏和分享. 原文:http://mp.weixin.qq.com/s/UFTfdE7LYhHquWEzwZKLCQ Web前端技术由html.css和 javascript三 ...

  7. web前端知识体系大全【欢迎补充】

    大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的是想要颠覆人 ...

  8. web前端知识体系大全【转载】

    自己总结的web前端知识体系大全[欢迎补充]   1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在 ...

  9. Web前端知识体系V0.1

    学习,是一个建立“索引”的过程-好比我们读一本书,读完之后,再次看这本书的目录结构,就会联想起很多书中的具体内容: 博客,是一个回顾所学的载体-学习完教学Video之后,通过书写博客,以达到记忆的目的 ...

随机推荐

  1. 【转】Git如何Check Out出指定文件或者文件夹

    [转]Git如何Check Out出指定文件或者文件夹http://www.handaoliang.com/a/20140506/195406.html 在进行项目开发的时候,有时候会有这样的需求那就 ...

  2. AC自动机题目汇总

    POJ 4052 ZJU 3430 HDU 4117 HNU 10104 HDU 2457 HNU 11187 ZJU 3545 HDU 3341

  3. iOS 在类别里添加成员变量的方法:objc_setAssociatedObject

    今天在github上查看MJPopupViewController这个项目,发现里面用到了objc_setAssociatedObject,用来为类别添加成员变量. 我百度之后,发现有人是这样说明的: ...

  4. MySQL 利用SQL线程对Binlog操作

    背景: 对于MySQL的binlog的查看都是用其自带的工具mysqlbinlog进行操作的,其实还有另一个方法来操作binlog,就是Replication中的SQL线程去操作binlog,其实bi ...

  5. 向数据库中全部表中增加一个字段的SQL

    SELECT 'ALTER TABLE ' + NAME + ' ADD 字段名 int not null default 0' FROM sysobjects AS sWHERE s.[type] ...

  6. 用 get 同步/异步 方式获取网络数据并输出

    //同步请求 //创建NSString用来存储请求的网址 NSString* str=@"http://v.juhe.cn/weather/index?format=2&cityna ...

  7. C# 总复习

    1.循环语句 四要素:初始条件.循环条件.循环体.状态改变 循环的最后一句:循环条件不再满足 2. ++     --int a = 5; //在赋值语句中,后++需要,先进性赋值,然后进行+1运算 ...

  8. 引入Fresco

    这里告诉你如何在项目中引入 Fresco. 使用 Android Studio 或者其他 Gradle 构建的项目 编辑 build.gradle 文件: 1 2 3 4 dependencies { ...

  9. 字符串与byte数组转换

    string weclome=""; byte[] data = new byte[1024]; //字符串转byte数组 data = Encoding.ASCII.GetByt ...

  10. LeetCode 453 Minimum Moves to Equal Array Elements

    Problem: Given a non-empty integer array of size n, find the minimum number of moves required to mak ...