Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
ReactNa ve実践談
ShareWis Inc.
@Kuchitama
Copyright @kuchitama, All rights reserved. 1
自己紹介
@Kuchitama(国平清貴)
(株)シェアウィズ チーフエンジニア
Scala忍者
最近Rubyばっかり
1児の父
Copyright @kuchitama, All rights reserved. 2
シェアウィズ
大阪発 EdTech スタートアップ
Webサービス
ShareWis
ShareWisACT(近日ShareWisと統合)
その他
キャリアアップ研修
こういうのに興味がアレばご連絡ください https://goo.gl/amu...
シェアウィズのサービス
ShareWis
ReactNa ve製
https://youtu.be/qPecv5iSVIY
Copyright @kuchitama, All rights reserved. 4
質問
React使ったことあるひと?
Copyright @kuchitama, All rights reserved. 5
質問
スマーフォンアプリ作ったことあるひと?
Copyright @kuchitama, All rights reserved. 6
質問
ReactNa ve使ったことあるひと?
Copyright @kuchitama, All rights reserved. 7
質問
ReactNa veでアプリ作ってみたいひと?
Copyright @kuchitama, All rights reserved. 8
質問
ReactNa veでアプリ作ってみたいひと?
やめておけ!!!!
Copyright @kuchitama, All rights reserved. 9
おしながき
ReactNativeとは
ReactNativeのエコシステム
Pros/Cons
実際に困ったこと
何に向いているのか
ReactNative開発でコケないために
Copyright @kuchitama, All rights...
ReactNa veとは
Copyright @kuchitama, All rights reserved. 11
ReactNa veとは
FB製のiOS/Androidアプリ開発環境
Copyright @kuchitama, All rights reserved. 12
ReactNa veとは
Write once, Run everywhere
ここにいるみなさんには馴染み深いはず
Copyright @kuchitama, All rights reserved. 13
ReactNa veとは
Write once, Run everywhere
Learn once, Write everywhere
1度学べば何でも作れる
Copyright @kuchitama, All rights reserved...
ReactNa veとは
Learn once, Write everywhere
Reactを学べば、Webだけでなくスマートフォンアプリ開発ができる
Copyright @kuchitama, All rights reserved. 15
ReactNa veとは
Learn once Run everywhere
Reactを学べば、Webだけでなくスマートフォンアプリ開発ができる
Copyright @kuchitama, All rights reserved. 16
ReactNa veとは
ReactNative Showcase
Copyright @kuchitama, All rights reserved. 17
ReactNa veとは
ReactNative Showcase
Copyright @kuchitama, All rights reserved. 18
ReactNa veとは
ReactNative Showcase
Copyright @kuchitama, All rights reserved. 19
ReactNa veのエコシステム
Copyright @kuchitama, All rights reserved. 20
ReactNa veのエコシステム
Package Manager
npm/yarn
yarnオススメ(実際、利用中)
詳しくは@tan_go238 さんの発表で
rnpm
ReactNativeライブラリ用のパッケージマネージャ
ネイティブラ...
ReactNa veのエコシステム
Con nuous Integra on
シェアウィズ社の変遷
1. CircleCI
2. BuddyBuild
3. Jenkins
その他
MicroSoft Mobile CenterCopyrigh...
ReactNa veのエコシステム
Distribu on
AppHub(利用中)
MicroSoft CodePush
※リリース済みのアプリに対して、ストアを通すこと無くバージョンアップでき
る
※ReactNativeは内部にJSがバンド...
ReactNa veのエコシステム
Libraries
https://github.com/jondot/awesome-react-native
Copyright @kuchitama, All rights reserved. 24
Pros/Cons
Copyright @kuchitama, All rights reserved. 25
Pros
Reactのノウハウがそのまま使える
Reactの本読んだらReactNativeが書けた
Web技術でアプリが実装できる
ES2015/2016とか
ちょっと違うけどStyleSheetとか
1ソースでiOS/Android両方でき...
Cons
とはいえ、Native知識は必要
バージョンアップ早すぎ
OS/端末のバージョンアップへの追従
人材確保(採用)
Copyright @kuchitama, All rights reserved. 27
実際に困ったこと
Copyright @kuchitama, All rights reserved. 28
実際に困ったこと
タブレット対応
スタイル崩れる崩れる
結局、端末解像度に応じて、パターンを用意することに
つらい
Copyright @kuchitama, All rights reserved. 29
実際に困ったこと
バージョン設定の分散
package.json - ReactNativeアプリとしてのバージョン
Info.plist - iOSアプリとしてのバージョン
build.gradle - Androidアプリとしてのバージョン...
実際に困ったこと
ReactNative本体のバージョンアップ
1ヶ月ごとにリリース
破壊的変更が結構入る
特にスタイルは崩れやすい
外部ライブラリが追従してない
マイグレーションでネイティブコードの変更が上書きされる
つらすぎる
Copyri...
実際に困ったこと
その他
Redux導入
いろいろライブラリはある
けど正直面倒
油断するとメモリを圧迫
テスト
Copyright @kuchitama, All rights reserved. 32
ReactNa ve開発でコケないために
Copyright @kuchitama, All rights reserved. 33
ReactNa ve開発でコケないために
開発着手前のライブラリ選定
開発が活発か?
リリースサイクルは?
Androidに対応しているか?
Copyright @kuchitama, All rights reserved. 34
ReactNa ve開発でコケないために
Na veではダメですか?
iOS/Androidエンジニアが居ないと厳しい
タブレット対応するなら現状はネイティブが絶対楽
そもそもNativeの方が情報量が多い
てゆうか、メジャーリリースされてない...
ReactNa ve開発でコケないために
Cordovaではダメですか?
Cordovaの方がまだ情報量が多い
React使えばいいんじゃない?
そこまでパフォーマンス重要ですか?
メジャーリリースされてないツールを使うんですか?
Copyri...
じゃぁ何に向いてるのさ
List(
Webエンジニアしかいない(ヒト)
外部に依頼できない(主にカネ)
iOS/Android分けて作る余裕がない(ヒト、カネ、時間)
パフォーマンス必須
).forall
突然のScala
Copyright ...
最後に
Copyright @kuchitama, All rights reserved. 38
早くメジャーリリースしてくださいよ!!
Copyright @kuchitama, All rights reserved. 39
補足資料
http://artsy.github.io/blog/2016/08/15/React-Native-at-Artsy/
http://qiita.com/kiita312/items/8afed1d3cb47d097ac32
Co...
Upcoming SlideShare
Loading in …5
×

