一些React-Native学习资料

╰半夏微凉° 2022-08-20 08:27 162阅读 0赞

同时还有Awesome React-Native系列

[https://github.com/jondot/awesome-react-native][https_github.com_jondot_awesome-react-native]

## 教程 ##

*  react-native 官方api文档 [ http://facebook.github.io/react-native/docs/getting-started.html][http_facebook.github.io_react-native_docs_getting-started.html]
 *  react-native 中文api文档 (翻译中) [ https://github.com/ecomfe/react-native-cn][https_github.com_ecomfe_react-native-cn]
 *  react.js中文文档 [ http://reactjs.cn/][http_reactjs.cn]
 *  react.js入门教程(gitbook) [ http://hulufei.gitbooks.io/react-tutorial/content/introduction.html][http_hulufei.gitbooks.io_react-tutorial_content_introduction.html]
 *  react.js快速入门教程 - 阮一峰 [ http://www.ruanyifeng.com/blog/2015/03/react.html][http_www.ruanyifeng.com_blog_2015_03_react.html]
 *  react.js视频教程 [ http://react.nodejs-china.org/t/reactjszhong-wen-shi-pin-jiao-cheng-bai-du-wang-pan/584][http_react.nodejs-china.org_t_reactjszhong-wen-shi-pin-jiao-cheng-bai-du-wang-pan_584]
 *  react-native第一课 [ http://html-js.com/article/2783][http_html-js.com_article_2783]
 *  深入浅出 React Native：使用 JavaScript 构建原生应用 [ http://zhuanlan.zhihu.com/FrontendMagazine/19996445][http_zhuanlan.zhihu.com_FrontendMagazine_19996445]
 *  React Native通信机制详解 [ http://blog.cnbang.net/tech/2698/][http_blog.cnbang.net_tech_2698]
 *  React Native布局篇 [ http://segmentfault.com/a/1190000002658374][http_segmentfault.com_a_1190000002658374]
 *  React Native 基础练习指北（一） [ http://segmentfault.com/a/1190000002645929][http_segmentfault.com_a_1190000002645929]
 *  React Native 基础练习指北（二） [ http://segmentfault.com/a/1190000002647733][http_segmentfault.com_a_1190000002647733]
 *  构建一个简单的列表页和2页导航 [ http://www.xn--cnq920ntha.cn/archives/235\#6838470-tsina-1-17436-6a377b1a66595f9ede646cf5c012734c][http_www.xn--cnq920ntha.cn_archives_235_6838470-tsina-1-17436-6a377b1a66595f9ede646cf5c012734c]
 *  Diary of Building an iOS App with React Native [ http://herman.asia/building-a-flashcard-app-with-react-native][http_herman.asia_building-a-flashcard-app-with-react-native]
 *  Use React Native in Existing iOS App [ http://blog-en.leapoahead.com/post/use-react-native-in-existing-ios-app][http_blog-en.leapoahead.com_post_use-react-native-in-existing-ios-app]
 *  tcomb-form-native使用视频教程(需翻墙) [ http://react.rocks/example/tcomb-form-native][http_react.rocks_example_tcomb-form-native]

## 开源APP ##

研究源码也是一个很好的学习方式

*  官方演示App [ https://github.com/facebook/react-native/tree/master/Examples][https_github.com_facebook_react-native_tree_master_Examples]
 *  ReactNativeRubyChina [ https://github.com/henter/ReactNativeRubyChina][https_github.com_henter_ReactNativeRubyChina]
 *  HackerNews-React-Native [ https://github.com/iSimar/HackerNews-React-Native][https_github.com_iSimar_HackerNews-React-Native]
 *  React-Native新闻客户端 [ https://github.com/tabalt/ReactNativeNews][https_github.com_tabalt_ReactNativeNews]
 *  newswatch(新闻客户端) [ https://github.com/bradoyler/newswatch-react-native][https_github.com_bradoyler_newswatch-react-native]
 *  buyscreen(购买页面) [ https://github.com/appintheair/react-native-buyscreen][https_github.com_appintheair_react-native-buyscreen]
 *  V2EX客户端 [ https://github.com/samuel1112/v2er][https_github.com_samuel1112_v2er]
 *  react-native-todo [ https://github.com/joemaddalone/react-native-todo][https_github.com_joemaddalone_react-native-todo]
 *  react-native-beer [ https://github.com/muratsu/react-native-beer][https_github.com_muratsu_react-native-beer]
 *  react-native-stars [ https://github.com/86/react-native-stars][https_github.com_86_react-native-stars]
 *  模仿天猫首页的app [ https://github.com/baofen14787/react-native-demo][https_github.com_baofen14787_react-native-demo]
 *  ReactNativeChess [ https://github.com/csarsam/ReactNativeChess][https_github.com_csarsam_ReactNativeChess]
 *  react native 编写的音乐软件 [ https://github.com/Johnqing/miumiu][https_github.com_Johnqing_miumiu]
 *  react-native-pokedex [ https://github.com/ababol/react-native-pokedex][https_github.com_ababol_react-native-pokedex]
    
     *  react-native-pokedex [ https://github.com/ababol/react-native-pokedex][https_github.com_ababol_react-native-pokedex]
 *  react-native-pokedex [ https://github.com/ababol/react-native-pokedex][https_github.com_ababol_react-native-pokedex]
 *  CNode-React-Native [ https://github.com/SFantasy/CNode-React-Native][https_github.com_SFantasy_CNode-React-Native]
 *  8tracks电台客户端 [ https://github.com/voronianski/EightTracksReactNative][https_github.com_voronianski_EightTracksReactNative]
 *  React-Native实现的计算器 [ https://github.com/yoxisem544/Calculator-using-React-Native][https_github.com_yoxisem544_Calculator-using-React-Native]
    
     *  [房产搜索app https://github.com/jawee/react-native-PropertyFinder ][https_github.com_yoxisem544_Calculator-using-React-Native]
        
         *  知乎专栏app [ https://github.com/LeezQ/react-native-zhihu-app][https_github.com_LeezQ_react-native-zhihu-app]
         *  ForeignExchangeApp [ https://github.com/peralmq/ForeignExchangeApp][https_github.com_peralmq_ForeignExchangeApp]
        
        ## 工具 ##
        
         *  react-native-snippets(代码提示) [ https://github.com/Shrugs/react-native-snippets][https_github.com_Shrugs_react-native-snippets]
         *  react-native-babel(使用ES6+) [ https://github.com/roman01la/react-native-babel][https_github.com_roman01la_react-native-babel]
        
        ## 资源网站 ##
        
         *  React-native官网 [ http://facebook.github.io/react-native/][http_facebook.github.io_react-native]
         *  React-China社区 [ http://react-china.org/][http_react-china.org]
        
         *  React-native组件库（比较全的组件库） [ http://react.parts/][http_react.parts]
         *  React Native Modules [ http://reactnativemodules.com/][http_reactnativemodules.com]
         *  11款React Native开源移动 UI 组件 [ http://www.oschina.net/news/61214/11-react-native-ui-components][http_www.oschina.net_news_61214_11-react-native-ui-components]

[https_github.com_jondot_awesome-react-native]: https://github.com/jondot/awesome-react-native
[http_facebook.github.io_react-native_docs_getting-started.html]: http://facebook.github.io/react-native/docs/getting-started.html
[https_github.com_ecomfe_react-native-cn]: https://github.com/ecomfe/react-native-cn
[http_reactjs.cn]: http://reactjs.cn/
[http_hulufei.gitbooks.io_react-tutorial_content_introduction.html]: http://hulufei.gitbooks.io/react-tutorial/content/introduction.html
[http_www.ruanyifeng.com_blog_2015_03_react.html]: http://www.ruanyifeng.com/blog/2015/03/react.html
[http_react.nodejs-china.org_t_reactjszhong-wen-shi-pin-jiao-cheng-bai-du-wang-pan_584]: http://react.nodejs-china.org/t/reactjszhong-wen-shi-pin-jiao-cheng-bai-du-wang-pan/584
[http_html-js.com_article_2783]: http://html-js.com/article/2783
[http_zhuanlan.zhihu.com_FrontendMagazine_19996445]: http://zhuanlan.zhihu.com/FrontendMagazine/19996445
[http_blog.cnbang.net_tech_2698]: http://blog.cnbang.net/tech/2698/
[http_segmentfault.com_a_1190000002658374]: http://segmentfault.com/a/1190000002658374
[http_segmentfault.com_a_1190000002645929]: http://segmentfault.com/a/1190000002645929
[http_segmentfault.com_a_1190000002647733]: http://segmentfault.com/a/1190000002647733
[http_www.xn--cnq920ntha.cn_archives_235_6838470-tsina-1-17436-6a377b1a66595f9ede646cf5c012734c]: http://www.xn--cnq920ntha.cn/archives/235#6838470-tsina-1-17436-6a377b1a66595f9ede646cf5c012734c
[http_herman.asia_building-a-flashcard-app-with-react-native]: http://herman.asia/building-a-flashcard-app-with-react-native
[http_blog-en.leapoahead.com_post_use-react-native-in-existing-ios-app]: http://blog-en.leapoahead.com/post/use-react-native-in-existing-ios-app
[http_react.rocks_example_tcomb-form-native]: http://react.rocks/example/tcomb-form-native
[https_github.com_facebook_react-native_tree_master_Examples]: https://github.com/facebook/react-native/tree/master/Examples
[https_github.com_henter_ReactNativeRubyChina]: https://github.com/henter/ReactNativeRubyChina
[https_github.com_iSimar_HackerNews-React-Native]: https://github.com/iSimar/HackerNews-React-Native
[https_github.com_tabalt_ReactNativeNews]: https://github.com/tabalt/ReactNativeNews
[https_github.com_bradoyler_newswatch-react-native]: https://github.com/bradoyler/newswatch-react-native
[https_github.com_appintheair_react-native-buyscreen]: https://github.com/appintheair/react-native-buyscreen
[https_github.com_samuel1112_v2er]: https://github.com/samuel1112/v2er
[https_github.com_joemaddalone_react-native-todo]: https://github.com/joemaddalone/react-native-todo
[https_github.com_muratsu_react-native-beer]: https://github.com/muratsu/react-native-beer
[https_github.com_86_react-native-stars]: https://github.com/86/react-native-stars
[https_github.com_baofen14787_react-native-demo]: https://github.com/baofen14787/react-native-demo
[https_github.com_csarsam_ReactNativeChess]: https://github.com/csarsam/ReactNativeChess
[https_github.com_Johnqing_miumiu]: https://github.com/Johnqing/miumiu
[https_github.com_ababol_react-native-pokedex]: https://github.com/ababol/react-native-pokedex
[https_github.com_SFantasy_CNode-React-Native]: https://github.com/SFantasy/CNode-React-Native
[https_github.com_voronianski_EightTracksReactNative]: https://github.com/voronianski/EightTracksReactNative
[https_github.com_yoxisem544_Calculator-using-React-Native]: https://github.com/yoxisem544/Calculator-using-React-Native
[https_github.com_LeezQ_react-native-zhihu-app]: https://github.com/LeezQ/react-native-zhihu-app
[https_github.com_peralmq_ForeignExchangeApp]: https://github.com/peralmq/ForeignExchangeApp
[https_github.com_Shrugs_react-native-snippets]: https://github.com/Shrugs/react-native-snippets
[https_github.com_roman01la_react-native-babel]: https://github.com/roman01la/react-native-babel
[http_facebook.github.io_react-native]: http://facebook.github.io/react-native/
[http_react-china.org]: http://react-china.org/
[http_react.parts]: http://react.parts/
[http_reactnativemodules.com]: http://reactnativemodules.com/
[http_www.oschina.net_news_61214_11-react-native-ui-components]: http://www.oschina.net/news/61214/11-react-native-ui-components