【Flutter新規参入者向け】ざっくり流行りや動向まとめ
本投稿はFlutter Advent Calendar 2024の14日目の記事です🎄
どうも！okeです！
Flutterを5年くらい使ってきたのですが、
最近ReactNativeに浮気を始めています。※まだFlutterと別れる気はありません！
ただ、情報をキャッチアップしようにもいろんな情報がありすぎて、
「今は何が主流なの！？」「最新の情報はどれ！？」とわからなくなり、
あれもこれも調べて混乱しています。
そのためReactNativeを始める時に知りたかったような内容を書いておけば、
Flutterに新規参入してきた方がキャッチアップしやすいのではと思い、
2024/12現在のFlutterの流行りや動向を、自分の知っている範囲でざっとまとめます。
（自分の近辺の話が主ですが役立つ部分もあるかと思い投稿します！
違う部分などあれば優しくコメントをぜひお願いします…！）
状態管理パッケージについて
調べたらいろんな状態管理パッケージが出てくるかと思います。
プロジェクトごとで採用しているものは異なり「絶対コレ！」というものはないかなと思うのですが、
身の回りで多く使用されているパッケージをピックアップしてみます。
Riverpod
日本ではRiverpodがかなり流行っています。
もし日本での転職等を考えているのであればこちらを使用すると良さそうに思います。
活発に開発やコミュニティが動いており、v3のstableリリースも期待されています。
後で記載するProviderと同じ作者(Remiさん)のパッケージです。
Riverpod: https://riverpod.dev/ja/
Bloc
海外ではBlocを使用しているという話をよく聞きます。
以前北米のエンジニアとのプロダクトでも実際に使用していました。
Bloc: https://bloclibrary.dev/
Provider
Flutter公式ではProviderが紹介されています。（参考）
最近関わるプロダクトでは使われていないものの、「公式が使ってるんだから！」という安心感もあるので選択しても良さそうに思います。
また、後で出てくるFlutter公式のアーキテクチャを使用する場合もこちらを採用することになりそうです。
アーキテクチャについて
Flutterの仕組みの話ではなく、
アプリを作成する上でのアーキテクチャ（設計手法）についてです。
他のフレームワークや言語同様、「このパターンが確実！」みたいなものはなく、
それぞれのプロダクトに沿ってフィットする形を選んでいる状態かなと思っています。
ただ、いくつかアーキテクチャを考える上で参考になりそうなサイトがあるので、記載します。
↓Riverpodアーキテクチャ（Riverpodを使用している場合は参考にすると良さそう）
↓Flutter公式（MVVMが採用されており、指針も示されているので迷ったらこちらで作成するというのもアリかなと思います。本当にMVVMかは賛否両論あるようですが、こだわりすぎずそのままの名称で作成で良いかなと思います）
ディレクトリ構造について
上記のアーキテクチャに関連するのですが、
ディレクトリ構造については大きくFeatureベース(機能単位で分ける)・Layerベース(アーキテクチャの層で分ける)があると思います。
下記のサイトを参考にしつつ検討すると良さそうです。
また、最近はmelosというパッケージを使用してモノレポ(複数のアプリやパッケージを単一のリポジトリで管理する手法)でコードを管理する例もちらほら見かけます。
※誤解している方が時々いるのですが、モノレポ自体はmelosがなくてもできます。ただ、使用した方が便利です。
また、直近でFlutter3.27が出て、pub workspaceにてパッケージの追加なしでモノレポ管理がしやすくなりました。
パッケージを適切な単位で分けて依存するものを指定することで、依存関係の整理ができたり、共通のコンポーネントや関数等を複数のパッケージ間でコードを共有できたりするので、人数が多めだったり大規模なコードな場合は使用するとかなり恩恵がありそうです。
↓モノレポの良記事・良コードの参考を載せておきます！
画面遷移手法について
いくつか手法があり、
Navigator 1.0を使用する方法(Navigator.pushなどで画面遷移)、
NamedRoute(/homeなどをパスと指定して画面遷移する方法)、
Navigator2.0や他のパッケージを使用している例も色々見かけると思います。
※NamedRouteはあまりおすすめされていないようです。
Webを採用するならNavigator2.0、
もしくはそれに対応したパッケージ(go_routerやauto_route)が必須で（ブラウザの進むボタンなどの対応のため）、
モバイルアプリだけならどれを採用しても問題はないかとは思います。
僕は普段モバイルアプリのみの開発をすることが多く、
Navigator1.0を使用しているプロダクトに関わることが多かったです。
ただ、Flutter公式アーキテクチャもgo_routerを使用していることから、次にアプリ作るならgo_routerかなぁと思っています。
使用しているIDEについて
VSCodeやAndroid Studio、JetBrainなどいろいろありますが、
周りの人のほとんどはVSCodeを使用していると思います。
（僕もずっとVSCodeです。というか最近はCursorです）
大きく差異があり「絶対これ！」という感じではないかな？という印象ではあること、
またプロジェクトごとで共通の設定をしているところがあると思うので、
チームの方と相談して合わせたり自分の好みで良いのかなとは思います！
Flutterでのお仕事状況について
自分はフリーランスなので、
その中での案件の状況を軽くお伝えすると下記のような感じです。
- 新規開発でFlutterを採用している・これから採用しようとしている企業はおり、案件としてもちゃんと出回っている。
- 現在は少なくとも「食に困るほど案件が出回らない！」という状態ではない。
- 経験年数の長い人が少ないので、数年やっていると割と重宝される。
- 週3日以上の条件だとそこそこあるが、逆に週2日以下の案件はほぼ見つからない。
- ただ、ネイティブ側（Swift/Kotlin）の案件と比べると数は少ない。
- Swift/KotlinからFlutterに移行しようとする企業は「ちらほら見かけるかな？」程度
最近のFlutter界隈の話題
FlutterKaigi 2024
Flutterの国内最大級のイベントかと思っています。
2日間に渡って開催され、YouTubeに動画が上がっているのでぜひ見ていただければと思います。
直近のFlutterの話題が掴めるのではないかと思います。
（また、僕はXから情報収集することも多いのですが、FlutterKaigiのHP下に載っている方々をフォローしておくとこれからの情報収集が捗りそうな気もします…！）
FlutterKaigi 2024 HP: https://2024.flutterkaigi.jp/
Day1 A Dash: https://www.youtube.com/watch?v=QQqW67kDqxs
Day1 B Dash: https://www.youtube.com/watch?v=Guljzr9a3jg
Day2 A Dash: https://www.youtube.com/watch?v=CE0NTGJLbS8
Day2 B Dash: https://www.youtube.com/watch?v=zqDJPyHSFV8
Flutter 3.27
Flutter3.27がstableリリースされました！
毎回主要なリリースごとで「What'ｓ in new Flutter」という記事が出るのでチェックをおすすめします。
色々アップデートされているのですが、
先ほど紹介したpub workspaceや、
長年Widgetを並べる際にColumnやRowにてSizedBoxを使用して隙間の調整をしていたのがspacingを指定するだけで隙間調整が可能になったことが個人的に嬉しかったです。
今後のアップデートも楽しみですね！！
Flockについて
最近Flockという「Flutterをフォークして、もっとみんなの要望取り入れたFlutterを目指しまっせ」みたいなサービスが出たのですが、
「公式のリポジトリはもうユーザーを支えきれないの？Flutter大丈夫？」みたいな意見を見かけます。
個人的には、「Flutterに貢献したいという思いが逆に不安を煽ってしまった」という状態な気がしており、特に落ち目になったとは捉えていません。
（ポジショントークで「Flutterはもうダメだ」という方がいますが、現状そこまで気にしていません）
Flutterチームの人数が開発者に対して足りていないのではという指摘は確かにと思いつつ、同時に開発者が増えてきているということもあります。
Flutterはオープンソースでissue/PRを受け付けているので、慣れてきたらFlutterのコミュニティにぜひ貢献して、盛り上げていきましょう！
Flockについて詳しくは下記の記事がとてもわかりやすかったです！
ReactNativeについて
「ReactNativeが最近使いやすい！」という意見をちらほら聞きます。
個人的には、Web界隈から来た方・TypeScriptに慣れていたりバックエンド等も組んでいる方はReactNativeの方が良さそうと思います。
ただ、「FlutterダメだからReactNativeに乗り換えよう！」という気持ちはありません。
まだ触り始めたばかりですが、
ReactNativeでUIを組むのに「どういうUIフレームワークを使うのが良いんだろう？」というところから探し始め混乱していたのですが、
Flutterでは標準でMaterialDesignを活用でき「脳死でいい感じのUIを速攻で組める仕組み」が整っているので作っていて楽しいです。
また、ReactNativeのOTAアップデート（ストア審査を通さずにアプリをアップデートする仕組み）がとても魅力的だなと思っていたのですが、
FlutterにもShorebirdという同じ仕組みのものがありました。
（Flutterがフォークされているみたいです。無料プランもあるので個人開発規模にはもってこいです！）
あとは、Flutterで学んできたこと（状態管理やアーキテクチャ、コンポーネント分割など）はかなり活かせるなぁとも思いました。
特にRiverpod/Hooksと似た書き方での状態管理は、はじめから「理解できるぞ…」という感じでした。
（元々Reactの世界から来たものなので流れとしては逆ですが）
「ReactNativeが良い！」「いやいやFlutterの方が！！」みたいな話で混乱するより、
どちらかを学べばどちらにも活かせる知見はあると思っているので、
深く考えすぎて前に進めないロボットにはならないようにしましょう！
おわりに
Qiitaのアドベントカレンダーに投稿してみたくてざっと書いてしまいました！
（最近はzennを使っていたのでzennで投稿しちゃいました）
「ここ違うよ！」などありましたら優しくご指摘ください🙇♂️
1年が過ぎるのは早いですね…みなさま良いクリスマスを🎄
Discussion
Expoなら好きですねwww
まさかokeさんがやっていたとは。
コミュニティ新しく作りますね🌱
最近勉強してます。Reactの経験がある大学生にもおすすめしときました。