史上最全面的前端学习资源

2019独角兽企业重金招聘Python工程师标准>>>

1.为什么我会整理这个资源

前段时间，好多朋友私信我，问我有没有什么好的前端学习资源,好多小伙伴学习的东西比较杂，所以我就花了一段时间吧比较经典的学习资源整理分享给大家，在我看来这是目前为止比较全面的前端学习资源，里面的资源大部分是干货，希望大家能完完整整看完一个系列教程，都能成为前端大神。

2.推荐大神文章(文字教程)

2.1 综合类

1. 前端知识体系
2. 前端知识结构
3. Web前端开发大系概览
4. Web前端开发大系概览-中文版
5. 智能社 - 精通JavaScript开发
6. JavaScript中的this陷阱的最全收集--没有之一
7. JS函数式编程指南
8. 腾讯移动Web前端知识库
9. 前端开发笔记本

2.2 html5

1. 深入理解HTML5标签
2. 后HTML5时代I
3. 后HTML5时代II
4. html5推广
5. 匠心打造canvas签名组件
6. HTML5/CSS3（汤姆大叔的博客里面，想深入了解js的原理，首先推荐汤姆大叔的博客）
7. 玩转HTML5移动页面
8. HTML5 进阶系列：文件上传下载
9. HTML5 进阶系列：canvas 动态图表
10. HTML5 进阶系列：拖放 API 实现拖放排序
11. 超多经典 canvas 实例，动态离子背景、移动炫彩小球、贪吃蛇、坦克大战、是男人就下100层、心形文字等等等
12. canvas入门实战--邀请卡生成与下载

2.3 css3基础与进阶

1. CSS3属性教程与案例分享
2. CSS3实现11种经典的CSS技术
3. W3cplus demo
4. 强大的css3
5. css3经典教程系列
6. css3 按钮动画
7. 全局CSS的终结(狗带 [译]
8. browserhacks
9. HTML5+CSS3 loading 效果收集
10. 一个纯CSS3实现的酷炫翻书效果
11. 纯 CSS 实现波浪效果！
12. CSS3实现11种经典的CSS技术
13. 搞定这些疑难杂症，向css3动画说yes
14. Effective前端1：能使用html/css解决的问题就不要使用JS
15. 深入了解 CSS3 新特性
16. 前端如何呼风唤雨
17. :after和:before炫酷用法总结
18. 10 个优质的 CSS 与 JS LOGO 动画示例
19. 【项目总结】扯一扯电商网站前端css的整体架构设计（1）
20. CSS布局方案
21. 20个实用的CSS技巧代码
22. CSS性能分析，如何优化CSS提高性能
23. CSS 黑魔法小技巧，让你少写不必要的JS，代码更优雅
24. 渐进式动画解决方案
25. 奇妙的 CSS shapes(CSS图形)

2.4 Less,sass

1. Sass 中文文档
2. less
3. Sass使用总结
4. vue里怎么用scss
5. Sass 中文文档
6. 编写Sass的八个技巧

2.5 javascript(前端最最重要的一个模块，一切上层建筑的基础)

1. javascript简写技巧
2. javascript深入浅出原型
3. javascript 异步编程魔法
4. 深入理解JavaScript系列 （深入理解javascript最经典教程之一）
5. javascript组件化
6. 从达标到卓越 —— API 设计之道
7. JavaScript 函数式编程存在性能问题么？
8. 前端模板的原理与实现
9. 150行代码教你实现一个低配版的MVVM库（1）- 原理篇
10. 150行代码教你实现一个低配版的MVVM库（2）- 代码篇
11. 如何循序渐进、有效地学习JavaScript
12. JavaScript 进阶之深入理解数据双向绑定
13. 利用 JavaScript 数据绑定实现一个简单的 MVVM 库
14. 前端模板的原理与实现
15. 如何监听页面 DOM 变动并高效响应
16. IntersectionObserver API 使用教程
17. 作为一名前端开发人员，有哪些值得一读的js代码
18. JavaScript 有什么奇技淫巧？
19. 用 JavaScript 可以做哪些有趣的事情？
20. 反击爬虫，前端工程师的脑洞可以有多大？
21. JavaScript 设计模式 ① 正确使用面向对象编程的姿势
22. 如何优雅的编写 JavaScript 代码
23. 如何用原生 JS 实现手势解锁组件
24. Javascript思维导图
25. 纯前端实现人脸识别-提取-合成
26. HTTP中GET与POST的真正区别
27. JavaScript练习网站收集(入门级)
28. 编写自己的代码库（javascript常用实例的实现与封装）
29. JavaScript原型及原型链
30. 通过示例学习JavaScript闭包
31. 原生Javascript实现五子棋
32. JavaScript工程项目的一系列最佳实践策略

javascript扩展(面试题)

1. 那几个月在找工作（百度，网易游戏）
2. 2014最新面试题
3. 阿里前端面试题
4. 2016校招内推 -- 阿里巴巴前端 -- 三面面试经历
5. 年后跳槽那点事：乐视+金山+360面试之行
6. js 也来 - 【拉勾专场】抛弃简历！让代码说话！
7. 前端面试题
8. Web开发笔试面试题 大全
9. 5个经典的前端面试问题
10. 最全前端面试问题及答案总结
11. 如何面试一名前端开发工程师？
12. 史上最全 前端开发面试问题及答案整理
13. BAT及各大互联网公司2014前端笔试面试题
14. 牛客网-笔试面经

由于时间有限，暂时只整理了html5,css3,js相关的知识，稍后会整理 es6,typescript,jquery,vue,react,angular2+,webpack,node,express,mongodb,redis,gulp,git,iconfont,seajs,requirejs 性能优化，博客，技术团队，比较牛逼的社区，常用的工具 如果对你有帮助，请多多关注我，后续我会把视频教程也会分享出来，都是比较经典的

转载于:https://my.oschina.net/jinsanpang/blog/1595394