実はクックパッドでもFlutter使ってるんですよ〜 - DroidKaigi2022 AfterParty

Slide 1

Slide 1 text

Slide 2

Slide 2 text

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Slide 12

Slide 12 text

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

© 2022 Cookpad Inc. 19 アプリの前提    ● 事業者向けのアプリ   ○ ラベルのデータをAPIを介してfetchする   ○ iOS, Androidに提供されてるSDKを介して Bluetoothでプリンターと接続し、ラベルデータを送信する  ● 特徴  ○ iOS, Androidで展開したい   ○ プラットフォーム固有のらしさのあるUIを必ず実現する必要はない   ○ 複雑なロジックは存在しない    

Slide 20

Slide 20 text

● ネイティブで実装 or Flutter  ○ 当初はネイティブでAndroid先行実装の予定   ● 複雑な仕様はなく、特にUI上の表現がシンプルなためFlutterを用いるアイデアが出てきた   ○ APIとの通信、DBへの保存というシンプルなアプリ構成     ● Flutterの描画するUIの挙動が実用段階レベルなのを感じていた   ● Flutter自体の開発も活発で頻繁にアップデートなども行われていて、Googleがフォーカスしているのを感じた  © 2022 Cookpad Inc. 20 Flutterという選択肢 

Slide 21

Slide 21 text

● Flutterで開発することを決めた    ● 求める仕様とFlutterの旨味が重なった   ○ 複雑ではないロジック  ○ iOS, Androidで共通のUI  ○ モバイルエンジニアのリソースが少なくて済む(ECアプリなどもやることが無限)   ● 個人で得た技術を業務で活かせればと思った   ● (実は複雑なアプリじゃないし最悪ネイティブで書き直してもいいという話もしていた)   © 2022 Cookpad Inc. 21 Flutterを用いる意思決定 

Slide 22

Slide 22 text

● Flutterで開発することを決めた    ● 求める仕様とFlutterの旨味が重なった   ○ 複雑ではないロジック  ○ iOS, Androidで共通のUI  ○ モバイルエンジニアのリソースが少なくて済む(ECアプリなどもやることが無限)   ● 個人で得た技術を業務で活かせればと思った   ● (実は複雑なアプリじゃないし最悪ネイティブで書き直してもいいという話もしていた)   [宣伝]積極的に新しい技術への取り組みが行えるいい環境[宣伝]   © 2022 Cookpad Inc. 22 Flutterを用いる意思決定 

Slide 23

Slide 23 text

Slide 24

Slide 24 text

Slide 25

Slide 25 text

Slide 26

Slide 26 text

MethodChannelという仕組みで実現(Flutter側)   class BatteryState { // クライアント側とホスト側は、 MethodChannelのコンストラクタで渡されるチャネル名で接続される static const _platform = MethodChannel('samples.flutter.dev/battery'); Future _getBatteryLevel() async { try { // methodを呼び出す。method名をStringで指定してあげる。 final result = await _platform.invokeMethod('getBatteryLevel'); } on PlatformException catch (e) { // Stringで指定したメソッドが未定義などを場合エラーが throwされる } } } © 2022 Cookpad Inc. 26 iOS, Androidで提供されているプリンターSDKとのつなぎ込み     

Slide 27

Slide 27 text

MethodChannelという仕組みで実現(Android側)   when (call.method) { // call.methodにFlutter側で引数に渡したメソッド名が入っている "getBatteryLevel" -> { try { val batteryLevel = getBatteryLevel() result.success(batteryLevel) // 成功時は result.success } catch (throwable: Throwable) { result.error("1000", "Failed", null) // 失敗時は result.error } } else -> { result.notImplemented() // 未定義のメソッド名が入っていたときは result.notImplemented() } }  © 2022 Cookpad Inc. 27 iOS, Androidで提供されているプリンターSDKとのつなぎ込み     

Slide 28

Slide 28 text

Slide 29

Slide 29 text

基本的にはiOS, Androidともにネイティブと変わらない   ● flutterコマンドがipa, apk(aab)を吐いてくれる   ○ 中で通常のiOS, Androidアプリケーションがビルドされている   ● これをfastlaneなども用いてアップロードしてあげたり..     環境  ● Flutterコマンドを導入できる場所であればどこでも動く   ● クックパッドでは...  © 2022 Cookpad Inc. 29 アプリリリース周り 

Slide 30

Slide 30 text

Slide 31

Slide 31 text

Slide 32

Slide 32 text

「いい選択だったのでは」  ● アプリエンジニアは一人で実装を行えた   ● iOS版もAndroidのリリース後少ない工数で開発を行えた   ● 実際に問題なく今日も運用されている   ● 挙動などに不満や問題も上がっていない   →事業者向けアプリに採用したのはよかった     現状の課題点 (Flutterというよりはプロダクトの優先度の話ではある)   ● Flutterが書けてこのアプリに知見のある人が自分しかいないので危うさはある。   ○ ドキュメントの整備など  ● 十分なメンテナンスの時間を割けていない。   © 2022 Cookpad Inc. 32 Flutterの採用を今振り返ると 

Slide 33

Slide 33 text

Slide 34

Slide 34 text

特に有効なユースケースを考えて、ネイティブ/Web/Flutter etc..を選択する   ● 全解決の神ではもちろんない  ○ ネイティブ開発は滅ぶ!! とは私は思っていません   ● Flutter向きそう  ○ 事業者向けのアプリ  ○ 高速なパフォーマンスを意識しないアプリ   ○ ツール系の簡単なアプリ  ○ 新規事業とか新機能のプロトタイピング、MVPのアプリ   ● ネイティブで書くのがいいかも  ○ プラットフォームそれぞれに準拠したUIやなめらかな操作感を求められるアプリ   ○ 端末機能をフル活用したアプリ  © 2022 Cookpad Inc. 34 今後のFlutterへの向き合い方(@hagiの所感) 

Slide 35

Slide 35 text

● アプリを作る際はFlutterをぜひ選択肢に入れてみて   ○ マルチプラットフォームには夢がある。  ○ 特性を生かしていい感じにネイティブ・Flutter etc..を使い分ける   ○ 「B向けハードウェアと通信するが複雑なデザインはないアプリを高速に展開する」ユースケースにクックパッドマートではFlutterを選択したが、現時点ではいい選択だったと思っている。  ○ プラットフォーム固有APIもシンプルなものなので大きな障壁にはならない   ● クックパッドでは課題解決へ向けて囚われず・縛られず技術を活用していける環境がある。そしてFlutterを利用しているアプリもある。   ○ 物事を運ぶために適した技術はどれか？というような本質を考えた囚われない思想や、まだない技術への取り組みを積極的に行える縛られない環境がある   ○ 強みを存分に活かせる環境とも言える   ○ (個人的にはFlutterを用いた開発ももっと増えてほしい   © 2022 Cookpad Inc. 35 まとめ/今日覚えて・感じてほしいこと 

Slide 36

Slide 36 text

Slide 37

Slide 37 text