目录

学习最难的两点,第一是接收信息,第二是归纳信息。现在是信息爆炸的时代,一个知识点,网络上有无数的blog,论坛,问答,也有无数相关的书本。学会甄别有效信息是很重要的一点。而有效信息的数量其实也很庞大,而且这些信息的呈现大多数并不适合自己,这时候就需要学会归纳和整理。运用以上两点,形成自己的知识体系。这其中,记录blog是一项很重要的手段。在写blog的过程中,你不仅能深刻的理解相关的知识点,构建自己的知识体系。同时也形成了一条条索引,方便随时查阅和复习。
我在写blog的过程中,习惯用织网的方法去记录和学习。将一个个知识点按深度连成一条条线,按广度连成一条条线。然后这些线交织成一张大网,遇到问题就能一网打尽。当然,目前这张网织的还很基础,但是起码有了自己的脉络和方向。而学习的过程,更需要坚持,每天都要有正在进行的项目和代办项。踩好脚下的路,看清眼前的路。

1. 前端系列

作为一个前端程序员,前端知识当然是必备的。这其中各种基础和原理尤其重要,如果不懂这些,就变成了不断去学会使用一个个新的框架和工具,到了一定程度,就很难有进步。

1.1 JS系列

不用说,重中之重。

1.1.1 JS入门难点解析

已完结,共13篇,虽说题目是“入门难点解析”,但是难度却不是“入门”,该系列深入地剖析了JS的各个概念与原理,看完以后你将会换一种方式去思考JS。
我认为JS的难点主要是把握如下几个概念,作用域,作用域链,原型,原型链,继承,活动对象,this,执行环境,变量声明,函数声明。搞清楚这些概念的定义与他们之间的关系,也就不难理解那些看似复杂的JS代码了。

1.1.2 JS原生引用类型解析

完善中,目前共完成7篇。完整列举了JS中常用的原生引用类型的使用方法和属性,掌握这部分知识,有助于我们写出更加优雅更高性能的代码。
我认为这一系列非常有必要去熟悉,JS入门难点系列主要讨论的是原理知识,而本系列着重介绍这些原生引用类型的使用方法和属性。这两者配合在一起,真的是无往不利。当你遇到一些优秀效果实现或者学习他人的代码时,联系这两个系列所学的知识,你会发现代码的逻辑会很清晰,而且他们往往并没有看上去那么好。掌握这两个系列,就可以带着敬畏的心情,批判的态度去学习那些优秀的代码实现啦(😜)。

1.1.3 ES6常用新特性学习

完善中,目前共完成4篇。这部分应该算是JS入门难点解析系列在新规范下的补充。
主要是分析了自己平时使用的较多的特性。这部分知识很有必要去学习,但是开始学习阶段没必要求全,先大概了解一下新增的特性范围,然后根据需要去深入研究一下常用的特性。当然有些特性比如Promise和一些内置对象的新特性在JS原生引用类型解析中已经讲过,另外比如模板语法这种比较简单实用的特性也没有做介绍。

1.1.4 JS进阶系列

完善中,目前共完成3篇。我们常说JS是一门面向对象的弱类型和动态类型语言。这个系列,我们分为三部分,第一部分讲解JS的弱类型和动态类型是指什么,第二部分分析JS面向对象的三大特征,第三部分我们一起探讨一下JS语言在使用时应当遵循的设计原则。

1.1.5 JS常用设计模式解析

完善中,目前共完成2篇。随着编程经验的增加,维护更大更复杂的代码模块,需要的就不仅仅只是代码功能性的实现,还需要关注代码的复用性,扩展性和可维护性。这个时候就需要用到设计模式。

1.1.6 JS待整理

完善中,目前共完成2篇。一些散落的知识点,等待串成线。

1.2. CSS系列

虽然现在很多大公司划分了重构,一些前端可能专注于JS逻辑的编写了。但是不懂JS,又怎么去操作CSS呢?(不过,这一块也正是我目前的弱项,正在积极学习实践中)

1.2.1 CSS入门

已完结,共13篇。CSS的入门知识,很全面,由浅入深。适合新手入门。
在这个系列,我通过大量生动形象的例子帮助理解和记忆,让CSS理论学习变得生动自然。当然,这里面很多知识只是其表象,要想深入理解,还需要阅读
CSS进阶系列。

1.2.2 CSS进阶

完善中 ,目前共完成12篇。CSS的进阶知识,扎根文档,全面解析CSS的规则和设计思路。
怎么说呢,这个系列的内容我其实是不满意的,因为公司有对应的重构,所以CSS知识相对比较薄弱。在写这个系列的时候,就缺乏生动形象的的demo,也局限了根据经验去发散思考的能力。主要是扎根文档,甚至很多时候基本是在翻译文档。不过收获其实也是很大的,CSS和JS不一样,它其实侧重的就是规则的运用,所以归根结底在于两点:1. 深刻理解规范 2. 熟练灵活地运用规范。
先说第1点,深刻理解规范,这点我在查找资料的时候,真是深有体会。网上很多资料并不是最新的,基于CSS各个版本。另外,那些中文资料,很多惨不忍睹。而且不少错误的内容大家都不去验证,抄来抄去。所以,如果要查阅文档,请一定一定看W3C英文原版,尝试自己去解读文档。开始培养自己看英文文档和英文文章的习惯,算是写这个系列最大的收获了。至于第2点,无需多言,而且也正好是我目前的短板。
这个系列到这里我会暂停。我准备写CSS第三个系列,主题是关于布局实践。等到知识积累足够,我会回头重新梳理这个系列。(其实这也是一种学习方式,理论联系实践,理论卡壳,就去实践,实践有疑问,就夯实基础。不要割离理论与实践,要交叉并进)

