🎉

ゼロからFlutterを勉強するまとめ

2022/01/23に公開

はじめに

Flutterを使ったクロスプラットフォーム開発をしたくなってきたので、勉強の軌跡として残しておきます。無料でこんだけ学べるのはとてもいい時代ですね。

現在のレベル

2021年 2月〜
SwiftUIを用いたiOSネイティブアプリ開発 (リリース済み)
Jetpack Composeを用いたAndroidネイティブアプリ開発 (リリース済み)
AWS AmplifyおよびLambdaを用いたサーバーレスバックエンド構築(上記のアプリ用)

期間は重複しています。本業はエンジニアではないので、その辺はご了承ください。

1冊目

2022年 1月21日〜22日
Flutter実践入門 ~環境構築からAndroid/iOS/Webに広告を付けて同時にリリース!!~
まずはこれを片っ端から読みました。とんでもないボリュームなのに無料です。頭が上がらない。実装は少なめですが、Flutterの考え方や特有のポリシーなどを学べます。個人的には優良サイト集がとても良かったです。

2冊目

2022年 1月23日〜1月24日
Flutterで始めるアプリ開発
こちらは実装メインで、Firebaseを用いた認証やストレージなどを使用して、Todoアプリを作っていきます。
とても丁寧に解説されていてスラスラと進めることができました。後半になるといくつものサンプルアプリをスクラッチで作る課題があります。結構な分量があるので、かなり力がついた気がします。

ここまでで、app.dartに書き連ねて、Flutterを何となく動かせるところまでは習得できました。ここから、いよいよ本格的な実装に向けて取り組んでいきます。

3冊目

2022年1月25日
Flutterで新規アプリ作る時にやることまとめ

細かいけどいざ始めるにあたって重要そうなことがまとめられています。

flutter create --org com.example your_project_name

この--orgはcom.exampleのままだとリリースできないとのことなので結構なトラップのよう(本記事では未検証)。

4冊目

2022年 1月26日〜1月29日
Flutter を MVVM で実装する
MVVM+Repositoryパターンを採用したFlutterアプリを構築する

いざ作るかってなったときに、Flutterのフォルダ構成ってどんなのがいいのかなって迷ったので、こちらは非常に勉強になりました。これまでMVVMで作ってきた際に、ViewModelが肥大化していく現象に苛まれることが多々ありましたが、Repositoryの導入で解決できそうな気がします。
また、Flutterを扱う上でデファクトスタンダードになっていそうなライブラリの紹介もあるので、とても有益でした。

5冊目

2022年 1月30日〜1月31日
responsive_framework
上記のGithub
デモアプリ

とりあえずwebアプリを作りたいので、レスポンシブデザインが必須でした。何か良いライブラリがないかなと探していたときにこちらのライブラリを見つけました。
レスポンシブデザインが実装されているため、実践的なUI構築の練習になります。

その他理解を助けてくれたブログ

Flutterでアプリ開発・画面遷移を実装する | ギャップロ
2冊目を読んでいるときに、Navigator.of(context).push()と.pushReplacement()の違いが知りたくなり検索。とてもわかりやすい。

Riverpodの公式サンプル

Riverpodの更新により古くなっている部分がある。そこはRiverpodの公式サンプルを見ながら補填した。

StateNotifierを使ったFlutterのアプリ設計
ChangeNotifierとStateNotifierの違いが簡潔にまとまっている。

感想

Flutter Webいいですね。ライブラリが対応していないものがまだまだ多いので、2022年Flutter web元年になりそうな予感。

Discussion