最近一段时间,把React学习实践了一把,算是又多掌握了一门新技术,虽然学习过程比较辛苦曲折,但熟练掌握后感觉还是很好的,以后又多了一种选择,在技术思路上也开阔了很多。
回想编程生涯这些年,2001年开始学习Asp,2002年学习Javascript,2003年学习Asp.Net/C#,2009年学习Objective-C,2013年又跳到前端这个大坑,从Nodejs到jQuery到Angularjs到现在的React。这一路学来,走过一些弯路,也积累了不少学习的经验。
积极开放的心态最重要
学习新技术,就如探索一片新的领域,一般在心态上来说,都会有两种典型的心态,一种是恐慌和抗拒的,一种是积极和开放的,不同的心态会造成不同的结果。比如对我自己来说,对于编程技术,一直是我所喜欢的,所以编程的新技术,总是能积极的去学习,并且能很快掌握。而对于英语和写作,从上学开始,就一直是我所不喜欢不擅长的领域,所以即使学了很多年,也并没有什么明显的进步。直到后来工作后,逐步意识到英语和写作的重要性,在心态上作出了调整,积极的去面对,到现在总算是改善了很多。
学习新技术的另一个障碍来源于已经熟练的技术。当好不容易把一门技术掌握的很熟练后,虽然这在将来学习新东西时,会帮助少走很多弯路,但同时可能也会变成一种障碍。
我曾对几门语言掌握的相当熟练,甚至有些曾以为自己精通了。比如当年对于asp,可以熟练的完成在当年技术条件下的复杂BS系统,虽然按现在标准来看,也无非是用vbs对数据库增删改查,那时候交互并不复杂,还能配合写一些简单的javascript,让体验更好一些。那时候觉得会了Asp,可以搞定所有的BS系统开发了。后来Asp.Net出来了,心理很复杂,一方面觉得我用Asp已经啥都可以搞定了,为什么要学Asp.Net?另一方面觉得这个是未来发展的趋势,还是应该学习掌握,不然以后可能跟不上时代发展。结果还是硬着头皮去学。只是每次遇到困难挫折的时候,就会有放弃回去写Asp的念头,觉得这要是我用Asp来写,早搞定了,何必这么苦逼学新技术呢?
当我终于有一天,对Asp.Net熟练掌握后,才发现自己原来的浅薄无知,以前Asp也就是停留在脚本编程,到了Asp.Net,已经可以用面向对象的思想去设计架构,甚至于出了网页,还可以去开发后台服务。这对于我来说,相当于又打开了一扇新的大门,可以从更宽广的角度来看待问题。
从心理学的角度来说,我们对于外部世界的认识可分为三个区域:舒适区,学习区,和恐慌区。我们所熟悉的技术领域就是舒适区,而新技术是处于学习区或恐慌区。随着对新技术的掌握,新技术会进入舒适区,但是总还会有更新的技术在学习区甚至恐惧区,等着去学习掌握。
如果想高效的学习掌握新技术,在心态上一定得是开放和积极的。
做中学(Learning By Doing)
如果没有@邹欣老师的《构建之法》,我可能没法这么精准的去概括这种边做边学的方法,对于软件技术的学习,最高效的办法应该就是“做中学”。
如何通过“做中学”去学习掌握新技术,我一般分成这样几个步骤:
- 整体概览
- 明确阶段性目标,选择实践项目
- 搜集整理相关文章和开源项目,模仿借鉴
整体概览
所谓磨刀不误砍柴工,在动手去做前有必要先做一些准备工作。在开始学习一门新技术的时候,先对新技术整体有个了解是很有必要的,需要知道它能做什么,有哪些关键的知识点。接下来的步骤,也都依赖于对技术整体的掌握和了解。
这个工作,如果有条件,可以买一本薄一点的,浅显易懂的书,整体翻一翻,基本就能有个了解。但不建议买大块头的书,一般大块头的书适合当词典来查。但现在新技术推出速度太快,往往要等书出来往往是几个月之后的事情了,所以绝大部分时候,还是得到其官方网站去查相关技术文档。就像这次学React,确实难找到本合适的书,所以我直接去它的官方网站(http://facebook.github.io/react/) ,把Getting Started里面的文章快速的浏览了一遍,基本上算是有了个大概的了解。而且现在网络上相关文章也比较多,通过搜索,也能找到很多相关的文章和资料。
明确阶段性目标,选择实践项目
一般一门新技术所涉及的面比较广,如果一开始就想全面掌握并不现实,但如果从一个个点去突破,相对要简单很多。所以一般我会通过一个或多个项目实践的形式,分成几个阶段,逐步去掌握各个知识点,最终整体去学习掌握技术。
例如我以前学习一些服务端语言,都会尝试通过写一个留言板或者博客系统来学习,而这次学习React,主要就是通过用React重构我以前用Angularjs写过的一个聊天室应用,来学习掌握React。通过前面对React的概览性学习,结合自身情况,我对于这个项目实践,简单分成了几个阶段:
1. 用React搭建基础框架
React的应用是基于Flux架构,而Flux架构并没有统一的标准,需要选择使用一种Flux架构实现,并基于它搭建基础框架。
2. 实现界面基础组件
React是基于组件的方式来编程运行的,所以需要将整个应用拆分成若干基础组件,这个阶段主要就是把界面的元素和交互拆分成若干基础组件
3. 和服务器进行通信
一个完善的程序,离不开和服务端的交互,对于一个React程序,其和服务端交互的方式,和传统应用程序,并不全相同,并且对于和服务器通信的结果数据,还要和界面整合
4. 发布测试完善
对于做好的作品,发布给自己和其他人进行测试,然后继续完善,在这个过程中去进一步学习掌握技术细节
当明确了实践的项目和各个阶段的目标,后面就是如何去达到这个目标了,在实践中学习。
搜集整理相关文章和开源项目,模仿借鉴
书本或文档上一个个知识点的说明,和最终的项目产品,还是有很大差距,项目最终是需要充分运用各个知识点,合理组合,才能写出高质量代码,而对于新技术,一开始很难掌握这些细节,盲目依赖以往经验,很可能就是照猫画虎,最终做出来的东西不伦不类。
在初学习实践新技术时,模仿借鉴很重要,就像小孩子学说话,都是从模仿开始。好在现在通过github这种开源项目托管服务,利用搜索,可以找到非常多的优秀开源项目。
早些年学习Asp.Net的时候,我有过很长一段时间对开源项目AspNetForums的二次开发经历,从中受益良多。以我当时的水平来说,是不可能设计开发出来那样的高质量产品,甚至于看懂都有些吃力,但正是通过对它的二次开发,不仅让我快速的学习掌握了很多Asp.Net开发的知识点和细节,也养成了很多良好的编码习惯。在后面在做其他项目,可以模仿和应用它很多设计实现。
有些程序员写了很多年程序,代码质量不高,一个原因就是因为看的太少,很少去参考学习那些优秀的开源项目。没有见过好的代码是什么样的,自然很难写出来高质量的代码。
在我这次开始动手实践React项目前,也尝试找了很多开源项目,由于React技术较新,还没有可以直接完整参考的项目,所以只能是多个项目参考对照。以下就是部分我学习和参考过的项目列表:
- emmenko/redux-react-router-async-example · GitHub 一个服务端交互的示例
- quangbuule/redux-example · GitHub 一个和Immutable.js整合的示例
- Rebuilding HipChat with React.js 一个和我要做项目类似的应用HipChat,用React开发的,并非开源项目,但是通过React Dev Tool可以参考借鉴很多组件设计的思路
在前期搭建基础框架的时候,就是直接借用的前两个项目的框架,这样很快就能让程序跑起来,然后在后面的基础组件设计的时候,更多的就是参考hipchat的组件设计。
做中学(Learning By Doing)
在看书看资料的时候,一个个知识点看起来并不复杂,但是当真正去动手实践的时候,会遇到各种各样的问题(坑),而这些问题只有反复的思考、查资料、问人才能最终解决。
在做中学,听起来很酷,但这个过程总是艰辛曲折的!学习往往就是这样的,只有经历各种各样的磨练,才能真正的去掌握这些知识,把这些知识转变成自身的能力。
我这次用React重构聊天室的经历,如同我以往学习其他新技术的经历一样,充满了艰难险阻,两个月来付出良多。但最终完成的时候,却是成就感满满,感觉到对于新技术终于算是基本掌握了,虽然还有一些知识点没有应用到,也不过是时间问题罢了,再回头看以前的一些程序设计,又有了很多新的思路。
经验教训
以下是总结的一些经验教训
贪多嚼不烂
虽然现在新技术推出很快,但很多技术本质并没有变,在有其他技术“良好基础”的前提下,掌握一门新技术并不需要花太长时间,但“良好基础”就如学习武功的内功,才是真正需要多花时间去培养的。
所以去学习新技术之前,先看看手头的技术是不是掌握好了,如果没掌握好,不妨先学好再说,不然每门技术都浅尝则止,反而是难有成就。
目标不宜太大,要有阶段性成就正向激励自己
人的学习热情都是有周期性的,最开始激情满满,一段时间后就会激情逝去,很容易就半途而废放弃了。
所以在设定阶段性目标时,最好能目标小一点,现实一点,能多一些正向的反馈,这样能让自己走的远一点。
举例来说,写程序可以优先写单元测试和界面部分,这样很快就有明确的反馈,比如当你看到单元测试全部通过了,能看到界面了。
学习不会白费
有时候辛辛苦苦学的新技术,可能不久后就会过时,这时候难免会有是不是白学的想法,但实际上学习从来不会白费的,看过一句话我觉得很有道理:
你所学习的一切都在帮助构建你头脑中的神经元网络,会帮你建立某种联系使你在后续学习其他东西时更加容易,了解一种知识能够使你跟其他知识进行比较和对比。因此,学习总是有用的,无论学什么。
就像十几年前我把Javascript学的很熟练了,那时候觉得没什么卵用,现在看来却是大有用途:)
扫码二维码 获取免费视频学习资料
- 本文固定链接: http://phpxs.com/post/4229/
- 转载请注明:转载必须在正文中标注并保留原文链接
- 扫码: 扫上方二维码获取免费视频资料