狠狠撸

狠狠撸Share a Scribd company logo
React Native on Android
分享Goodnight的開發之路
Speaker
楊万皇Howard Yang
iOS, Ruby on Rails, Node.js, React Native
https://github.com/oney
appdevoney@gmail.com
Goodnight https://goodnight.io co-founder
Why React Native
1. Cross platform (share 90-100% codebase)
2. React.js
3. Live reload development
4. Over-the-air update (maintain 1 version like web)
5. Native, controlled by Javascript
6. Build native using web skill
7. Developed by Facebook (Group, Ad manager app)
Why React
1. Reactive programming (e.g. ReactiveCocoa, RxJava)
2. Declarative (vs. imperative)
3. Component
4. (data) => view
5. Virtual DOM
6. Performance
React Native on Android
React Native on Android
Live Demo
Issues
1. Animation
2. Gesture
3. Performance
4. Bugs
5. Insufficient 3rd package (However, you have node and react.js things)
1. 找工作不要學React Native。
工作太少,足夠大的公司有資源分多版本開發
2. 創業適合使用React Native。
夠快、跨平台、快速prototyping不要求細節
3. 新手不要使用React Native。
太多坑踩下去跳不出
4. Front-end可學習React Native。
最好有人帶,要有心理準備學習大量Native開發概念
5. Native開發者推薦學習React Native。
Conclusion
Q&A
References
1. https://facebook.github.io/react-native/
2. https://www.youtube.com/watch?v=KVZ-P-ZI6W4
3. https://www.youtube.com/watch?v=oWPoW0gIzvs
One more thing...
Goodnight是一個匿名通話交友App,目前使
用者約五万,DAU 3000人,受到廣大高中、
大學生青睞,正在尋求投資,有興趣請聯絡我
們。

More Related Content

What's hot (20)

