78
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

posted at

updated at

Organization

Flutter でアプリ開発ができるようになるまでに勉強したこと・現在ウォッチしている情報一覧

はじめに

こんにちは!やまたつです!
去年の12月から Flutter の勉強を始めて今年の3月からFlutterでのアプリ開発を任されるようになりました。
その過程でどのような教材を使用したのか、どのように学んでいったのかをシェアして、Flutterをこれから学びたいと思っている方の手助けになれたら良いなと思ってこの記事を執筆しております!
また、現在 Flutter の技術をキャッチアップするために使用している記事なども紹介いたします。
最後の方に、実際に Flutter で開発をしてみての感想の記事を記載しています。

Flutter の案件を任されるようになるまでにやったこと

以下の手順で Flutter の案件を任されるようになりました!

  1. Udemy で Flutter に関する教材を見て、実際に手を動かしながらコードを書く
  2. 日本語記事で学ぶ
  3. Flutter でアプリ開発できることと、プロジェクトに Flutter を採用すると良いことをアピールして案件を獲得する

まずは Udemy でFlutterでどのようにアプリを作成するかと、最低限の知識を学びました。
次に、mono さんの日本語の記事(後ほどリンクを貼っています)で、理解を深めます。
最後に、 Flutter アプリの採用例や、技術的にどのようなことができてできないかを洗い出して、技術選定の際に Flutter を推していくことで Flutter の案件を任されるようになりました!

Flutter を採用する際に、参考にした記事は以下になります。

Udemy で購入した教材一覧

Screen Shot 2020-12-24 at 17.46.25.png

上記の8つの教材を購入しました。
購入して良かった順になっていて、どのようなところが参考になったかを書いていきます!

1. The Complete 2020 Flutter Development Bootcamp with Dart | Udemy

最も参考になった教材です。もし Flutter の Udemy 教材の購入を検討しているのなら、この教材で間違いないと思います!
この教材だけで初学者に必要なことは大体理解でき、Widget をどのように組むか、Dart言語の書き方、シンプルなアーキテクチャを学ぶことができます。
私は英語の聞き取りが苦手だったので、英語教材を購入するのを躊躇していましたが、講師の方がかなりゆっくりめに、はっきりと話してくれるので理解しやすいです。
また、IDE のショートカットも丁寧に教えてくれたり、Flutter開発での Tips を知ることもできます。
この教材を通して、簡単なUIなら組めるようになりました。

2. The Complete Flutter UI Masterclass | iOS, Android, & Web | Udemy

この教材では以下の画像のアプリを作成していきます。
凝ったUIをどのように作成するかを理解することができ、UIの勉強として最も有効な教材です!

Budget App Social Media App Food Delivery App
Screen Shot 2020-12-24 at 17.28.44.png Screen Shot 2020-12-24 at 17.28.31.png Screen Shot 2020-12-24 at 17.28.15.png

3. Flutter & Firebase: Build a Complete App for iOS & Android | Udemy

中級者向けです!
アーキテクチャは BLoC や ChangeNotifier を利用しています。BLoC と ChangeNotifier を使ったアーキテクチャの違いも学ぶことができます。
最初に見たときは少し難しかったのですが、見返すと整理されたコードで分かりやすかったです。
Firebase を使用しているので、Firebase の導入を検討している人にもおすすめです!

4. Flutter REST API Crash Course: Build a Coronavirus App | Udemy

API通信をするクラスをどのように作成するかや、API通信時のエラーハンドリングをどうするかを学ぶことができました!
より実践的な内容で、実務と同じレベルでコードが書かれていると思います。

5. Flutter + SQFLite | Build a Local Storage iOS & Android App | Udemy

SQFLite をどのように扱うかを学ぶことができました!
プロジェクトをダウンロードして、SQFLite を使った CRUD をそのまま自分のプロジェクトに入れることができるので便利です。

6. The Complete Dart Language Guide for Beginners and Beyond | Udemy

Dart 言語をより深く学ぶために購入しました。
高次関数だったり、Dart言語特有の書き方を学べます。

7. Flutter & Dart - The Complete Guide [2021 Edition] | Udemy

