Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Flipperを活用した デバッグ効率化について/flipper
Search
morizooo
November 25, 2021
Technology
0
570
Flipperを活用した デバッグ効率化について/flipper
morizooo
November 25, 2021
Tweet
Share
More Decks by morizooo
See All by morizooo
Androidアプリをリアーキテクチャした話/Android-rearchitecture
morizooo
1
170
Mirrativ-android-efforts
morizooo
1
7k
Android上でUnityを動かすためのノウハウ / Android with Unity
morizooo
2
630
消費型課金を導入する / Introduction to consumable In-App Billing
morizooo
0
380
カンファレンスアプリを作ったぞ!! / builderscon tokyo 2017 LT
morizooo
0
2.9k
Other Decks in Technology
See All in Technology
Oracle Database で機械学習を始めよう! Oracle Machine Learning
oracle4engineer
PRO
1
140
中央集権体制からDataOpsへの転換 / centralized-to-dataops-transformation
pei0804
7
1.5k
どう買う?Azure
kuniteru
1
190
プッシュ型子育てサービスを、先行プロジェクト実施自治体において開始します
govtechtokyo
0
280
Introducing Pkl
enomotok
0
100
GitHub最新情報キャッチアップ 2024年3月
dzeyelid
17
3.2k
大規模なアジャイル開発の現場と技術負債 / Technical Debt
yoshiitaka
21
4.1k
これまでのキャリアとこれからMLエンジニアとしてどう動くか
masatakashiwagi
0
550
依存ライブラリはどこに?
takesection
0
110
BDD(Cucumber)コミュニティが無料提供しているコンテンツの紹介と現在起きている危機
nihonbuson
4
750
Elementaryを用いたデータ品質の可視化とデータ基盤の運用改善
10xinc
6
1.6k
OpenTelemetry実践 はじめの一歩
taxin
0
320
Featured
See All Featured
A designer walks into a library…
pauljervisheath
199
23k
Designing on Purpose - Digital PM Summit 2013
jponch
109
6.4k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
242
20k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
352
28k
RailsConf 2023
tenderlove
0
510
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
24
2.2k
Keith and Marios Guide to Fast Websites
keithpitt
407
22k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
11
1.4k
Atom: Resistance is Futile
akmur
258
25k
YesSQL, Process and Tooling at Scale
rocio
160
13k
Into the Great Unknown - MozCon
thekraken
10
830
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
185
15k
Transcript
Flipperを活用した デバッグ効率化について 2021.10.26 morizooo #TechTalk_merpay_zozo_mirrativ © 2021 Mirrativ, Inc.
•Profile •morizooo(@morizo_999) •ミラティブAndroid担当(2018/2〜) •マイブーム:高級食パン,散財
99
99 • モバイルアプリデバッグのためのデスクトップアプリケーション • アプリからデータを受信して整形して可視化できる ◦ アプリにデータを送信することも可能 FLIPPERについて
目次 99 Flipper 基本編
99 • OkHttpでのAPI通信の内容を確認できる FLIPPERの標準機能
99 • HTTPレスポンスのモックも可能 ◦ isMockResponseSupportedを有効にすると使える ◦ APIモックサーバーの用途に使える ◦ データを一部書き換えて表示確認にも使える FLIPPERの標準機能
99 • SharedPreferencesの表示/更新ができる FLIPPERについて
99 • DeepLinkの表示確認できる ◦ 任意のリンクも実行可能 FLIPPERの標準機能
目次 99 Flipper 応用編
99 • FlipperはElectron+Reactで作られている ◦ 柔軟なカスタマイズが可能 • PubSubパターンに組み合わせると便利 FLIPPERのカスタムプラグインについて
99 MIRRATIV内のPUBSUBの一例 • リアルタイム通信のためにPubSubを利用 • 通信内容はJson ◦ TypeによってClient側でParse処理を切り替えている
配信者 視聴者 ①HTTPリクエスト ②Publish ③Subscribe ③Subscribe PubSubサーバー APIサーバー 配信画面
99 MIRRATIV内のPUBSUBの問題点 • Publishされるまでの条件が複雑だと検証に時間がかかる ◦ 例:配信者のランキング情報の切り替え → カスタムプラグインで解決 配信者 視聴者
①HTTPリクエスト ②Publish ③Subscribe ③Subscribe PubSubサーバー APIサーバー 配信画面
99 カスタムプラグインについて • プラグインの開発の流れ 1. FlipperのDesktopPluginを作成 2. Androidで作成したDesktopPluginと接続するためのClientを作成 3. AndroidはClientからデータを流す
4. FlipperのDesktopPluginでデータが表示されるか確認 • 詳細はTech blogへ!! https://tech.mirrativ.stream/entry/flipperCustomPlugin
99 プラグインの実装 Desktop Plugins Android Plugin アプリからデータ受信
99 プラグインの実装 Desktop Plugins Android Plugin アプリにデータ送信
カスタムプラグインの画面
99 カスタムプラグイン導入の結果 配信者 視聴者 ①HTTPリクエスト ②Publish ③Subscribe ③Subscribe PubSubサーバー APIサーバー
• 革命と呼ばれデバッグが爆速になった ◦ 通信内容の確認が楽 ◦ 任意タイミングでReplayできる ◦ メッセージを決めればMockで開発できる Flipper
99 • Flipperのカスタムプラグインを作成してデバッグの効率化をし ている • PubSubでのメッセージ通信で有効に使える まとめ
99 • 積極採用中です!! • 一緒に開発やりませんか!!11 WE ARE HIRING