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
740
Flipperを活用した デバッグ効率化について/flipper
morizooo
November 25, 2021
Tweet
Share
More Decks by morizooo
See All by morizooo
Androidアプリをリアーキテクチャした話/Android-rearchitecture
morizooo
1
210
Mirrativ-android-efforts
morizooo
1
7.4k
Android上でUnityを動かすためのノウハウ / Android with Unity
morizooo
2
810
消費型課金を導入する / Introduction to consumable In-App Billing
morizooo
0
500
カンファレンスアプリを作ったぞ!! / builderscon tokyo 2017 LT
morizooo
0
3.2k
Other Decks in Technology
See All in Technology
新規プロダクトでプロトタイプから正式リリースまでNext.jsで開発したリアル
kawanoriku0
1
200
OCI Oracle Database Services新機能アップデート(2025/06-2025/08)
oracle4engineer
PRO
0
180
[ JAWS-UG 東京 CommunityBuilders Night #2 ]SlackとAmazon Q Developerで 運用効率化を模索する
sh_fk2
3
460
エンジニアリングマネージャーの成長の道筋とキャリア / Developers Summit 2025 KANSAI
daiksy
3
1k
CDK CLIで使ってたあの機能、CDK Toolkit Libraryではどうやるの?
smt7174
4
190
共有と分離 - Compose Multiplatform "本番導入" の設計指針
error96num
2
1.1k
S3アクセス制御の設計ポイント
tommy0124
3
200
現場で効くClaude Code ─ 最新動向と企業導入
takaakikakei
1
260
プラットフォーム転換期におけるGitHub Copilot活用〜Coding agentがそれを加速するか〜 / Leveraging GitHub Copilot During Platform Transition Periods
aeonpeople
1
230
Rustから学ぶ 非同期処理の仕組み
skanehira
1
150
「その開発、認知負荷高すぎませんか?」Platform Engineeringで始める開発者体験カイゼン術
sansantech
PRO
2
560
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
cmusudakeisuke
1
280
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.7k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
How to Think Like a Performance Engineer
csswizardry
26
1.9k
The Power of CSS Pseudo Elements
geoffreycrofte
77
6k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
113
20k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
4 Signs Your Business is Dying
shpigford
184
22k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
36
2.5k
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