Angular 4 新手入門攻略完全制霸
Angular 4 新手入門攻略完全制霸Angular 4 新手入門攻略完全制霸
Angular 4 新手入門攻略完全制霸
Will Huang
?
Micro-frontends with Angular 10 (Modern Web 2020)
Micro-frontends with Angular 10 (Modern Web 2020)Micro-frontends with Angular 10 (Modern Web 2020)
Micro-frontends with Angular 10 (Modern Web 2020)
Will Huang
?
AngularJS training in Luster
AngularJS training in LusterAngularJS training in Luster
AngularJS training in Luster
Jason Chung
?
快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)
快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)
快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)
Will Huang
?
React Native & V2HOT
React Native & V2HOTReact Native & V2HOT
React Native & V2HOT
Xcat Liu
?
Angular js twmvc#17
Angular js twmvc#17Angular js twmvc#17
Angular js twmvc#17
twMVC
?
Angular 2 Taiwan 小聚 Forms 介紹
Angular 2 Taiwan 小聚 Forms 介紹Angular 2 Taiwan 小聚 Forms 介紹
Angular 2 Taiwan 小聚 Forms 介紹
Jeff Wu
?
前端爆肝之旅+搁别补肠迟上山前的小专案心得分享
前端爆肝之旅+搁别补肠迟上山前的小专案心得分享前端爆肝之旅+搁别补肠迟上山前的小专案心得分享
前端爆肝之旅+搁别补肠迟上山前的小专案心得分享
Yao Nien Chung
?
React 组件开发
React 组件开发React 组件开发
React 组件开发
Xcat Liu
?
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
Will Huang
?
Angular.js & ASP.NET in Study4
Angular.js & ASP.NET in Study4Angular.js & ASP.NET in Study4
Angular.js & ASP.NET in Study4
Kyle Shen
?
Vue
VueVue
Vue
國昭 張
?
快快樂樂學 Angular 2 開發框架
快快樂樂學 Angular 2 開發框架快快樂樂學 Angular 2 開發框架
快快樂樂學 Angular 2 開發框架
Will Huang
?
Visual Studio 2017 新功能探索 (Study4.TW)
Visual Studio 2017 新功能探索 (Study4.TW)Visual Studio 2017 新功能探索 (Study4.TW)
Visual Studio 2017 新功能探索 (Study4.TW)
Will Huang
?
使用 ASP.NET 5 實戰開發雲端應用程式
使用 ASP.NET 5 實戰開發雲端應用程式使用 ASP.NET 5 實戰開發雲端應用程式
使用 ASP.NET 5 實戰開發雲端應用程式
Will Huang
?
Blazor 與 Radzen 同行
Blazor 與 Radzen 同行Blazor 與 Radzen 同行
Blazor 與 Radzen 同行
Jimmy Ho
?
kissy modularization part2
kissy modularization part2kissy modularization part2
kissy modularization part2
yiming he
?
React js
React jsReact js
React js
國昭 張
?
Angular 2 表單的處理與驗證
Angular 2 表單的處理與驗證Angular 2 表單的處理與驗證
Angular 2 表單的處理與驗證
Jeff Wu
?
数学系的资讯人生
数学系的资讯人生数学系的资讯人生
数学系的资讯人生
Jintin Lin
?
Angular 4 新手入門攻略完全制霸
Angular 4 新手入門攻略完全制霸Angular 4 新手入門攻略完全制霸
Angular 4 新手入門攻略完全制霸
Will Huang
?
Micro-frontends with Angular 10 (Modern Web 2020)
Micro-frontends with Angular 10 (Modern Web 2020)Micro-frontends with Angular 10 (Modern Web 2020)
Micro-frontends with Angular 10 (Modern Web 2020)
Will Huang
?
AngularJS training in Luster
AngularJS training in LusterAngularJS training in Luster
AngularJS training in Luster
Jason Chung
?
快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)
快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)
快快樂樂學會 Angular 2 網站開發框架 (Modern Web 2016)
Will Huang
?
React Native & V2HOT
React Native & V2HOTReact Native & V2HOT
React Native & V2HOT
Xcat Liu
?
Angular js twmvc#17
Angular js twmvc#17Angular js twmvc#17
Angular js twmvc#17
twMVC
?
Angular 2 Taiwan 小聚 Forms 介紹
Angular 2 Taiwan 小聚 Forms 介紹Angular 2 Taiwan 小聚 Forms 介紹
Angular 2 Taiwan 小聚 Forms 介紹
Jeff Wu
?
前端爆肝之旅+搁别补肠迟上山前的小专案心得分享
前端爆肝之旅+搁别补肠迟上山前的小专案心得分享前端爆肝之旅+搁别补肠迟上山前的小专案心得分享
前端爆肝之旅+搁别补肠迟上山前的小专案心得分享
Yao Nien Chung
?
React 组件开发
React 组件开发React 组件开发
React 组件开发
Xcat Liu
?
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
TypeScript 開發實戰:開發即時互動的 html5 websocket 聊天室應用程式
Will Huang
?
Angular.js & ASP.NET in Study4
Angular.js & ASP.NET in Study4Angular.js & ASP.NET in Study4
Angular.js & ASP.NET in Study4
Kyle Shen
?
快快樂樂學 Angular 2 開發框架
快快樂樂學 Angular 2 開發框架快快樂樂學 Angular 2 開發框架
快快樂樂學 Angular 2 開發框架
Will Huang
?
Visual Studio 2017 新功能探索 (Study4.TW)
Visual Studio 2017 新功能探索 (Study4.TW)Visual Studio 2017 新功能探索 (Study4.TW)
Visual Studio 2017 新功能探索 (Study4.TW)
Will Huang
?
使用 ASP.NET 5 實戰開發雲端應用程式
使用 ASP.NET 5 實戰開發雲端應用程式使用 ASP.NET 5 實戰開發雲端應用程式
使用 ASP.NET 5 實戰開發雲端應用程式
Will Huang
?
Blazor 與 Radzen 同行
Blazor 與 Radzen 同行Blazor 與 Radzen 同行
Blazor 與 Radzen 同行
Jimmy Ho
?
kissy modularization part2
kissy modularization part2kissy modularization part2
kissy modularization part2
yiming he
?
Angular 2 表單的處理與驗證
Angular 2 表單的處理與驗證Angular 2 表單的處理與驗證
Angular 2 表單的處理與驗證
Jeff Wu
?
数学系的资讯人生
数学系的资讯人生数学系的资讯人生
数学系的资讯人生
Jintin Lin
?

Similar to React Native on Android (20)