Provider を使ったアーキテクチャのために購入しました!
Provider の理解は深まりました。

8. Dart and Flutter: The Complete Developer's Guide | Udemy

BloC のアーキテクチャの勉強のために購入しました!
他の教材とほぼ一緒のような内容だったので、プロジェクトだけダウンロードしてさらっと見ただけです。

Youtube

Code With Andrea - YouTube

Udemy の教材でお馴染みの Andrea さんの Youtube です。
Udemy を購入前にお試しで見てみるのもありです。(Youtubeに全て公開されているかも?)
Slack コミュニティもあります。

FilledStacks - YouTube

記事も公開されているし、Slackコミュニティもあります。
分かりやすい記事が多いです。

Reso Coder - YouTube

記事も公開されているので、 Youtube と記事でより深く学ぶことができます。
中・上級者向けの内容もあります。

Marcus Ng - YouTube

一つのアプリを作っていく過程を見ることができるのでおすすめです!

記事

Flutter 🇯🇵 – Medium

monoさん が書いている記事です。
開発に役立つことが盛りだくさんです。読んだら claps!!!

以下の記事は必見です。

ntaoo – Medium

ntaooさんの記事です。
Flutter 公式のドキュメントやいろんな人の発信がまとまっています。
読んだら claps!!!

Flutter | 技術は熱いうちに打て!

ashdikさん が書いている記事です。
発信がまとまってたり、実際に ashdik さんが書いたコードなどが記載されていて参考にさせていただいております!

Mobile App Development Tutorials - FilledStacks

Youtube にもあった FilledStack さんの記事です!

Reso Coder - Flutter & Dart App Development Tutorials

同じく、 Youtube にもあった Reso Coder さんの記事です!

Twitter

Flutterリスト

Flutter の情報を発信している方を主にフォローしてリストにしています!
フォローしている方がいろんな情報を発信しているので、ここだけで新しい技術のキャッチアップができるかもしれません。

GitHub のリポジトリ

wasabeef/flutter-architecture-blueprints: Flutter Architecture Blueprints is a project that introduces MVVM architecture and project structure approaches to developing Flutter apps.

Provider を使って MVVM のアーキテクチャを実装するときにとても参考になります!

toly1994328/FlutterUnit: 【Flutter 集录指南 App】The unity of flutter, The unity of coder.

Flutterのコンポーネントを画像と動画付きで見ることができるプロジェクトです。
クローンして手元で動かすと勉強になるのではないでしょうか。
コンポーネントを覚えるのに良さそうで、どんなふうに実装するかなども分かります。
プライオリティ順に並んでいるのも良いです!

mono0926/flutter_playground

Provider の実装を確認することができます!
おすすめです。

Flutter をこれから学ぶ方の最短の学習ルート

自分が思う Flutter の最短の学習ルートです!
自分が今から学習するなら以下のようにやるかなと思っています!

  1. Flutterの効率良い学び方| by mono  を読む
  2. The Complete 2020 Flutter Development Bootcamp with Dart | Udemy を一通り学習する。コードも書く。
  3. Flutterでの開発をスムーズに行うためのTips集| by mono  を読んでFlutterでの開発を効率化する
  4. Flutter:Widget一覧 - Qiita でどんな widget があるかを知る
  5. Udemy や Youtube や記事で自分の目的に合ったアプリ開発を学ぶ or 実際に自分のプロダクトを作成する
  6. Flutter案件を獲得しにいく!

実際に Flutter でアプリ開発した感想

自分が Flutter でアプリ開発をして感じたことや、どのようなアーキテクチャにしたかを記述しています!

【Flutter入門】100画面を超える規模のアプリを開発してみた感想

最後に

今までで参考になった記事や学習してきた教材を記述してきました!
この記事が Flutter で開発する方の役に立つと嬉しいです。
実際に Flutter で開発している現場に入ることが、最も早く Flutter のアプリ開発を学べる最短ルートなので、ある程度できるようになったら案件を探してみるのが良いと思います!

長文でしたが読んでいただきありがとうございました!参考になりましたら、LGTMお願いいたします!
良かったら Twitterのフォロー もお願いいたします。
ありがとうございました!

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
78
Help us understand the problem. What are the problem?