最近一段时间，把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://www.cnblogs.com/dotey/p/4812633.html