SlideShare a Scribd company logo
1 of 20
Download to read offline
Rx世界線と
リーディングシュタイナー
iOSDC 2018
@hayatan_
自己紹介
• 大門弘明
• DMM.com
• Twitter は @hayatan_
• 本業は光の戦士(ナイト)
• 初見です、よろしくお願いします
今日はなすこととか
• ViewModelの設計の話になります
• アプリのフルリプレイス中(現在進行中)
• RxSwift + MVVM を採用
• 超初心者です
• 設計初心者です
• LTも初心者です
現状の問題
• 「BaseViewController」なる秘伝のタレ。
• ViewControllerにロジックが書かれている。
• 自動テストが書いてない。書けない。
リプレイスに求められること
• すばやく事業の要望に答えられる、変更に強い
設計にしたい
• 流行りの技術を積極的に程度取り入れたい
View
View, ViewController
入力・表示(出力)
ViewModel
Input を受け取り
Output を返す
Model
ビジネスロジックや永続化
UseCase / Domain / Infra
Input

ユーザーの操作

Viewのライフサイクルのイベント

viewWillAppear, tapButton, textInput …
Output

文字・画像

Viewの状態(isEnabledとか)

画面遷移

ButtonIsEnable, transitionDetail…
HogeUseCase.execute(arg: Arg)
View
View, ViewController
入力・表示(出力)
View
View, ViewController
入力・表示(出力)
ViewModel
Input を受け取り
Output を返す
Input

ユーザーの操作

Viewのライフサイクルのイベント

viewWillAppear, tapButton, textInput …
Output

文字・画像

Viewの状態(isEnabledとか)

画面遷移

ButtonIsEnable, transitionDetail…
View
View, ViewController
入力・表示(出力)
ViewModel
Input を受け取り
Output を返す
Model
ビジネスロジックや永続化
UseCase / Domain / Infra
Input

ユーザーの操作

Viewのライフサイクルのイベント

viewWillAppear, tapButton, textInput …
Output

文字・画像

Viewの状態(isEnabledとか)

画面遷移

ButtonIsEnable, transitionDetail…
HogeUseCase.execute(arg: Arg)
とあるViewModelの設計
• 画面表示
• ボタンタップ
• テキスト入力 …等
• 画像 / テキスト
• ボタンなどの状態
• 画面遷移 …等
Input
Observable<T>
Output
Signal<T>, Driver<T>
Input
Observable<T>
Output
Signal<T>, Driver<T>
仕事
とあるViewModelの設計
• 画面表示
• ボタンタップ
• テキスト入力 …等
• 画像 / テキスト
• ボタンなどの状態
• 画面遷移 …等
• なんかする
ユーザー名とパスワードを入力した状態で、
ログインボタンをタップすると、ログイン
処理が走る。
ログイン処理が成功すると
メイン画面へ遷移する。
失敗するとエラーダイアログが表示される。
Input・Outputの洗い出し
Input
[タップ]キーボードのDone
[タップ]パスワードを忘れた
[テキスト編集]ユーザ名
[テキスト編集]パスワード
[タップ]ログイン
Output
[遷移]メイン画面
[遷移]パスワード復旧画面
[遷移]閉じる
[状態]ログインボタンの活性非活性
[遷移]アラートの表示
[状態]ローディングの表示非表示
[状態]ユーザ名の編集有効無効
[状態]パスワードの編集有効無効
Input・Outputの洗い出し
Input
[タップ]キーボードのDone
[タップ]パスワードを忘れた
[テキスト編集]ユーザ名
[テキスト編集]パスワード
[タップ]ログイン
Output
[遷移]メイン画面
[遷移]パスワード復旧画面
[遷移]閉じる
[状態]ログインボタンの活性非活性
[遷移]アラートの表示
[状態]ローディングの表示非表示
[状態]ユーザ名の編集有効無効
[状態]パスワードの編集有効無効
Input・Outputの洗い出し
Input
[タップ]キーボードのDone
[タップ]パスワードを忘れた
[テキスト編集]ユーザ名
[テキスト編集]パスワード
[タップ]ログイン
Output
[遷移]メイン画面
[遷移]パスワード復旧画面
[遷移]閉じる
[状態]ログインボタンの活性非活性
[遷移]アラートの表示
[状態]ローディングの表示非表示
[状態]ユーザ名の編集有効無効
[状態]パスワードの編集有効無効
Input
Output
ログイン画面のViewModelの設計
• ユーザ名: Observable<String?>
• パスワード: Observable<String?>
• ログインボタンタップ: Observable<Void>
• アラートを表示: Signal<Void>
• 画面遷移: Signal<Void>
• ログインUseCaseに

ユーザ名, パスワードを投げる
• 成功なら画面遷移する
• 失敗ならアラートを出す
仕事
ログイン画面のViewModelのインターフェース
まとめ
• 「BaseViewController」なる秘伝のタレ。

→ そもそもそんなものは存在しなくなった
• ViewControllerにロジックが書かれている。

→ ViewControllerは入力と出力だけを気にすれば良い!
• テストが書いてない。書けない。

→ Input, output からViewModelのテストが書ける!
ご清聴ありがとうございました

More Related Content

Similar to Rx世界線とリーディングシュタイナー iOSDC 2018 ルーキーズLT

アーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチ
アーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチアーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチ
アーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチYusuke Suzuki
 
スマートデバイスSIの落とし穴と適した開発手法とは?
スマートデバイスSIの落とし穴と適した開発手法とは?スマートデバイスSIの落とし穴と適した開発手法とは?
スマートデバイスSIの落とし穴と適した開発手法とは?Takuya Kitamura
 