JSDC 2015 React-Native 實戰
JSDC 2015 React-Native 實戰JSDC 2015 React-Native 實戰
JSDC 2015 React-Native 實戰
Sam Lee
?
React-Native share
React-Native shareReact-Native share
React-Native share
Eddie Hsu
?
J Ruby和Rails 让Ruby语言融入Java项目
J Ruby和Rails 让Ruby语言融入Java项目J Ruby和Rails 让Ruby语言融入Java项目
J Ruby和Rails 让Ruby语言融入Java项目
George Ang
?
介紹前端 Web 技術在跨平台開發上的應用
介紹前端 Web 技術在跨平台開發上的應用介紹前端 Web 技術在跨平台開發上的應用
介紹前端 Web 技術在跨平台開發上的應用
Jerry Lin
?
React native 開發快速上手 20171106
React native 開發快速上手 20171106React native 開發快速上手 20171106
React native 開發快速上手 20171106
Phoebe Pan
?
Thinking in React by Deot
Thinking in React by Deot Thinking in React by Deot
Thinking in React by Deot
荣德 周
?
Java 1(Java概述)
Java 1(Java概述)Java 1(Java概述)
Java 1(Java概述)
xzdbd
?
React native redux_sharing
React native redux_sharingReact native redux_sharing
React native redux_sharing
Sam Lee
?
2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt
tka
?
跨平台开发从测试到架构
跨平台开发从测试到架构跨平台开发从测试到架构
跨平台开发从测试到架构
Chris Jeng
?
Hybrid app简要介绍
Hybrid app简要介绍Hybrid app简要介绍
Hybrid app简要介绍
Eric Xiao
?
Study4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionicStudy4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionic
Kyle Shen
?
React - Reactstrap example
React -  Reactstrap exampleReact -  Reactstrap example
React - Reactstrap example
昇倫 蔡
?
20141212 html5 及微軟跨平台佈局 long
20141212 html5 及微軟跨平台佈局   long20141212 html5 及微軟跨平台佈局   long
20141212 html5 及微軟跨平台佈局 long
Meng-Ru (Raymond) Tsai
?
顿2冲狈辞诲别在淘宝的应用实践
顿2冲狈辞诲别在淘宝的应用实践顿2冲狈辞诲别在淘宝的应用实践
顿2冲狈辞诲别在淘宝的应用实践
Jackson Tian
?
ReactMaker start kit intro
ReactMaker start kit introReactMaker start kit intro
ReactMaker start kit intro
昇倫 蔡
?
HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型
Tom Fan
?
從 Java programmer 的觀點看 ruby
從 Java programmer 的觀點看 ruby從 Java programmer 的觀點看 ruby
從 Java programmer 的觀點看 ruby
建興 王
?
打開窗,讓大象跨進來 - Microsoft HDInsight
打開窗,讓大象跨進來 - Microsoft HDInsight打開窗,讓大象跨進來 - Microsoft HDInsight
打開窗,讓大象跨進來 - Microsoft HDInsight
Kuo-Chun Su
?
51 cto下载 51cto信息图:openshift vs cloudfoundry
51 cto下载 51cto信息图:openshift vs cloudfoundry51 cto下载 51cto信息图:openshift vs cloudfoundry
51 cto下载 51cto信息图:openshift vs cloudfoundry
Hong Cai
?
JSDC 2015 React-Native 實戰
JSDC 2015 React-Native 實戰JSDC 2015 React-Native 實戰
JSDC 2015 React-Native 實戰
Sam Lee
?
React-Native share
React-Native shareReact-Native share
React-Native share
Eddie Hsu
?
J Ruby和Rails 让Ruby语言融入Java项目
J Ruby和Rails 让Ruby语言融入Java项目J Ruby和Rails 让Ruby语言融入Java项目
J Ruby和Rails 让Ruby语言融入Java项目
George Ang
?
介紹前端 Web 技術在跨平台開發上的應用
介紹前端 Web 技術在跨平台開發上的應用介紹前端 Web 技術在跨平台開發上的應用
介紹前端 Web 技術在跨平台開發上的應用
Jerry Lin
?
React native 開發快速上手 20171106
React native 開發快速上手 20171106React native 開發快速上手 20171106
React native 開發快速上手 20171106
Phoebe Pan
?
Thinking in React by Deot
Thinking in React by Deot Thinking in React by Deot
Thinking in React by Deot
荣德 周
?
Java 1(Java概述)
Java 1(Java概述)Java 1(Java概述)
Java 1(Java概述)
xzdbd
?
React native redux_sharing
React native redux_sharingReact native redux_sharing
React native redux_sharing
Sam Lee
?
2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt2012 java two-desktop-appliction-using-j-ruby-with-swt
2012 java two-desktop-appliction-using-j-ruby-with-swt
tka
?
跨平台开发从测试到架构
跨平台开发从测试到架构跨平台开发从测试到架构
跨平台开发从测试到架构
Chris Jeng
?
Hybrid app简要介绍
Hybrid app简要介绍Hybrid app简要介绍
Hybrid app简要介绍
Eric Xiao
?
Study4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionicStudy4 love.2016.2.20.ionic
Study4 love.2016.2.20.ionic
Kyle Shen
?
React - Reactstrap example
React -  Reactstrap exampleReact -  Reactstrap example
React - Reactstrap example
昇倫 蔡
?
20141212 html5 及微軟跨平台佈局 long
20141212 html5 及微軟跨平台佈局   long20141212 html5 及微軟跨平台佈局   long
20141212 html5 及微軟跨平台佈局 long
Meng-Ru (Raymond) Tsai
?
顿2冲狈辞诲别在淘宝的应用实践
顿2冲狈辞诲别在淘宝的应用实践顿2冲狈辞诲别在淘宝的应用实践
顿2冲狈辞诲别在淘宝的应用实践
Jackson Tian
?
ReactMaker start kit intro
ReactMaker start kit introReactMaker start kit intro
ReactMaker start kit intro
昇倫 蔡
?
HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型
Tom Fan
?
從 Java programmer 的觀點看 ruby
從 Java programmer 的觀點看 ruby從 Java programmer 的觀點看 ruby
從 Java programmer 的觀點看 ruby
建興 王
?
打開窗,讓大象跨進來 - Microsoft HDInsight
打開窗,讓大象跨進來 - Microsoft HDInsight打開窗,讓大象跨進來 - Microsoft HDInsight
打開窗,讓大象跨進來 - Microsoft HDInsight
Kuo-Chun Su
?
51 cto下载 51cto信息图:openshift vs cloudfoundry
51 cto下载 51cto信息图:openshift vs cloudfoundry51 cto下载 51cto信息图:openshift vs cloudfoundry
51 cto下载 51cto信息图:openshift vs cloudfoundry
Hong Cai
?

