20240201 _【Firebase】GDG Tokyo Monthly Online Tech Talks登壇資料

【Firebase】GDG Tokyo Monthly Online Tech Talksの登壇資料
https://gdg-tokyo.connpass.com/event/308519/

Transcript

1. Flutter×Firebaseサービス達で高速で モバイルアプリを開発した話 2024-02-01 【Firebase】GDG Tokyo Monthly Online Tech Talks Tatsunori Yamamoto
2. whoami 山本竜玄 Yamamoto Tatsunori 所属: フューチャー株式会社 / Global Design Group所属 経歴: 2021年10月入社 医療・ヘルスケア/エネルギー/最近は新規事業関係で 主にFlutterを触ってました 趣味・領域: Neovim好きです/アクアリウム/登山/薬剤師 Copyright ©2024 by Future Corporation
3. 今日話すこと 弊社の新規事業開発でのモバイルアプリ開発を例に、 Flutter×Firebaseでの技術選定、工夫した点を伝える
4. アプリの概要 背景： 新規事業プロジェクトなので、 とりあえず高速で試行錯誤しながらモバイルアプリ開発をしたい ざっくりと機能： 　 ・ユーザー向けのアプリとしたい。認証認可、セキュリティは担保したい ・「友達機能」「いいね」のようなコミュニティ機能も考慮したい ・写真や動画、音楽も扱いたい。動画生成もできたら良いね Copyright ©2024 by Future Corporation
5. Flutter×Firebaseの選定理由 考えること： ・新規事業プロジェクトで、とりあえず少人数体制で高速で試行錯誤しながら 　モバイルアプリ開発をしたい ・アプリの利用状況、不具合はウォッチしたい ・将来的には拡大することも見越して、拡張性は備えたい ・(今回のプロジェクトでは)動画作成サービスが機能として必要 Flutter×Firebaseで作ろう！ Copyright ©2024 by Future Corporation
6. アプリのアーキテクチャ概要 Flutter 最小限のモバイルアプリ構成として、Firebaseのサービスを活用 Store & Storage Monitoring Backend Jobs Copyright ©2024 by Future Corporation
7. 使用したFirebaseのサービス達 ・ユーザー認証機能：Firebase Authentication ・ストレージ：Cloud Firestore, Cloud Storage for Firebase ・セキュリティ担保：Firebase App Check ・アプリ利用状況解析：Google Analytics for Firebase ・アプリのクラッシュ通知：Firebase Crashlytics ・その他：Firebase Hosting, Firebase Cloud Messaging Copyright ©2024 by Future Corporation
8. Flutterのプラグイン対応 ・Flutterへの導入はFirebase の公式ドキュメントにも記載さ れている ・Flutterのプラグインも充実し ており、導入しやすい (https://firebase.google.co m/docs/flutter/setup?hl=ja &platform=ios) Copyright ©2024 by Future Corporation
9. App Check App Check： ・正規ストア以外の不正なアプリからの利用を防ぐ ・リクエストに証明書プロバイダの証明書を添付してチェック　する仕 組み ・マルチプラットフォーム(iOS/Android)の登録も簡単 ・Flutter側の実装は数行くらいでできる ・ダッシュボードでモニタリングできる マルチプラットフォームの不正アプリ対策が手軽に可能に Copyright ©2024 by Future Corporation
10. Cloud Firestore & Cloud Storage for Firebase Cloud Firestore: ・NoSQL型のデータベース ・高速で開発する中で、データ構造の変更が容易 ・FlutterでStreamとして受け取り、リアルタイムに変更監視可能 ・セキュリティルールの記載が必須 Cloud Storage for Firebase: ・オブジェクト ストレージ サービス ・今回は、写真・動画・音声のアップロードに使用 ・セキュリティルールの記載が必須 Flutter連携やモバイルアプリのUI構築が容易に Copyright ©2024 by Future Corporation
11. Crashlytics & Google Analytics for Firebase Crashlytics: ・アプリのクラッシュを検知して通知できる ・今回はSlackに投稿するようにしていた Google Analytics: ・アプリの使用状況とユーザー エンゲージメントについて分析できる ・今回は、ユーザー離脱率や操作画面のモニタリングに活用 ・Big Queryに連携して本格的な分析も可能 Copyright ©2024 by Future Corporation
12. Crashlytics/Analyticsの使い分け どちらもログは出力できる。使い分けはどうしたか？ Firebase Crashlytics: ・アプリのクラッシュを検知して通知できる ・クラッシュ以外に、非致命的(Non-fatal)なエラーも送信できる クラッシュレポートや重要なエラーをSlackに通知することで迅速に対応で きるように Copyright ©2024 by Future Corporation
13. Crashlytics/Analyticsの使い分け Analyticsにログを出すことで、UIフローの検討や広告効果の検討などを手軽に Google Analytics: ・イベントのロギングでユーザー行動の可視化 ・画面の追跡で、UIフロー改善 Copyright ©2024 by Future Corporation
14. Firebase Remote Config Remote Configで強制アップデートやメンテナンス画面への切り替え Copyright ©2024 by Future Corporation Remote Config: ・コンソール上でパラメータ値を 　管理できる ・アップデートをすることなく、 　画面切り替えなどが実施可能
15. 結果として... Flutter×Firebaseで開発速度・監視・拡張性を担保できた
16. まとめ ・高速でモバイルアプリ開発を快適にできた(試行錯誤する前提) ・アプリの利用状況、不具合をウォッチする仕組みを簡単に導入できた ・写真・動画の扱いも簡単に連携できた ・Flutter×Firebaseの相性、開発しやすさを実感できた ・今後、Firebaseを使いこなしてできることがいろいろある 　(A/B TestingやRemote Config活用など) Copyright ©2024 by Future Corporation
17. フューチャー株式会社について ・大崎にあるITコンサル会社 ・経営戦略から実装、運用までをすべてこなす ・ベンダーニュートラルの考え方 ・「ないものはつくる」 こんな人がいます ・Real World HTTPの著者 ・実用Go言語の著者たち ・Vue.jsのコミッター ・TomcatのPMCメンバー ・OSS「Vuls」の作成者 Copyright ©2024 by Future Corporation
18. ご静聴ありがとうございました