ReactでCMSを作ったときにハマったこと
ReactでCMSを作ったときにハマったことReactでCMSを作ったときにハマったこと
ReactでCMSを作ったときにハマったことkazuki matsumura
 
はじめてのアジャイル
はじめてのアジャイルはじめてのアジャイル
はじめてのアジャイルYoshihito Kuranuki
 
システムのモダナイズ 落ちても良いアプリの作り方
システムのモダナイズ 落ちても良いアプリの作り方システムのモダナイズ 落ちても良いアプリの作り方
システムのモダナイズ 落ちても良いアプリの作り方Chihiro Ito
 
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】Tomoharu ASAMI
 
VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0
VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0
VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0Michitaka Yumoto
 
マイクロサービスとは.pptx
マイクロサービスとは.pptxマイクロサービスとは.pptx
マイクロサービスとは.pptxssuserdd7ea9
 
.NET 7におけるBlazorの新機能
.NET 7におけるBlazorの新機能.NET 7におけるBlazorの新機能
.NET 7におけるBlazorの新機能TomomitsuKusaba
 
【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは
【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは
【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは日本マイクロソフト株式会社
 
RHF2021_ポイントは業務視点.pdf
RHF2021_ポイントは業務視点.pdfRHF2021_ポイントは業務視点.pdf
RHF2021_ポイントは業務視点.pdfMasahiko Umeno
 
WebエンジニアのReactNativeでの戦い方
WebエンジニアのReactNativeでの戦い方WebエンジニアのReactNativeでの戦い方
WebエンジニアのReactNativeでの戦い方PIXTA Inc.
 
明日から使える業務向けデザインシステムのご紹介
明日から使える業務向けデザインシステムのご紹介明日から使える業務向けデザインシステムのご紹介
明日から使える業務向けデザインシステムのご紹介Fixel Inc.
 
.NET 7期待の新機能
.NET 7期待の新機能.NET 7期待の新機能
.NET 7期待の新機能TomomitsuKusaba
 
楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten, core skills neede...
楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten,  core skills  neede...楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten,  core skills  neede...
楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten, core skills neede...Rakuten Group, Inc.
 
Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」
Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」
Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」kashiwanoha-iot
 
ABC2012Spring 20120324
ABC2012Spring 20120324ABC2012Spring 20120324
ABC2012Spring 20120324Tak Inamori
 
超高速アプリ開発法
超高速アプリ開発法超高速アプリ開発法
超高速アプリ開発法Keiichi SASAKI
 

Similar to Rx世界線とリーディングシュタイナー iOSDC 2018 ルーキーズLT (20)

アーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチ
アーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチアーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチ
アーキテクチャの進化から学ぶ、プラットフォームエンジニアリングへのアプローチ
 
スマートデバイスSIの落とし穴と適した開発手法とは?
スマートデバイスSIの落とし穴と適した開発手法とは?スマートデバイスSIの落とし穴と適した開発手法とは?
スマートデバイスSIの落とし穴と適した開発手法とは?
 
ReactでCMSを作ったときにハマったこと
ReactでCMSを作ったときにハマったことReactでCMSを作ったときにハマったこと
ReactでCMSを作ったときにハマったこと
 
はじめてのアジャイル
はじめてのアジャイルはじめてのアジャイル
はじめてのアジャイル
 
システムのモダナイズ 落ちても良いアプリの作り方
システムのモダナイズ 落ちても良いアプリの作り方システムのモダナイズ 落ちても良いアプリの作り方
システムのモダナイズ 落ちても良いアプリの作り方
 
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
 
VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0
VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0
VentureCafe_第2回:SIerでのキャリアパスを考える_ござ先輩発表資料 V1.0
 
マイクロサービスとは.pptx
マイクロサービスとは.pptxマイクロサービスとは.pptx
マイクロサービスとは.pptx
 
.NET 7におけるBlazorの新機能
.NET 7におけるBlazorの新機能.NET 7におけるBlazorの新機能
.NET 7におけるBlazorの新機能
 
【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは
【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは
【de:code 2020】 ビジネスをアジャイルに変革する「Cloud Center of Excellence」とは
 
.NET Lab2022年2月
.NET Lab2022年2月.NET Lab2022年2月
.NET Lab2022年2月
 
RHF2021_ポイントは業務視点.pdf
RHF2021_ポイントは業務視点.pdfRHF2021_ポイントは業務視点.pdf
RHF2021_ポイントは業務視点.pdf
 
WebエンジニアのReactNativeでの戦い方
WebエンジニアのReactNativeでの戦い方WebエンジニアのReactNativeでの戦い方
WebエンジニアのReactNativeでの戦い方
 
明日から使える業務向けデザインシステムのご紹介
明日から使える業務向けデザインシステムのご紹介明日から使える業務向けデザインシステムのご紹介
明日から使える業務向けデザインシステムのご紹介
 
.NET 7期待の新機能
.NET 7期待の新機能.NET 7期待の新機能
.NET 7期待の新機能
 
楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten, core skills neede...
楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten,  core skills  neede...楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten,  core skills  neede...
楽天市場で使われている技術、エンジニアに必要なコアスキルとはTechnology used in Rakuten, core skills neede...
 
Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」
Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」
Azure IoT/AI 最前線!「IoTビジネス事例のご紹介」
 
Ms retail update ra 20191030
Ms retail update ra 20191030Ms retail update ra 20191030
Ms retail update ra 20191030
 
ABC2012Spring 20120324
ABC2012Spring 20120324ABC2012Spring 20120324
ABC2012Spring 20120324
 
超高速アプリ開発法
超高速アプリ開発法超高速アプリ開発法
超高速アプリ開発法
 

Rx世界線とリーディングシュタイナー iOSDC 2018 ルーキーズLT