关于前端开发的资源推荐与总结【持续更新】

时间 2019-11-10

标签关于前端开发资源推荐总结持续更新繁體版

原文原文链接

咱们不少人总会有这样一个问题，就是喜欢收藏不少东西，自我安慰说等有时间了必定好好看，以致于网页收藏夹、微信收藏栏、百度网盘等处积累了太多资源，给人一种学富五车的样子，而只有本身才知道，被收藏的东西，真正看了多少，掌握了多少。
对于我本人来说，能够绝不夸张的说，若是能将本身收藏的东西彻底学习掌握，至少会是某个领域的专家，我想，对于大多说人来讲，状况可能和我也有很大的类似之处。因此说，咱们须要时刻激励本身，不能让相似“先收藏了，等之后有时间再看”这样的话语来腐蚀本身、消磨本身，最终让只是随手收藏而不去阅读成为一种习惯。
关于个人一些基本状况，有兴趣的能够看看我上次由于失眠，凌晨三四点发的提问，也请你们多提建议，多指教：诚意求教：关于前端/数据分析求职的一些问题javascript

这篇文章将会持续更新，主要是分享我本人在学习过程当中看过的一些好的资源、一些经验总结，但愿可以和你们更多的交流，共同进步。
一些内容，可直接移步个人掘金社区收藏夹和segmentfault收藏夹。html

学习网站和APP推荐

入门：

建议使用w3cschool和慕课网。
推荐理由：w3cschool提供的教程全面、基础，且每一个知识点都经过在线编辑器内置了小案例，只需点击“尝试一下”，即可直接在线运行，也能够在里面对提供的代码进行更改编辑，形象直观的对知识点进行实践掌握，不用本身一个个去写demo，便捷高效。在首页“编程学院”里还提供了“编程实战训练”，用的是著名的freecodecamp的项目，通关能够申请证书。同时，w3cschool还提供了编程微课、代码实例、测验等等内容，再也不赘述，你们能够自行体验，w3cschool也提供有手机客户端。这也算是我入门的网站之一，目前经验值榜第二，阅读、贡献值榜均前20（不过总感受这个网站的贡献值榜有些虚，在上面提问回答也很慢）。
慕课网主要提供视频教程，同时，课程里也穿插有不少相似w3cschool的边学边练，也有手机客户端可供使用。

视频学习：

主推腾讯课堂、51CTO学院和网易云课堂，至于课程，可根据评价、热度等进行筛选。

零散阅读提升：

学习编程，就是一个随时随地，利用零散时间进行提升的过程，w3cschool手机APP能够知足零散时间的基础学习，掘金社区也有不少优质内容（有掘金手机客户端可供使用），这个社区的一大好处是你能够经过“标签管理”进入你想关注的领域，根据文章热度去选择阅读，好文无数，极力推荐掘金手机客户端。还有一个就是segmentfault，也就是你如今正在看文章的这个网站，我一般的作法是用微信打开思否阅读相关文章，很便捷，手机客户端目前作的还不够好。

好文推荐

好文推荐这一部分，我主要想把它用来分享本身阅读过的一些优质文章，力求通俗易懂的让每一个人理解前端开发领域一些核心的、底层的东西，共同进步。【这一部分将持续更新】

HTML和CSS：

史上最全的前端资源大汇总：从HTML到JS，从jQuery到Vue，从node到PHP，从正则表达式到求职面试，能够说从类目上来看，应有尽有，不过彷佛没有网络安全方面的内容。优势是多而全，缺点也是太多，有时间的能够慢慢看看，无时间可忽略，毕竟我以为学习前端，须要利用的是零散时间。
CSS 常见布局方式：虽然说是常见布局方式，可是对传统布局方式（经过盒模型），使用 display 属性（文档流布局） + position 属性（定位布局） + float属性（浮动布局）的布局没有过多的说起，重点讲了 flex 布局和 grid 布局，以及 CSS 常见的居中方式和两种经典的布局方式“圣杯布局”和“双飞翼布局”。笔者以为文章开头的思惟导图非常受用。
如何实现 font-size 的响应式：实现响应式布局的方式有不少，这一篇文章讲述了使用rem、calc等进行实现，比较通俗易懂，值得参考学习。

JavaScript：

