TechTrainにはさまざまな技術領域に長けた ITエンジニアのメンターが約140名所属しています。そんなメンターの方々から、「その技術、いま学ぶならどう学ぶ？」をテーマにインタビューした結果から、分野別の学習ロードマップにまとめてご紹介します！

メンター紹介

Flutterとは？

Flutterは、Googleが開発したオープンソースのUIフレームワークで、シングルコードベースでiOSやAndroid、Web、Desktop向けのアプリケーションを作成することができます。

ではさっそく、Flutterを初めて学ぶ方から中級者までを対象に、ちゅーやんさん直伝の学習ロードマップを紹介します。

オススメは以下の5つ！

ちゅーやんさんおすすめの学習コンテンツとして以下の5つをご紹介いただきました！

学習の進め方

Flutterの学習を進めるうえで、前提として、初学者の方を3つにグループ分けしてくださいました。

ネイティブ経験があるがFlutterはない
プログラミング経験があるがFlutterはない
プログラミング経験がない

1, 2 に関してはここで紹介するロードマップで十分に学習を進めていただけるとのことでしたが、3に該当する方には以下のアドバイスをいただきました！

ざーっと読むのがそもそも難しい可能性があるので、最初から深く理解しようとはせず、ひとつひとつの説明からプログラミングの基本的な理解をする意識で進めてみてください。身近に質問できる人がいると進めやすいので、コミュニティやメンタリングサービスなどを探してみてください
by ちゅーやんさん

初心者

Flutterの初心者におすすめの学習ステップは次の通りです

① Flutter実践開発

日本語で書かれており、公式ドキュメントの前の入り口として最適です。全体を俯瞰するのにとても良い書籍です。
ただ、かなり幅広く書かれているので、最初は本当にさらっと全体を確認して登場するキーワードを把握するイメージで読むことをオススメします。中級レベルになったころにまた読み返したり、公式ドキュメントで補いながら何度も読むような使い方がオススメです！

② Flutter 公式ドキュメント

英語に抵抗がないなら、最初にこちらから読み始めても大丈夫かなと思います。情報量がとにかく豊富なので、すべてを読むというより、以下に挙げたいくつかのトピックを読んだあとは、他のコンテンツで学んだり、アプリを実際に作りながら、必要に応じてチェックするイメージがオススメです。

Widget Catalog
Binding Layouts
Understanding constraints
Inside Flutter

特に Widget Catalog は初心者の方に読んでいただきたいです。FlutterはすべてがWidgetなので、どんなWidgetがあるのか、どんな目的でWidgetを使うのかを把握しているかどうかで理解のスピードが大幅に変わります。

UIだけではなく、レイアウトやセマンティクス、アニメーションまですべてWidgetでできるんだ、ということを俯瞰するのにとても良い内容です。合わせて、Youtubeの Widget of the Week も視聴すると良いですね。

「何をするにもまずは公式ドキュメントに返ってくる」をクセづけておくことが大切です！

中級者

③ ポケモンから学ぶFlutter

Flutterをある程度把握したらとりあえずアプリをつくってみる経験をした方が良いです。とは言え、自分で考えたアイディアでアプリを作るのはちょっと難しいな、という方にはこの書籍をひとつの具体例として取り組んでみることをオススメします。

この書籍ではなるべく Flutter の標準機能だけをつかうように構成されていて、複雑なライブラリは登場しないので、Flutterそのものをキチンと理解するのにはちょうどよいです。また、ポケモンAPIを使ってそこそこ大きなデータを扱うことになるので、ちょっとした個人開発よりも実践的な実装を経験することができます。なにより、ポケモンを扱うというテーマ的にも楽しみながら学べるので、飽きずに最後まで取り組みやすいです。

オススメなのは、書籍に従って作り終わったアプリにご自身でアレンジを加えることです。自分のアイディアを自分で実装できるようになれれば、中級者といえるでしょう。

④「内側」から理解する Flutter 入門

自分の著書の紹介ですが、Flutterの内部構造を理解することは本当に重要なので、ぜひ読んでいただきたい書籍です。

Flutter公式ドキュメントの Inside Flutter で説明されている内容と似たコンセプトになっているので併読することをオススメします。タイミングとしてはFlutterを学んで 1年ほど経ったくらいがオススメです。ただ、最近は学びはじめの段階からFlutterの内部構造に目を向けるべきという記事も見かける様になってきているので、早いうちにチャレンジしてみるのもオススメです。

正直、Flutterはその仕組が上手く出来すぎているからか、その内側を知らなくても個人開発アプリなら量産できてしまいます。そのため、質の良いものが作れる Flutter エンジニアが欲しいという組織は増えている印象です。そういう意味で、内側がわかるひとは各プロジェクトが求める人材の要件になってきているのでは、と考えています。

コード品質に即効性のあるスキルが身につくと言うよりも、Flutterならではの地力が身につくので、Widgetの作り方やレイアウトの作り方においてよりFlutterらしい正確な判断ができるようになったり、メリット・デメリットを説明できるようになります。コードレビューの説得力が上がるというメリットが大きいですね！

上級者

⑤ 仕組みから理解する Riverpod

こちらも自分の著書の紹介です。Flutterの状態管理にRiverpodを使いたい方に向けた書籍です。

Riverpodの公式ドキュメントは主に "使い方" にフォーカスされており、設計の思想や仕組み、その背景については詳しく触れていません。Riverpodを使っていて、より良いコードを求めるなら、思想や仕組みの理解は重要だと思います。ただ、前提として Flutter 自体の思想や、それに則った作りになっている Provider パッケージを先に学び、実際にアプリを作れるようになってからRiverpodに進む方が良いです。

とりあえずRiverpodを学ぶというスタンスでやると、Riverpodじゃないとアプリが作れない人になってしまいかねないので、先にRiverpodナシのFlutterをやっておいたほうが、その良さがより実感できるでしょう。

また、いきなりRiverpodに入ると学習量が多く、負担が大きくなる可能性があります。また、Riverpodはバージョンアップで使い方がころころ変わるので、インターネットには古い情報が多く混在しています。基本的には公式ドキュメントを参照することが重要です。

まとめ

Flutterはまだまだ新しい技術なので、日々さまざまなライブラリが登場したり、言語・SDKの仕様も頻繁に追加されます。基本的に公式ドキュメントを確認しながら、仕組みの理解を深めながらたくさん手を動かすことが大切です。

学び方