React native実践談

2,050 views

Published on

#kanjava の フロントエンド初心者勉強会 in 大阪 での発表資料です。
弊社 シェアウィズでの開発経験からの意見をまとめました。

Published in: Technology
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

React native実践談

  1. 1. ReactNa ve実践談 ShareWis Inc. @Kuchitama Copyright @kuchitama, All rights reserved. 1
  2. 2. 自己紹介 @Kuchitama(国平清貴) (株)シェアウィズ チーフエンジニア Scala忍者 最近Rubyばっかり 1児の父 Copyright @kuchitama, All rights reserved. 2
  3. 3. シェアウィズ 大阪発 EdTech スタートアップ Webサービス ShareWis ShareWisACT(近日ShareWisと統合) その他 キャリアアップ研修 こういうのに興味がアレばご連絡ください https://goo.gl/amuTfM Copyright @kuchitama, All rights reserved. 3
  4. 4. シェアウィズのサービス ShareWis ReactNa ve製 https://youtu.be/qPecv5iSVIY Copyright @kuchitama, All rights reserved. 4
  5. 5. 質問 React使ったことあるひと? Copyright @kuchitama, All rights reserved. 5
  6. 6. 質問 スマーフォンアプリ作ったことあるひと? Copyright @kuchitama, All rights reserved. 6
  7. 7. 質問 ReactNa ve使ったことあるひと? Copyright @kuchitama, All rights reserved. 7
  8. 8. 質問 ReactNa veでアプリ作ってみたいひと? Copyright @kuchitama, All rights reserved. 8
  9. 9. 質問 ReactNa veでアプリ作ってみたいひと? やめておけ!!!! Copyright @kuchitama, All rights reserved. 9
  10. 10. おしながき ReactNativeとは ReactNativeのエコシステム Pros/Cons 実際に困ったこと 何に向いているのか ReactNative開発でコケないために Copyright @kuchitama, All rights reserved. 10
  11. 11. ReactNa veとは Copyright @kuchitama, All rights reserved. 11
  12. 12. ReactNa veとは FB製のiOS/Androidアプリ開発環境 Copyright @kuchitama, All rights reserved. 12
  13. 13. ReactNa veとは Write once, Run everywhere ここにいるみなさんには馴染み深いはず Copyright @kuchitama, All rights reserved. 13
  14. 14. ReactNa veとは Write once, Run everywhere Learn once, Write everywhere 1度学べば何でも作れる Copyright @kuchitama, All rights reserved. 14
  15. 15. ReactNa veとは Learn once, Write everywhere Reactを学べば、Webだけでなくスマートフォンアプリ開発ができる Copyright @kuchitama, All rights reserved. 15
  16. 16. ReactNa veとは Learn once Run everywhere Reactを学べば、Webだけでなくスマートフォンアプリ開発ができる Copyright @kuchitama, All rights reserved. 16
  17. 17. ReactNa veとは ReactNative Showcase Copyright @kuchitama, All rights reserved. 17
  18. 18. ReactNa veとは ReactNative Showcase Copyright @kuchitama, All rights reserved. 18
  19. 19. ReactNa veとは ReactNative Showcase Copyright @kuchitama, All rights reserved. 19
  20. 20. ReactNa veのエコシステム Copyright @kuchitama, All rights reserved. 20
  21. 21. ReactNa veのエコシステム Package Manager npm/yarn yarnオススメ(実際、利用中) 詳しくは@tan_go238 さんの発表で rnpm ReactNativeライブラリ用のパッケージマネージャ ネイティブライブラリのリンクをある程度自動でやってくれる Copyright @kuchitama, All rights reserved. 21
  22. 22. ReactNa veのエコシステム Con nuous Integra on シェアウィズ社の変遷 1. CircleCI 2. BuddyBuild 3. Jenkins その他 MicroSoft Mobile CenterCopyright @kuchitama, All rights reserved. 22
  23. 23. ReactNa veのエコシステム Distribu on AppHub(利用中) MicroSoft CodePush ※リリース済みのアプリに対して、ストアを通すこと無くバージョンアップでき る ※ReactNativeは内部にJSがバンドルされてるだけなので、それを差し替え る Copyright @kuchitama, All rights reserved. 23
  24. 24. ReactNa veのエコシステム Libraries https://github.com/jondot/awesome-react-native Copyright @kuchitama, All rights reserved. 24
  25. 25. Pros/Cons Copyright @kuchitama, All rights reserved. 25
  26. 26. Pros Reactのノウハウがそのまま使える Reactの本読んだらReactNativeが書けた Web技術でアプリが実装できる ES2015/2016とか ちょっと違うけどStyleSheetとか 1ソースでiOS/Android両方できる 画面によってOSごとにソースを分けることもできる ネイティブパフォーマンス Copyright @kuchitama, All rights reserved. 26
  27. 27. Cons とはいえ、Native知識は必要 バージョンアップ早すぎ OS/端末のバージョンアップへの追従 人材確保(採用) Copyright @kuchitama, All rights reserved. 27
  28. 28. 実際に困ったこと Copyright @kuchitama, All rights reserved. 28
  29. 29. 実際に困ったこと タブレット対応 スタイル崩れる崩れる 結局、端末解像度に応じて、パターンを用意することに つらい Copyright @kuchitama, All rights reserved. 29
  30. 30. 実際に困ったこと バージョン設定の分散 package.json - ReactNativeアプリとしてのバージョン Info.plist - iOSアプリとしてのバージョン build.gradle - Androidアプリとしてのバージョン つらい Copyright @kuchitama, All rights reserved. 30
  31. 31. 実際に困ったこと ReactNative本体のバージョンアップ 1ヶ月ごとにリリース 破壊的変更が結構入る 特にスタイルは崩れやすい 外部ライブラリが追従してない マイグレーションでネイティブコードの変更が上書きされる つらすぎる Copyright @kuchitama, All rights reserved. 31
  32. 32. 実際に困ったこと その他 Redux導入 いろいろライブラリはある けど正直面倒 油断するとメモリを圧迫 テスト Copyright @kuchitama, All rights reserved. 32
  33. 33. ReactNa ve開発でコケないために Copyright @kuchitama, All rights reserved. 33
  34. 34. ReactNa ve開発でコケないために 開発着手前のライブラリ選定 開発が活発か? リリースサイクルは? Androidに対応しているか? Copyright @kuchitama, All rights reserved. 34
  35. 35. ReactNa ve開発でコケないために Na veではダメですか? iOS/Androidエンジニアが居ないと厳しい タブレット対応するなら現状はネイティブが絶対楽 そもそもNativeの方が情報量が多い てゆうか、メジャーリリースされてないツールを使うんですか? Copyright @kuchitama, All rights reserved. 35
  36. 36. ReactNa ve開発でコケないために Cordovaではダメですか? Cordovaの方がまだ情報量が多い React使えばいいんじゃない? そこまでパフォーマンス重要ですか? メジャーリリースされてないツールを使うんですか? Copyright @kuchitama, All rights reserved. 36
  37. 37. じゃぁ何に向いてるのさ List( Webエンジニアしかいない(ヒト) 外部に依頼できない(主にカネ) iOS/Android分けて作る余裕がない(ヒト、カネ、時間) パフォーマンス必須 ).forall 突然のScala Copyright @kuchitama, All rights reserved. 37
  38. 38. 最後に Copyright @kuchitama, All rights reserved. 38
  39. 39. 早くメジャーリリースしてくださいよ!! Copyright @kuchitama, All rights reserved. 39
  40. 40. 補足資料 http://artsy.github.io/blog/2016/08/15/React-Native-at-Artsy/ http://qiita.com/kiita312/items/8afed1d3cb47d097ac32 Copyright @kuchitama, All rights reserved. 40

×