ECMAScript 6 入门：阮一峰老师的ES6入门，目前最好的ES6教材，没有之一。
JavaScript八张思惟导图：5年前端开发经验的前辈的实力总结，值得拜读，经过思惟导图，能够更好的回忆知识，创建知识体系。
JavaScript 开发人员须要知道的简写技巧：实用，有逼格，显水准的简写。
js 深拷贝 vs 浅拷贝：文章主要讲了 js 的基本数据类型以及一些堆和栈的知识，以及什么是深拷贝、什么是浅拷贝，深拷贝与浅拷贝的区别，怎么进行深拷贝和浅拷贝。堆和栈是数据结构里面的内容。我相信，经过这篇文章，你必定可以真正理解深拷贝和浅拷贝。
JS正则表达式完整教程：关于正则表达式，网上的资源不少，相似《正则表达式30分钟入门》等等，我认为这些都只是讲了正则表达式的用法，并不能让每一个人彻底理解和领会正则表达式，而这篇文章，我以为算是目前我见到的最好的正则表达式教程了，没有之一。文章略长，做者在前三章详细而通俗的讲解了正则表达式的字符匹配、位置匹配、括号的做用这些其余教程中都存在的东西（但比其余教程更容易理解），第四章讲解了正则表达式回溯法原理，让你对正则表达式的匹配原理有更清晰的认识，加深对正则的理解与掌握；最后三章正则表达式的拆分、构建、编程则是真正让你学以至用，避免纸上谈兵。这篇教程虽略长，可是不可多得。我认为：关于正则表达式，这篇文章，就够了。
JavaScript算法和数据结构：这个是GitHub上的项目，优势是对算法和数据结构讲的比较全面，图文并茂，缺点是不少是英文的，须要必定英语基础。
this、apply、call、bind：若是对this、apply、call、bind还有疑问，你能够看看这个，做者解析的很具体很到位。
破解前端面试：闭包 DOM 如何搞定纸上代码环节：模拟真实面试环节，选择一个切入点，层层递进，详细解读。
几道高级前端面试题解析：这篇文章，将告诉你学习开发过程当中， 0.1 + 0.2 != 0.3的原理，以及Event loop等内容。
比较 Angular、React、Vue 三剑客：若是学习过程当中。你还在纠结 Angular、React、Vue 该学习哪一个时，我建议你能够先看看这个。
JavaScript、underscore、ES6等系列：GitHub上一个已经拥有近6000star，近1000fork的项目，主要包括JavaScript深刻系列、JavaScript专题系列、ES6系列、React系列等，若是你愿意，你能够关注和学习。
JavaScript收藏：这是我在掘金社区关于JavaScript的一些收藏，我的以为，收藏的文章仍是比较经典实用的，能够做为参考。

web前端攻击技术与防范：

笔者面试时曾被问到过这个问题，关于web前端攻击防范，我理解的思路就是：过滤、代理和转义。若是某个Web应用具有良好的安全性，那么再怎么用“不安全的AJAX”也削弱不了它的安全性，反之若是应用自己存在漏洞，无论用何种技术请求，它都是不安全的。具体能够参考下面这几篇文章：前端

AJAX请求真的不安全么？谈谈Web安全与AJAX的关系
聊一聊WEB前端安全那些事儿：经典好文，从原理到实现，都有案例给出。
SegmentFault 技术周刊 Vol.13 - Web 安全指南（下）：安全指南（上）就不要看了，安全指南（下）引用的这些文章值得一读。
Web性能与安全：愿意的话，你们也能够看看我关于Web安全的一些收藏。

关于React

这月成功入职魔都某淘宝拍档公司，算是对本身一直以来自我学习的一种确定吧。业界大多在谈，不会react就很差意说本身会前端，加之公司业务须要，也不得不选择对react这一前端高峰进行攀登，在这过程当中，分享一些好的资源，共同窗习进步。java

React 组件间通信：淘宝前端团队关于React 组件间通信的剖析，值得一看。
在开始React以前，你须要学好这些JavaScript
React.js 小书：比官方文档更加简洁、易学的react、redux学习选择。
Redux 中文文档：关于redux的学习，目前最好的教材，首推此中文文档。
React 常见的面试题（在 React 里面，你能够知道也能够不知道的事, 可是你会发现他们确实颇有用）

因为时间关系，内容推荐先作到这里，本文后续会持续更新优化，但愿可以与你们多交流。第一次发专栏，问题不少，疏漏之处，请批评指正。node