我们很多人总会有这样一个问题,就是喜欢收藏很多东西,自我安慰说等有时间了一定好好看,以至于网页收藏夹、微信收藏栏、百度网盘等处积累了太多资源,给人一种学富五车的样子,而只有自己才知道,被收藏的东西,真正看了多少,掌握了多少。
对于我本人来讲,可以毫不夸张的说,如果能将自己收藏的东西完全学习掌握,至少会是某个领域的专家,我想,对于大多说人来说,情况可能和我也有很大的相似之处。所以说,我们需要时刻激励自己,不能让类似“先收藏了,等以后有时间再看”这样的话语来腐蚀自己、消磨自己,最终让只是随手收藏而不去阅读成为一种习惯。
关于我的一些基本情况,有兴趣的可以看看我上次因为失眠,凌晨三四点发的提问,也请大家多提建议,多指教:诚意求教:关于前端/数据分析求职的一些问题
这篇文章将会持续更新,主要是分享我本人在学习过程中看过的一些好的资源、一些经验总结,希望能够和大家更多的交流,共同进步。
一些内容,可直接移步我的掘金社区收藏夹和segmentfault收藏夹。
学习网站和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这一前端高峰进行攀登,在这过程中,分享一些好的资源,共同学习进步。
- React 组件间通讯:淘宝前端团队关于React 组件间通讯的剖析,值得一看。
- 在开始React之前,你需要学好这些JavaScript
- React.js 小书:比官方文档更加简洁、易学的react、redux学习选择。
- Redux 中文文档:关于redux的学习,目前最好的教材,首推此中文文档。
- React 常见的面试题(在 React 里面,你可以知道也可以不知道的事, 但是你会发现他们确实很有用)
由于时间关系,内容推荐先做到这里,本文后续会持续更新优化,希望能够与大家多交流。第一次发专栏,问题很多,疏漏之处,请批评指正。
最近,使用jekyll-now在GitHub上搭建了个人博客,这也算是个人在前端领域一次新的突破和尝试,希望能够贡献一些有用的东西来与大家交流。