推荐5个值得学习React Native的开源项目

痛定思痛。 2022-07-08 14:27 1314阅读 0赞

读源码是最好也是最有效的提升自身编码能力的方式，特别是当该项技术比较新然后它的标准还在不停改进的时候。 [ReactNatve][] 就是其中一个。它的API随着每次发布还在持续的迭代 ，你会碰到很多需要选择的工具然后除了一些简单的HelloWorld教程，稍微深入些的教程比较少。于是，我们还是来读读别人的开源项目源码吧，下面是我follow的5个：

1. [HackerNews-React-Native][]

![20160416215431_670.gif][]

这个项目展示了HackerNews的ReactNative轻量级实现。它能够帮助你理解怎样去交互以及怎么用框架提供的组件实现一个相对完整的项目，在你还不太理解整个框架的时候。

2. [Snowflake][]

![20160416215432_697.gif][]

Snowflake其实不是一个项目；它是一个ReactNative的比较细致的教程。它有比较仔细的解释还有视频截图确保你能够理解。如果想要深入了解ReactNative，我个人比较推荐仔细研究这个项目。

3. [React-Native-NW-React-Calculator][]

![20160416215432_937.png][]

这是一个跨平台的(Web / Mac App / Mobile) 的一份代码实现的计!算!器!额，我不是在开玩笑，这个项目展示了ReactNative中ReactJs的强大。这个项目还教会了我怎么去构建代码以出发它的潜能。这是我最喜欢的一个。

4. [React-Native-NBA-App][]

![20160416215432_328.gif][]

这个ReactNative能够教会你成吨的

伤害

技巧。主要是UI组件的实现。这是相较于原生最接近的ReactNative实现。它也有一个很好的架构模式，值得一看。

5. [FinanceReactNative][]

![20160416215434_978.gif][]

这个项目是学习如何调用第三方接口的很好的案例，展示了数据图表还有其他重要的数据。

还有一个:

[Facebook’s F8 Conference App][Facebook_s F8 Conference App]

![20160416215435_560.png][]

Facebook刚公布的他们F8大会上的ReactNative项目。

[ReactNatve]: http://facebook.github.io/react-native/
[HackerNews-React-Native]: https://github.com/iSimar/HackerNews-React-Native
[20160416215431_670.gif]: /images/20220708/fff4628f84c1464993c87ca7322da339.png
[Snowflake]: https://github.com/bartonhammond/snowflake
[20160416215432_697.gif]: /images/20220708/546d2ecda57d477ab6617d479f2e3476.png
[React-Native-NW-React-Calculator]: https://github.com/benoitvallon/react-native-nw-react-calculator
[20160416215432_937.png]: /images/20220708/38bdf987469844e2a60ef9e050ba1f93.png
[React-Native-NBA-App]: https://github.com/wwayne/react-native-nba-app
[20160416215432_328.gif]: /images/20220708/1079f52902244f96b62aa836ce0f53d8.png
[FinanceReactNative]: https://github.com/7kfpun/FinanceReactNative
[20160416215434_978.gif]: /images/20220708/4f873e4f59ae4ea28b5e26c5e5da6ddf.png
[Facebook_s F8 Conference App]: https://github.com/fbsamples/f8app
[20160416215435_560.png]: /images/20220708/6dc2bbb4f2834c498c7e1d143c789a94.png