「TimeTreeラヂオ」はカレンダーシェアアプリTimeTreeを運営する私たちメンバーが、ふだんの仕事に関係することもそうでないことも、だいたい15分でひとつのテーマを話しきるインターネットラジオ番組です。
今回のテーマは「TimeTree TodayのiOS開発、OpenAPIとSwiftUIのお話」について。この3人で話しました！
iOSエンジニア 佐藤（Sion @gonsee）
iOSエンジニア 坂口（Trevor @pengtaros）
ブランド コミュニケーション 渡部（Steve @ShinyaWatanabe_）
ラヂオを聴く👂🏻 https://open.spotify.com/episode/2WqIYrpdaW9i3gKYWu1tAE
ラヂオを読む📝 配信の内容を文章でお読みになりたい方はこのままお進みください！
（02:50〜）
TimeTreeの「Today」でiOSがチャレンジしたこと
Steve 今日のテーマは、最近タイムリーで「Today」というですね、新機能をリリースしまして。結構大きなアップデートだったんですが、この「Today」の主にiOSの開発についてお2人に聞きたいなと思ってます。ちょっと簡単に概要を説明すると、今ですねカレンダーのマンスリー画面の左下のボタンに設置されていて、その日にまつわるいろんな情報が集約されたページ。僕らはメディアって呼んでるんですが。占いとか、今日の天気とか。占いはね、ちょっと社内で賛否両論あるんですけどね。今日はその否の方を代表するメンバーが1人いるんですけど（笑）。
Trevor 今日をちょっと良くするためにっていうテーマですよね。
Steve そうですね、コンセプトとしては。TimeTreeのブランドプロミスが「明日をちょっとよくするために」で、Todayは今日にまつわってるので、今日の皆さんの生活とかのちょっとした行動のきっかけになるようなページにしたいなって思って作ってます。ここの開発を担ってくれたのが、今日来てくれたおふたり。
Trevor そうですねもうひとりFunnyっていうiOSの開発メンバーがいるんですけど、Funnyにも手伝ってもらいながら3人で。広告チームで、広告まわり（の実装）とかログまわりで助けてもらいました。
Steve なに聞きたいかっていうと、結構いろいろ僕、気になっているんですけど。実はTodayにTimeTreeとしては新しい技術を取り入れているらしい。
Trevor, Sion はい、取り入れました。
Steve どんな技術を取り入れて、なぜ今回Todayプロジェクトで取り入れたのか。それを採用するにあたって工夫したポイントとか苦労とかあったのかなみたいなところをお伺いしていきたいなと。ちょっとまずはTrevorかな。
Trevor Todayをはじめるにあたって、大きくこれ（技術）を取り入れていこうっていうものが大きく二つ柱があって。ひとつがOpenAPI、もうひとつがSwiftUI。で基本的にOpenAPI側は僕が担当して、SwiftUIの設計とか実装はSionが担当してくれました。先に僕が担当したOpenAPIをさっと。
ふたつの革命！ OpenAPIとSwiftUI
Trevor 仕様書からコードを自動生成するっていう、その一連の流れを作るための仕様書の部分をOpenAPIって言います。バックエンドチームともいろいろ話してまず最初にあがったのが、バックエンドとクライアント側で、同時に開発を進めると実際のテスト用のデータとかサーバーが出来上がるまで、僕らクライアント側は画面しかつくれないよねって話になったんですよね。画面で自分たちで用意した適当なデータとかを入れて、それちょっとタイムラグ、バックエンドの開発とクライアントの開発でラグが生じるとお互いにリソースもったいないよねっていうことで。仕様書からコードを自動生成できる、OpenAPIっていうものをつくると、その仮のデータを返してくれるサーバーっていうのが簡単に立ち上げられる。まずはバックエンドチームとクライアントチームで、その仕様書部分の議論をして、この仕様書で行こうってなってなったらその仕様書さえ作ってしまえば、その仮のサーバーとかできてクライアント側はその仮のサーバーを参照しながら画面を作っていけるっていう技術になってます。
Steve 結構いそいでたんですよね。
Trevor そうですね、結構急ぎました。OpenAPIでコードを自動生成するっていう部分は、Android側とも使っていて、コードのベースがAndroidとiOSで違うんですよねTimeTreeは。お互い別々の言語で開発してるんですけど、その仕様書を基にそれぞれAndroid用のツールと、iOS用のツールを使えば、こちらのコードも自動生成ができる。開発がその仕様書の変更に合わせてコードが早くできるっていうのと、仕様書から生成してるからAndroidとiOS側でずれが生じないっていうのがすごい良かったですね。早いっていうのと、ミスが少ない。
Steve Todayの1ヶ月くらい前にリリースしたTocaly（トカリー）でもOpenAPIを使っているってStudが言っていて。
Trevor はい、そうですね。もともとTocalyでやってって、そのチームが知見を貯めてくれて。バックエンドのGregがTocayの知見を吸収してくれて、それをTimeTreeのTodayの開発チームに持ってきてくれた。仕様書まわりかはGregが中心になって進めてくれましたね。すごいホスピタリティにあふれてるバックエンド側のチームのおかげで。そもそもバックエンドチームの発言から始まったんですよね。タイムラグをなんとかしたいよね。クライアント側がもっと開発しやすいようにしたいよねっていう話を持ってきてくれて。そこから始まったっていうことなんで。結果的に開発スピードも上がったと思うしミスも少なくなったのですごい感謝してます。
Sion こっちから提案したわけじゃないので、こういうことができるっていうことすら知らずにいたんですけど。バックエンドチームに提案してもらって、モックサーバーでバックエンドができる前から開発が進められるんで、さらにそこからコードを生成してクライアント側のコードまで生成できるっていうところまでわかって。やってみたらすごい効率化されてめちゃくちゃ良かったっていう。
Steve 2人からしたら、革命的な変化なんですね。
Sion そうですね革命ですね！
Trevor もともとOpenAPIっていうものはフワッと、なんかこの言い方がちょっと正しいかどうかわかんないですけど、「キテる」というか、アツい技術だったんで、こういうことができるよみたいなものはなんとなく小耳に挟んだことはあったんですけど。実際にそれが実戦でやれてよかったですね。
Steve もうひとつ、SwiftUI。主にSionが開発を進めたんですね。
Sion これももうひとつの革命的な技術なんですけど、Appleが最近出したアプリの作り方を革命的に変えるもの。それをAppleが出してきて。今後多分、徐々にiOSアプリ開発はそのSwiftUIを使ったものがどんどん増えてくると思うんですけど。ただその新しい技術って、新しいOSでしか使えなかったりするので。なかなかすぐには導入できないんですけど、今回Today開発のタイミングで、ちょうどiOS13以下をサポート終了して、今後はiOS14以降で開発していける状態になったんですね。なのでその新しいものが導入しやすくなって、このタイミングでぜひSwiftUIを試してみようということで、今回導入したっていう感じです。
Steve それはTimeTree的に言うと「機運が熟した」ってやつですね。
Sion, Trevor そうですそうです（笑）。
Steve そうなんだ。いろいろタイミングが良かったんですね。
Sion SwiftUIはやっぱりまだ新しい技術なので、なかなかフルに使うっていうのは難しい状況で。その古いやり方でUIkitっていう、昔からあるアプリの作り方なんですけど。それとハイブリッドで使うみたいなやり方があるんですよ。なのでベースはUIkitのView Controllersを使って、表示するカード1枚1枚の中身をSwiftUIで作るみたいな感じに今はなっています。
Trevor 確かSionがそのハイブリッドでやる方法をQiitaに投稿してましたよね。なんていうタイトルでたっけ。
Sion 『モダンCollectionViewとSwiftUIのハイブリッドを実現する』ってタイトルでQiitaの記事を。
モダンCollectionViewとSwiftUIのハイブリッドを実現する
Trevor 打ち合わせしてないのにいい感じに記事の広告ができました（笑）。
Steve さっきSionがまだまだ世の中に少ないって話してたんですけど。参考にしていたサービスとかあるんですか？
Sion そうですね。これを導入するにあたっていろいろ事例を調べようと思って見つけたのが、クックパッドさんの導入事例で。その同じようにやっぱりベースはUIkitなんだけど、既存のアプリにSwiftUIをどうやって入れていくかみたいなところが、実例とともに書かれていたのですごく参考にさせてもらいました。
Steve じゃあクックパッドさんも、今までずっと作り続けてきたアプリの一部分にSwiftUIって新しい技術を取り入れたっていう。まさにうちと同じ状況ということだったそうですね。クックパッドさんありがとうございます感じですね。導入にあたって2人から見て、難しかったポイントでありました？
新技術導入で苦労したこと
Trevor 自分はあれですね。SwiftUIのいちばんの利点だと個人的に考えているのがプレビュー機能っていうやつで。今までの開発って、一度画面を作ったら、アプリをビルドして、シュミレーターで確かめてっていうのを変更のたんびにやらなきゃいけなかったんですけど。SwiftUIにするとその画面1枚1枚ごとに見れるんですよね状況を。作りながらそのどういう状態で、実際にアプリにしたときに見えるのかっていうのがわかる機能なんですけど。最初は普通に本体アプリで、それを取り入れようと思ったらまあ出てこない出てこない。プレビュー表示しますってボタン押しても、出てこないんですよ全然。そこを見えるようにする、見えるようになったとしても見えるまでがめちゃめちゃ時間が長いっていうのがあって。その時間をどうやって短縮するのかっていうのがすごい困ったポイントだし工夫したポイントでした。
Steve エンジニアならではのエピソード。僕ら非エンジニアからするとKeynote叩けばもうすぐ文字打てるしね。何も困らずにプレビューできるんですけど、やっぱそこは結構大変なんだ。
Trevor Keynoteでアニメーションの確認とかは、やっぱりページで再生ボタン押してやらなきゃいけないじゃないすか。再生ボタン押しても、全然はじまらないイメージです。
Steve Sionはなにかありました？
Sion SwiftUIはすごく便利で、素早く画面の開発ができるっていうのが売りなんですけど。やっぱりこうなれないとなかなかこれやるのをどうやるんだっけっていちいちググりながらやるっていう、そう、最初はやっぱりその、学習の壁がやっぱりあって。ただちょっとずつ慣れていくに従って早くできるようになって、Todayってモジュールがたくさんあるじゃないすか。なので、最初にやってた天気とかはすごい時間かかってたんだけど、コロナモジュールのところとかはさくっとできて。
Steve もう占いとかは目をつぶっても開発できるぐらい。
Sion そうですね、もう瞬殺（笑）。
Trevor （笑）。でもSionが瞬殺って言ってるんですけど、本当に書きやすいし（コードを）書く量も多分減ったと思うんですよね。
Sion 僕は個人的に今までのAutoLayoutってやり方は嫌いじゃなかったんですよ。けっこうエンジニアから嫌われてるんですけど（笑）。AutoLayoutってすごいレイアウトを論理的に記述しようと思ったら、一番正しいやり方だなと思って。だからこう思想的にはすごくいいものだと思うんですけど、やっぱりこうなんだろうな、開発手法としてすごい難点かいくつもあって。特にそれこそKeynoteみたいに部品を並べて、ここからここは何ピクセルみたいなレイアウトを定義していくんですけど。それを作る人はいいんですけど、誰かが作ったものを見たりするときに、何がどうなってるかわからないって辛みがあって。
Steve チームでみんなで開発しようってときに意外と難点があったってことなんですね
Sion SwiftUIは全部コードで文字で書かれているので、コードレビューもしやすいし、コードとその見た目、プレビューを並べてすぐに見れるっていうところも便利なところですね。
Steve 例えばふたりの間とか、他のiOSのメンバー同士でSwiftUIのナレッジを共有するのってどうやってやったんですか？
Sion なんかや特別はやってないかな。
Steve 毎日の朝会とかで共有したり。
Trevor 特別な発見があったときとか、その開発にこれ便利だったよみたいなものはよく共有するんですけど。普通に書くコードの部分に関しては、Todayじゃない部分を開発している人、つまり今までのUIキットっていうもので開発しているチームも人たちも、普通にToday用のコードをレビューしくれてたんですね。なので開発中にSwiftUIで作った部分をお互いに見て「なるほど」ってわからないところがあれば調べて。なんかそういう感じに知見は共有されていったのかなっていう気はしてます。
今後チャレンジしたいこと
Steve 今後、Today以外のところでもSwiftUIがどんどん拡大していくとは思うんですけど、野望とか展望ありますか。
Trevor 実はもう既にTimeTree本題側でもSwiftUIっていうのが使われはじめているんですよ。プレビューが出ない問題を対処したときに、画面の開発部分だけコードを切り出して、そこだけで動くようにしようっていう。ざっくりとその方法でプレビューが結構早く動くようになったんですね。UI用のフレームワークを作って、そこターゲットにしてそこだけをプレビュー時にビルドするようにしたっていう。最初その範囲Iだけを集めたがTodayに限定されてたんですけど、その後「いやこれもうTimeTreeでも使っていこうよ」っていうことで、範囲を広げたんですよね。TimeTreeのSwiftUIを使ってる部分のビューもどんどん集約されてきて、最終的には個人的にはほぼSwiftUIで構成されるようになると今後も素早く開発できるようになるかなって思ってます。
Sion インパクト的には、まさにObjective-CからSwiftへの置き換えみたいなところが、またこの波が来たのか……という。
Steve Sionの人生はもうAppleをともに歩んでますからね。
Sion そうですね、もうそういう大革命みたいなのがちょいちょい起こるんですよね。Swiftほどの天変地異はなかなかないですけど（笑）。
Steve Sionがいるとやっぱり頼もしいですね。
Trevor だいたいSionの勘はあたるので。秘密主義じゃないですかAppleって。「いつ公開されるのかな？」って情報が結構あるんですけど、Sionが「だいたいこの日に来るだろう」っていうのが毎度当たっているので（笑）。その経験則強いなっていうのをそういうときに感じてますね。
Steve 今後結構大きめのアップデートがiOSにあるとすると、iOS 15ですね。Sionに最後そのiOS15がいつリリースされるのかを予想してもらって、この放送を終えましょうか（笑）。
Trevor ハードル上げすぎた（笑）。
Sion 調べておけばよかったなあ……。そろそろ、9月中に発表があると思います。Appleが毎年新しいOSを発表するイベントをやるんですけど、そこからちょっと開いて、新しいOSが出るっていうのが例年の流れなんですけど。去年の経験からいくと、もうおそらく明日出ますっていう発表が。
Trevor あれはやばかったですね！
Steve ってことは次のあのイベントは9月中旬頃ですよね。
Sion そうですね。だからもう本当すぐだと思います。
Trevor 新しいOSが出てDay1から（TimeTreeが）ちゃんと動くようにずっとしてきたので、iOS 15も頑張って対応したいなと思ってます。明日ですって言われたら、まあ笑っちゃいますけど（笑）。
関連トーク
TimeTreeラヂオ 📻
TimeTreeを運営する私たちメンバーが、ふだんの仕事に関係することも、そうでないことも、だいたい15分でひとつのテーマを話しきるインターネットラジオ番組です。 過去の配信はこちらから聴けます 今後も定期的に放送を配信してきますのでぜひ試聴ください！ ご意見・ご感想・話してほしいテーマなどぜひTwitterハッシュタグ #TimeTreeラヂオ でお待ちしてます。