最近为了开发一个小项目，学习了Jetpack Compose，API 设计的很不错。Jetpack Compose的API 非常丰富，正好我的 React 的知识可以发挥作用。也许这就是 React Native 开发者可以代替 Android 原生开发者的原因。

随着 React 16.3.0 的发布，context api 也有了很大的更新。我已经从旧版的 api 更新到了新版。这里就分享一下我（作者）的心得体会。

在这个教程里，我们会从一个例子React应用开始学习react-router-dom。其中你会学习如何使用Link、NavLink等来实现跳转，Switch和exact实现排他路由和浏览器路径历史。

当我刚开始写React的时候，我看过很多写组件的方法。一百篇教程就有一百种写法。虽然React本身已经成熟了，但是如何使用它似乎还没有一个“正确”的方法。所以我（作者）把我们团队这些年来总结的使用React的经验总结在这里。希望这篇文字对你有用，不管你是初学者还是老手。

componentDidUpdate是更新版的componentDidMount方法。在这里可以处理本地的UI元素，可以操作refs，有需要的话也可以开启另外一个绘制过程。

Context API总是很让人迷惑。这个API是官方的，但是官方又不希望开发者们使用这个API，说是这个API会在以后发生改变。现在就是那个改变的时刻。新的API已经被merge了。而且它看起来更加的“用户友好”了。尤其是你不得不使用redux、mobx的时候，可以选择新的Context API实现更加简单的状态管理。

要写你自己的虚拟DOM，有两件事你必须知道。你甚至都不用翻看React的源代码，或者其他的基于虚拟DOM的代码。他们代码量都太大，太复杂。然而要实现一个虚拟DOM的主要部分只需要大约50行的代码。50行代码！！

一步一步带你实现virtual dom（一）一步一步带你实现virtual dom（二)--Props和事件 很高兴我们可以继续分享编写虚拟DOM的知识。这次我们要讲解的是产品级的内容，其中包括：设置和DOM一致性、以及事件的处理。 使用Babel 在继续之前，我们需要弥补前一篇文章中没有详细讲解的内容。假设有一个没有任何属性（props）的节...

前端应用消失的部分 一个现代的、使用了redux的前端应用架构可以这样描述： 一个存储了应用不可变状态（state）的store 状态（state）可以被绘制在组件里（html或者其他的东西）。这个绘制方法通常是简单而且可测试的（并不总是如此）纯方法。 {代码...} 组件可以给store分发action 使用reducer这种纯方法来根据就的状态...

Redus-saga是一个redux的中间件，主要用来简便而优雅的处理redux应用里的副作用（side effect相对于pure function这类概念而言的）。它之所以可以做到这一点主要是使用了ES6里的一个语法：Generator。使用Generator可以像写同步的代码一样编写异步代码，这样更加容易测试。

store => next => action =>看起来很复杂有木有。基本上你是在写一个一层一层往外返回的方法，调用的时候是这样的：

有答“组件声明”的，有答“组件调用的”，有“组件初始化”的，还有“使用一个组件”的。没有一个统一的称呼。造成这样局面的原因是很多时候我们都没有去详细的了解过JSX和React实际操作之间的抽象层。现在我们就深入研究一下这部分知识。

本文作者写作的时间较早，所以里面会出现很多的旧版ES5的时代的方法。不过，虽然如此并不影响读者理解组件的生命周期。反而是作者分为几种不同的触发机制来解释生命周期的各个方法，让读者更加容易理解涉及到的概念。以下是正文。

Facebook的一帮子工程师在忙碌之余开发除了一套前段UI框架React。这个框架最大的有点就在于让UI的开发都基于组件，这样View都是根据props和state变化的。

很久很久以前，就有人用CSS来时给HTML内容添加样式。CSS可以最大限度的分离样式和内容，选择器也可以很方便的给某些元素添加样式。你根本找不到任何不用CSS的理由。