Flutterの最新情報をキャッチアップしたい！
そんなあなたに送る、Flutterニュース。
本記事ではFlutterニュースとして、2022年3月第2週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行います。
読むだけでFlutterの最新情報がキャッチアップできます。 ぜひ読んでみてください！
- Flutter公式情報
- Flutterに関する話題
- Flutterに関する記事
- Flutterでのstreamとfutureの違いって？
- Dart/Flutterで一番早いローカルデータベースパッケージは何？
- 一年間更新しなかった後のFlutterの話
- Flutter Riverpod 情報：FutureBuilderやStreamBuilderより、RiverpodのAsyncValueを使おう！
- Flutter と Websocketsを使ったリアルタイムデータ受信、送信の実装方法
- Flutter Does That – An Overview of Flutter Widgets (A Series)
- Almost Netflix: Flutter + Appwriteで Netflixのクローンを作ろう
- Flutter package の作り方とPub devへの公開の仕方
- FlutterレアWidgets選
- Flutterに関する動画
- Flutter大学の動画
- Flutter大学メンバーによる記事
- 週刊Flutter大学の記事
- まとめ
- 編集後記（2022/3/14）
Flutter公式情報
FlutterPuzzleHack 締切迫る
1月より開催されていたFlutterのアプリコンテスト、
FlutterPuzzleHackの締切が間近となりました。
締切は【日本時間 3/15 7:00 AMまで 】となっています。
公開投票も3月から行われるようです。
Flutterに関する話題
Appwrite v0.13 リリース
Firebaseの代替手段としてのオープンソースのプロジェクト、
Appwriteの v0.13がリリースされました。
FlutterのSDKも用意されており、今後外部データベースの選択肢となるかもしれません。
アニメーション付きのListViewやGrid View を実装できるパッケージ、shaky_animated_listview
アニメーション付きのListViewやGrid View を実装できるパッケージ、
shaky_animated_listviewが話題となりました。
パッケージページにgif画像付きでアニメーションが紹介されています。
Flutterに関する記事
Flutterでのstreamとfutureの違いって？
Stream と Future について、違いは何かを解説した記事です。
Stream と Future それぞれの解説も載っています。
この記事を参考にして週刊Flutter大学でも以下の記事を書いています。
合わせてご確認ください。
Dart/Flutterで一番早いローカルデータベースパッケージは何？
Flutterのlocal Database として何を使うのが良いのか？という記事です。
この記事では性能の良いパッケージとして、主にObjectBoxの紹介がされています。
簡単な使い方から、データのブラウザでの可視化についてまで解説されていました。
一年間更新しなかった後のFlutterの話
要約すると、
「約一年間放置したFlutterのプロジェクトをアップデートしたけど、
とても楽にアップデートできた」
という記事です。
null safety だったりパッケージのアップデートに対応した様子が体験談として綴られています。
Flutter Riverpod 情報：FutureBuilderやStreamBuilderより、RiverpodのAsyncValueを使おう！
FutureBuilder や StreamBilderを使うより、
Riverpod の AsyncValue使った方が良い、
という記事です。
AsyncValueではerror や loading などの状態を、
明示的にコントロールできるのが強みです。
コードの比較画像もあり、わかりやすく解説されています。
Flutter と Websocketsを使ったリアルタイムデータ受信、送信の実装方法
Flutter と Websocketsを使ってリアルタイムデータ通信を実装しよう、という記事です。
サーバーにデータを投げ、サーバーのデータ状況を取得し、表示する、
という実装方法を紹介しています。
ダミーサーバーも紹介されており、
簡単に実装の練習ができます。
Flutter Does That – An Overview of Flutter Widgets (A Series)
Redit上でFlutter の Widgetについて解説したスレッドです。
Stateful Widget と Stateless Widgetについて、
要点まとめて説明されています。
Almost Netflix: Flutter + Appwriteで Netflixのクローンを作ろう
FlutterとオープンソースのバックエンドサービスのAppwriteを使って、
Netflixアプリのクローンを作ろう！という記事です。
状態管理手法としてProviderが使われていたり、
shared_preferenceやadaptive_dialogが使用されていたりと、
かなり勉強になります。
GitHubのソースコードも公開されています。
Flutter package の作り方とPub devへの公開の仕方
Flutterのパッケージの作り方、リリースの仕方について解説された記事です。
パッケージでアプリを細分化したい、パッケージを作りたい、
そんな時に有用な記事かと思います。
FlutterレアWidgets選
約3年間Flutterを触ってきた人の目線で、
ちょっとレアなWidgetをたくさん紹介している記事です。
codepenで使い方が書かれており、
記事中で実際に触って見ることができます。
Flutterに関する動画
Flutter RichText and TextSpan | Powerful Widgets
RichText と TextSpanの使い方についての解説動画です。
サブタイトル付きのタイトルなど、
ちょっと凝ったテキストを簡単に
2分くらいで、サクッと使い方を学ぶことができます。
Native + Animated Splash Screen | Flutter Tutorial [2022]
flutter_native_splashを使ったスプラッシュスクリーンの
ダークモード対応の方法と、
アニメーション付きのスプラッシュスクリーンの
実装方法についての解説動画です。
概要欄からソースコードを見ることが可能です。
Animation for Page Loading or Network Request Flutter
flutter_spinkitを使っておしゃれなローディング画面を作成しよう、という解説動画です。
シミュレータで実装例を示していて、
動画でそれぞれのアニメーションがわかりやすく解説されています。
Flutter大学の動画
2022年最新【初心者向け超入門】M1 MacでFlutterの環境構築
2022年最新版の、M1 MacでのFlutter環境構築の仕方についての解説動画が追加されました。
M1 Macでは一部追加の対応が必要となります。
そこも含めて、全体の流れをわかりやすく解説しています。
これからFlutterを始める方にはかなり助かる動画となっています。
ぜひご覧ください！
Flutter大学メンバーによる記事
今週Flutter大学メンバーが書いたFlutter関連の記事を紹介します。
【Flutter】Looking up a deactivated widget’s ancestor〜をBuilderで解決した
AlertDialogを使用した際のエラーの解消方法についての記事です。
発生状況から、発生事象、解消方法、なぜ解消したのかの考察と、
丁寧に解説されています。
【Flutter】Serverpodをちょっとだけ触ってみた
先週話題となったServerpodを早速使ってみて解説した記事です。
導入の方法から最初の実行まで、スクリーンショット付きで詳細に解説されています。
【Flutter】CodemagicでAndroidのbuildに失敗するので対応した
google-services.jsonをGitHubに公開していないがために起こる、
Codemagicのビルドエラーに対する対処法の記事です。
CI/CDではよく起こる事象かと思いますが、
スクリーンショット付きで丁寧に対処法について解説されています。
Flexible と Expanded って何が違うんだっけ？
同じように思えるFlexibleとExpanded、
実際のところ何が違うのかについて解説した記事です。
触って確かめられるサンプルコード付きで詳しく解説されています。
【入門】FlutterでDeepLinkを実装してみよう。
WebサイトでTwitterのリンクを触ると、Twitterのアプリが開く、
そんなリンクをDeepLinkと言います。
このDeepLinkをFlutterにて実装するにはどうすればいいか、という解説記事です。
この記事の内容について、
3/16 (水) 21:00 にFlutter 大学内で行われる共同勉強会にて
筆者のまつまるさんが解説されます。
勉強会の参加、アーカイブ動画の閲覧はFlutter大学メンバーのみ可能となっています。
Flutter大学への入会は以下リンクから。
Dart Data Classって最強♡
データクラスとして持っていると便利なCopyWithなどのメソッドを、
コマンド一つで実装してくれるAndroid Studio のプラグイン、
Dart Data Classについて解説した記事です。
導入方法から使い方まで、簡潔にわかりやすく解説されています。
週刊Flutter大学の記事
週刊Flutter大学で先週アップロードした記事を紹介します。
まとめ
本記事ではFlutterニュースとして、2022年3月第2週に話題になったFlutter関連の情報や、
アップされた記事、YouTube動画の紹介を行いました。
この記事が、みなさんのFlutterアプリ開発の一助となれば幸いです。
Flutterを一緒に学んでみませんか？
Flutter エンジニアに特化した学習コミュニティ、Flutter大学への入会は、
以下の画像リンクから。
編集後記（2022/3/14）
先週話題になったこととして、
「宣言的UIでMVVMを使うのは良いか？」
という話がありました。
同じく宣言的UIであるFlutterだとどうなのか、簡単に話そうと思います。
（あくまで個人の見解です。）
この話は、Stateful Widgetで書けば簡単に書けるものを、
何でもかんでもStateless Widget + 状態管理手法で書くのって、
本当に「良い」んだっけ、ということだと思っています。
宣言的 UI では、 UI = f(state)と書かれるように、
状態に応じてView（UI）を表現します。
View が 状態を持っている、Stateful Widgetのイメージです。
一方でMVVMでは状態をViewModelが持っていて、
状態の変化をViewに伝える、というアーキテクチャだと理解しています。
宣言的UIをMVVMで書く、ということは、
Viewが状態として持っていたものをわざわざ分けて、ViewModelに持たせる、ということです。
flutterでいうと、状態に応じてUIを変えるStateful Widgetで書かれたコードを、
Stateless Widget + 状態に分けて書く、ということだと思っています。
もちろん、状態を分けて書くメリットもあるので、
どちらが良いとは言えないと思いますが、
個人的には画面内で完結する状態
(カウンターアプリの_counterとか、スイッチオンオフのフラグとか)
がある場合は無理に分けず、StatefulWidgetで書く方が好きです。
あなたはどう思いますか？
私のTwitter 等であなたの意見を聞かせてもらえると嬉しいです。
面白い議題だと思うので、ぜひ考えてみてください。
