研修でTwitter likeなAndroidアプリを開発した

はじめに

この記事で伝えることではないのですが、この度サイバーエージェントに入社することになりました！！！

サイバーエージェントで楽しくAndroidアプリ開発をすることになりました！！！(わいわい!!

そんな大事な報告をこの記事の最初にぶっこんでいくスタイルですが、気にしないでください...。ご縁がありましたら、あ！Androidマンになりたいおじさんの人だ！って声掛けてください(土下座

今回の記事は、4月の技術研修(15営業日)でTwitterクローン(* TwitterAPIを使ってではなく、インフラやAPIも自分たちで！です)を自分たちで一から作りましょう！ってことになり、自分はAndroidアプリを担当したので、その時の考えとか思ったことを書きなぐります

出来上がり

まんまTwitterっぽいですね

仕様

最低仕様

• ユーザー登録
• 投稿
• 投稿参照
• いいね and RT
• フォロー/フォロワー機能

追加で出来たこと

• プロフィール編集(アイコン, ヘッダーのイメージ変更etc.)
• パプリックタイムライン

設計

以下のGoogle 公式を参考にAAC + MVVMでやってみました Guide to app architecture  |  Android Developers

AAC + MVVM

使用した技術

使用技術は触ってみたいベースでえらびました 技術の詳細はこの記事で触れずに個別に書いていけたらいいなと思ってますん

• ViewModel
• LiveData
• Room
• Navigation
• DataBinding
• Epoxy
• Koin
• Lottie
• Firebase
• Picasso
• Moshi
• OkHttp
• Retrofit
• DeployGate

進め方

僕ともう一人メンバーがいたので、スプレッドシートでタスクを洗い出して、ガントチャートで進捗管理してました。 サーバサイド側のレスポンスが返ってくるまで、各画面の大まかなレイアウトや遷移を済ませたかったので、初めにペーパープロトタイピングしてから、画面のレイアウトを実装していきました。ペーパープロトタイピングは変にソフトやツール使うより、サクッとできるので良いと思ってます！

後は各々、Githubでdevelopベースでbranchを切って、PR飛ばして開発していくというフローでやりました。

学べたこと

全部です！全部ってざっくりしすぎーって思いますが、割と大きめのAndroidアプリを設計してチームで進めていくってのが新鮮で初めてだったので、いい体験になりました！ AACはサンプルでしか、触ったことなかったので実践で使えたのが大きかったです...

DIは実はAndroidでは使ったことなかったのですが、Koin最高ー！！使いやすいー！ってなってました 後日聞いた話で、Dagger使ってからのKoinは素直で嬉しいとのことです

じゃあ逆に、KoinからのDaggerは？

身体中から血が吹き出しそうになるらしい

後は、EpoxyといったRecyclerViewをいい感じにしてくれるライブラリも初めてだったので、すげええええええってなりました

辛かったこと

Layoutの細かい点

TwitterのTweetListItemのレイアウトで例を挙げるんですけど、Gifのようにuser_id(右)をuser_name(左)と連動させて、user_nameを短い時と長い時でいい感じにしたくて、user_id(右)が右にぶつかったらellipsizeを効かせたい...!!

これ昔では、どうやったらいいんだろー的な案件でしたがConstraintLayoutが有能過ぎて実現できましたね！！！

android:layout_width="0dp"
android:lines="1"
android:ellipsize="end"
app:layout_constraintWidth_default="wrap"

これだけでいけました！(wow

app:layout_constraintWidth_default="wrap"

こいつのおかげで文字数が多い時に２行以上に折り返してくれるみたいですが、lines=1にしてるから折返しのタイミングでelipsizeが発動するというわけですな

これは色んなとこで使えそう！

Epoxyのドキュメント優しくない

え？？？ なんでなんで？？？皆、これで理解できるんですか？？？ これでやりたいことわかるんですか？？？ってなってました Sampleでやってるから雰囲気で分かってくれやみたいなノリを感じました...Epoxyともっと仲良くなりたいです

Navigation

これまじですごいし、便利やなーーーー！！ってなりました

AACの画面遷移をいい感じにしてくれるライブラリです

FragmentTransactionとか一切書いてないし、ActivityもMainActivityだけで済んだし、最高ーーー！！

って思ってた時期もありました。ええ

何が辛かったって、ドキュメントの隅々まで目を通してなかったのが悪かったんですけど、NavigationってdefaultNavHost=trueってするとbackStackとか遷移した画面のStackまで色々やってくれて戻るとかしたりできるんですよよよよ けど、特定のFragmentでUpButton(Arrow)を消したい！！！！消せないクソ！！！！！！！ってなってました

val appBarConfiguration = AppBarConfiguration(setOf(
            R.id.homeFragment,
            R.id.signUpFragment,
            R.id.splashFragment,
            R.id.publicFragment,
            R.id.profileFragment
        ))

AppBarConfigurationにSetでUpButton消したいlayoutのid指定だけで行けました....

しかも普通にNavigaitonのDocumentに書いてました...うすうす

皆も新しい技術触れるときはちゃんと隅々まで読もうな！！！！

最後に

いやほんとに15営でTwitterとかできんのか〜〜〜？？？ってなってましたけど、案外できます

分からんことだらけで当たり前ですが、やってみると辛いこともあるけど、乗り越えたら意外とできるのでは〜〜？？ってなります

Android勉強してる人で、作りたいアプリないけどって悩んでる人は一度自分のお世話になってるアプリとかの真似とか作ってみたらどうでしょうか？

そこから、自分だけのオリジナル機能とか実装してみたりするとおもしろそうですね

今回の技術研修の目的は「同期理解」ということでした。 開発を通して、お互いのことを深く知っていくって素敵じゃないですか？？？ 今でもその時のチームメンバーでご飯行ったりしてるので、同期は宝だと思いますので、これからも大事にしていきたいですね！！！！！

このような研修を用意してくださった、会社には感謝しています！ありがとうございます！

でわでわ、お疲れ様でした(ぺこぺこ