Recently uploaded (6)

Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...
Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...
Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...
RayChan91
?
2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...
2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...
2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...
David vonThenen
?
2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI
2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI
2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI
David vonThenen
?
匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理
匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理
匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理
kaozytf
?
Build_With_AI_2025 Gemini 2.0 New Function
Build_With_AI_2025  Gemini 2.0 New FunctionBuild_With_AI_2025  Gemini 2.0 New Function
Build_With_AI_2025 Gemini 2.0 New Function
kevinchiu59
?
阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理
阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理
阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理
kaozytf
?
Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...
Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...
Cantonmade 2025 Hotel Supplier Catalog: Technical Specs for Engineers & Integ...
RayChan91
?
2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...
2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...
2025 DeveloperWeek - The Sound of Innovation: Why Voice Cloning Will Redefine...
David vonThenen
?
2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI
2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI
2025 NVIDIA GTC: Crack the AI Black Box: Practical Techniques for Explainable AI
David vonThenen
?
匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理
匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理
匹兹堡大学毕业证(笔滨罢罢学位证范本毕业证书)办理
kaozytf
?
Build_With_AI_2025 Gemini 2.0 New Function
Build_With_AI_2025  Gemini 2.0 New FunctionBuild_With_AI_2025  Gemini 2.0 New Function
Build_With_AI_2025 Gemini 2.0 New Function
kevinchiu59
?
阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理
阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理
阿伯丁大学毕业证(鲍辞础学位证学历认证国外留学)办理
kaozytf
?

React Native on Android

Editor's Notes

  • #6: https://www.youtube.com/watch?v=oWPoW0gIzvs