1.2.3 CSS常用布局实现

完善中,已完成5篇。该系列用于整理记录常用的CSS布局实现。

1.2.4 CSS常用效果实现

规划中

1.2.5 知名网站代码分析

规划中

2. 后端

接触后端其实是从自己尝试组织一个前端框架开始,只是浅显的使用了一些模块加载,和使用express的方法。但是后来慢慢意识到,要想独立完成或者合理地把控一个项目,后端的知识必须是要掌握的。目前主要是学习node。

2.1 Node

即将开始。学习了Node的基础知识,看过一些大牛的视屏教程,也做完了NodeSchool的题目。目前正在酝酿第一个系列的文章,着重于node各个模块的讲解。

3. 浏览器

3.1 待整理

目前已完成1篇。其实和JS,CSS有些交叉。因为主要想研究的是BOM和兼容性,还有浏览器渲染的原理以及一些特性。希望最终能涉及到内核。

3.2 浏览器为契机贯穿前端知识点-大纲

好久没写blog了,想要以浏览器为契机,对前端知识做一个梳理,先立个大纲,也算是立个flag,希望能完成。

4. 网络

完善中,目前已完成1篇。相当重要的一块,主要是一些协议的知识,一些请求,缓存,跨域的知识。

5. Native

以前有过Android的知识,不过真的快忘了,希望能捡起来。不过人的精力毕竟有限,所以这里的Native主要是说的JS Bridge。有研究过一点PhoneGap,不过只是为了使用,很快就忘了。这一块必须要实践和记录。

6. 性能优化

即将开始。这是一个有追求的程序员必须了解的东西了,这一块在着重了解和实践,还没有记录下来,接下来会开始该系列文章整理。

7. 工具

7.1 模块打包工具

7.1.1 webpack

最流行的模块打包构建工具了,学过该系列知识,了解其原理和优点,也进行了一些实践。webpack的灵魂在于其丰富的插件,插件越多,功能越强大。正在准备着手写该系列文章。

7.1.2 gulp

目前了解不多,准备学习一下。

7.1.3 grunt

了解不多。

7.2 代码管理工具

7.2.1 git

完善中,目前共完成1篇。自己用的最多的代码管理工具了,习惯命令行。但是很多操作和问题还没有记录。会逐步记录

7.2.2 svn

以前使用过,但主要是用GUI。

7.3 调试工具

7.3.1 chrome开发者工具

用的最多的工具了,但其实性能分析这一块有待深入了解和学习。

7.3.2 charles

抓包工具。

8. 算法

这一块没有放到JS里面,而是单独罗列出来。因为算法最重要的是思想,语言只是实现这种思想的载体而已。这块的东西,以前学的时候还不错,现在工作当中用到的地方很少,都快忘光了。最近零星在看,准备抽时间系统学习以下,沉淀下来。

9. 源码学习

选取有代表性的前端框架,进行源码的学习。目前规划两个系列:underscore和vue。

10. 实践

最终我们的学习要落到实处。所以准备选取一些有代表性的项目,由浅入深,系统地分析它们的搭建和优化过程。主要是梳理不同种类的项目开发流程,理解这期间框架为我们做了什么,以及为何会这么做,熟悉一些使用的插件和工具,能够独立完整快速地完成不同类型的项目开发。目前规划有如下五个项目:一个在线商城(在做),一个后管平台(以前做过一部分),一个报表系统(在做),一个微信公众号+聊天室(已上线,由于是商业版本,不方便演示,我会从不同的角度重新全栈开发一个全新的),一个小程序(还没有接触)。

10.1 在线商城项目-six淘

完善中,目前共完成17篇。
一个spa网站,前端使用webpack + vue全家桶,后端使用node + express + mongodb + mongoose,服务器使用阿里云。主要目的不是为了搭建这个项目,而是用这个项目帮助自己贯穿知识点。
作为这个系列的第一部呢,我不打算直接拿一个完整的最终形态的项目出来,一行行去研读,这个工作应该是阅读其他人源码进行学习时进行的。我的想法是,用迭代的方法逐步实现一个项目。一开始,我们前后端分离,使用mock数据进行开发,学习如何在脱离后端的情况下完成前端基本功能开发,并且这个过程也是由浅入深的,逐步去理解框架封装了什么,一些常用插件的功能和为什么要使用这些插件,如何实现路由,请求,数据mock,登录等基本功能。这个过程中,我们逐步深入,慢慢优化,力求每一步都清晰简明,有迹可寻。然后,我们开发后端,学习后端的知识,包括mongodb的使用,将前后端贯通。下一步,我们将代码部署到远程服务器,学习服务器的使用和代码的部署流程。这所有的过程都不是一气呵成,而是循序渐进的,中间可能会阶段性地修改甚至推翻之前的代码。所以我会在github上进行版本管理,方便查阅每一阶段的代码效果。by the way,随着学习的深入和知识的沉淀以及技术的发展。这些东西可能会有不好或者错误的地方,重要的是和大家一起感受一下代码演进的过程,行程分析问题的思想。而且确实能力有限,若有错误,请大家不吝赐教。

11. 前端干货

学习就是不断地汲取营养,多关注一些有营养的公众号和blog。学习并且记录他们的干货文章。

12. 前端新技术

前端技术日新月异,更迭快速。可能你一项技术你还没有掌握,就有新技术取代了它。保持对前沿技术的敏感性,才不会被淘汰。

我的博客即将搬运同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=3zno14zkz5ho

推荐阅读更多精彩内容