7
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ぅゅ...ぷんぽぷんぽAdvent Calendar 2022

Day 1

フロントエンドエンジニアが Flutter に入門した話

Last updated at Posted at 2022-11-30

はじめに

フロントエンドエンジニアの私が業務で Flutter を使用するまでに学んだことを紹介します。
ご参考になれば幸いです。

チュートリアル

まず初めに公式サイトのチュートリアルである、 Write your first Flutter app, part 1 を行いました。また、続きの Write Your First Flutter App, part 2 も行いました。
これらで StatelessWidget や StatefulWidget 、 Navigator について学べます。
とりあえず動くものを作りたいという方にはおすすめです。

文法

次に Dart の文法について学びました。公式ドキュメントの A tour of the Dart language を読みました。 Dart はクラスベースの言語ですが、 JavaScript はプロトタイプベースの言語のため、慣れるまでかなり苦戦しました。
また、普段 React を使用していることもあり、関数コンポーネントの記述に慣れてしまっているため、改めてオブジェクト指向についても学び直しました。

ライフサイクル

Flutter の描画の仕組みを理解するFlutterアプリのライフサイクルFlutter StatefulWidgetのライフサイクル を読みました。ライフサイクルを理解することでより Flutter のことを知れたと思います。

Flutter Hooks

Flutter Hooks は Flutter で React Hooks のように記述できるライブラリになります。導入することで useStateuseEffectuseCallback などのフックを使用することができます。
Flutter Hooks の詳細に関しては別途記事を記載しようと思います。

Riverpod

Riverpod は状態管理ライブラリで、 Recoil とよく似た設計となっています。他にも provider という状態管理ライブラリも触ってみましたが、 Riverpod の方が個人的にはかなり使いやすかったです。
Riverpod も詳細に関しては別途記事を記載しようと思います。

API通信

有名なライブラリとして httpdio があります。 http vs dio を拝見し、 シンプルに書けることから http を触りました。 dio は大規模な開発には向いているとは思いますが個人開発レベルでは不要かなと思います。

永続化

データの永続化を行うために Shared Preferences を使用しました。その他にも、 SQLite プラグインである sqflite を使用したり、 Firebase を使用する方法もあります。

その他

その他、イミュータブルなクラスを扱うための freezed 、 ルーティングライブラリである go_router を学びました。また、それらを自動生成するための build_runner についても学びました。

ライブラリ以外では、 Flutter Widget of the Week を見たり WINTICKET が考えたモダンな Flutter アプリ設計を完全解説 を読みました。
Flutter Widget of the Week 以外にも公式から動画が出ているので、動画を見ながらの学習も多くなりました。今まで動画で学習する機会が少なかったので新鮮でした。
また、 roadmap.shFlutter Developer 用のロードマップが載っています。今後ひとつずつ調べていくつもりです。

おわりに

新しい言語を久しぶりに学び、楽しかったです。また、先輩から教えてもらえる環境が整っており、効率よく学ぶことができました。
今後の目標は個人開発でアプリをストアに公開することなので、今後も楽しみながら Flutter での開発を続けたいです。

7
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?