前端开发免费资源大汇总
本列表会不定期更新。更新后会在公号通知。
1、前端小白到大神，不可不收藏的网站合集
lifehacker.com
是一个资源类聚合性网站，里面包含了程序员生活的各类资讯。在这里你可以见识到不同程序员的技术分享。
CodePen
这个工具写前端代码最合适了，其包括了教学，分享和设计灵感的方方面面，里面提供了许多实用的功能，比如说分享代码，嵌入代码片等。
dzone.com
Dzone是一个类似IT新闻形式的编程社区，用户可以在网站内分享最新的IT新闻和编程资源，其文章质量由内容管理员来把关，所以不用担心垃圾资讯。
www.coursera.org
Coursera 是一个教育平台，它与全世界最顶尖的大学和机构合作，提供任何人可学习的免费在线课程。
techcrunch.com
TechCrunch 是美国科技类博客，主要报道新兴互联网公司、评论互联网新产品、发布重大突发新闻。TechCrunch 目前已成为关注互联网和创业的重量级博客媒体，是美国互联网产业的风向标，里面的内容几乎成为VC和行业投资者的投资参考。
Hacker news—news.ycombinator.com
Hacker news是一个专注于计算机科学和创业精神社会新闻网站。里面的内容可以满足学习者的求知欲。
CSS-Tricks
CSS-tricks是一个关于运用CSS技术进行网络开发和设计的小技巧的交流网站，里面有各类样式问题的解决方案以及深度思考
Dribbble.com
质量最高的设计网站，没有之一！前端同学也可以常常逛逛提高审美
Can I use— Support tables for HTML5, CSS3, etc
https://caniuse.com
非常实用的兼容性查询网站
Webdesigner Depot
https://www.webdesignerdepot.com/
网页设计资源网站，网页设计师必备，涵盖大量教程、工具、素材
awwwards.com
Awwwards是一家专业的网页设计和开发的综合体。它旨在表彰和推广的最佳创新的网页设计。
2、在线电子书
《Learning JavaScript Design Patterns》作者：Addy Osmani，
https://addyosmani.com/resources/essentialjsdesignpatterns/book/
《你不懂 JavaScript》系列，在 GitHub 有 92k+ Star
https://github.com/getify/You-Dont-Know-JS
《JavaScript 秘密花园》（这是中文版）
http://bonsaiden.github.io/JavaScript-Garden/zh/
《jQuery 基础》
http://jqfundamentals.com/
《Speaking JavaScript》
http://speakingjs.com/es5/
《DOM Enlightenment》
http://domenlightenment.com/
《Learn CSS Layout the pedantic way》
http://book.mixu.net/css/
《Node 的艺术》GitHub 上有 7900+ Star
https://github.com/maxogden/art-of-node/blob/master/readme.zh-cn.md
《深入 HTML 画布》
https://joshondesign.com/p/books/canvasdeepdive/toc.html
3、前端开发速查表
PDF 速查表
13 张速查表，包括：CSS、HTML、jQuery、Vue、React、Angular、响应式 Web 设计、Bootstrap 等。
交互式速查表
Bootstrap Icon
https://glyphicons.bootstrapcheatsheets.com/
Vue.js 2.2 速查表
https://vuejs-tips.github.io/cheatsheet/
HTML 速查表
https://htmlcheatsheet.com/
CSS 速查表
https://htmlcheatsheet.com/css/
CSS 布局速查表
https://learn-the-web.algonquindesign.ca/topics/css-layout-cheat-sheet/
CSS grid 速查表
https://alialaa.github.io/css-grid-cheat-sheet/
4、GitHub Awesome 系列
JavaScript 资源大全中文版：（Star 5100+）
https://github.com/jobbole/awesome-javascript-cn
CSS 资源大全中文版：（Star 1100+）
https://github.com/jobbole/awesome-css-cn
Awesome Vue：（Star 39k+）
https://github.com/vuejs/awesome-vue
Awesome React：（Star 28k+）
https://github.com/enaqx/awesome-react
Awesome Angular：（Star 6100+）
https://github.com/gdi2290/awesome-angular
5、前端视频学习资源
《Web Development in 2018 - A Practical Guide》
https://www.youtube.com/watch?v=Zftx68K-1D4
《CSS Crash Course For Absolute Beginners》
https://www.youtube.com/watch?v=yfoY53QXEnI
《CSS3 Animation & Transitions Crash Course》
https://www.youtube.com/watch?v=zHUpx90NerM
《Intro to JavaScript》Udacity 新手入门课程
https://www.udacity.com/course/intro-to-javascript--ud803
《Programming for the Web with JavaScript》
https://www.edx.org/course/programming-web-javascript-pennx-sd4x
《麻省理工学院（MIT）和 JS 相关的公开课列表》
https://ocw.mit.edu/search/ocwsearch.htm?q=JavaScript
https://ocw.mit.edu/search/ocwsearch.htm?q=CSS
本列表会不定期更新。更新后会在公号通知。
觉得本文对你有帮助？请分享给更多人
点个好看少个 bug ?