Flutter とは

Flutter は、Google によって開発およびサポートされているオープンソースフレームワークです。フロントエンドとフルスタックのデベロッパーは、Flutter を使用して、単一のコードベースで複数のプラットフォーム用にアプリケーションのユーザーインターフェイス (UI) を構築します。

2018 年にリリースされたとき、Flutter は主にモバイルアプリの開発をサポートしていました。現在では、Flutter は、iOS、Android、ウェブ、Windows、MacOS、Linux の 6 つのプラットフォームでのアプリケーション開発をサポートしています。

Flutter がアプリケーション開発にどのように役立つか

Flutter は、サポートする 6 つのプラットフォーム全体で、一貫性のある魅力的なアプリケーションの UI を作成するプロセスを簡素化します。

Flutter はクロスプラットフォームの開発フレームワークであるため、最初にネイティブ開発と比較します。次に、Flutter に固有の機能を取り上げます。

クロスプラットフォームアプリケーション開発と比較したネイティブアプリケーション開発

iOS などの特定のプラットフォーム向けにアプリケーションをコーディングすることを、ネイティブアプリケーション開発と呼びます。対照的に、クロスプラットフォームアプリケーション開発では、単一のコードベースで複数のプラットフォーム用のアプリケーションを構築しています。

ネイティブアプリケーション開発

デベロッパーは、ネイティブアプリケーション開発で特定のプラットフォーム用にコーディングするため、ネイティブデバイスのすべての機能にアクセスできます。これにより、一般に、クロスプラットフォームアプリケーション開発と比較して、パフォーマンスと速度が向上します。

一方、アプリケーションを複数のプラットフォームで起動する場合、ネイティブアプリケーションの開発にはより多くのコードとデベロッパーが必要になります。これらの費用に加えて、ネイティブアプリケーション開発により、一貫したユーザーエクスペリエンスを保ちながら異なるプラットフォームで同時に起動することが難しくなる可能性があります。ここで、Flutter のようなクロスプラットフォームアプリケーション開発フレームワークが役立ちます。

クロスプラットフォームアプリケーション開発

クロスプラットフォームアプリケーション開発により、デベロッパーは 1 つのプログラミング言語と 1 つのコードベースを使用して、複数のプラットフォーム用のアプリケーションを構築できます。複数のプラットフォーム用のアプリケーションをリリースする場合、クロスプラットフォームアプリケーション開発は、ネイティブアプリケーションの開発よりもコストと時間がかかりません。

このプロセスにより、デベロッパーはプラットフォーム間でより一貫したユーザーエクスペリエンスを作成することもできます。

このアプローチには、ネイティブデバイス機能へのアクセスが制限されるなど、ネイティブアプリケーション開発と比較して欠点がある場合があります。ただし、Flutter には、クロスプラットフォームアプリケーション開発をよりスムーズかつ高パフォーマンスにする機能があります。

Flutter の利点

Flutter がクロスプラットフォームの開発フレームワークとして優れている点をいくつか示します。

  • ネイティブに近いパフォーマンス。Flutter はプログラミング言語 Dart を使用し、マシンコードにコンパイルします。ホストデバイスはこのコードを理解するため、高速で効果的なパフォーマンスが保証されます。
  • 高速で一貫性のあるカスタマイズ可能なレンダリング。プラットフォーム固有のレンダリングツールに依存するのではなく、Flutter は Google のオープンソースの Skia グラフィックライブラリを使用して UI をレンダリングします。これにより、ユーザーがアプリケーションへのアクセスに使用するプラットフォームに関係なく、一貫したビジュアルがユーザーに提供されます。 
  • デベロッパー向けのツール。 Google は、使いやすさを重視して Flutter を構築しました。ホットリロードなどのツールを使用すると、デベロッパーは状態を失うことなく、コードの変更がどのように見えるかをプレビューできます。ウィジェットインスペクターなどの他のツールを使用すると、UI レイアウトの問題を簡単に視覚化して解決できます。

Flutter が使用するプログラミング言語

Flutter は、同じく Google が開発したオープンソースのプログラミング言語 Dart を使用しています。Dart は UI の構築に最適化されており、Dart の強みの多くは Flutter で使用されています。

例えば、Flutter で使用される Dart の機能の 1 つは、sound null safety です。Dart の sound null safety により、null エラーと呼ばれる一般的なバグの検出が容易になります。この機能により、デベロッパーはコードのメンテナンスに費やす時間が短縮され、アプリケーションの構築により多くの時間を費やすことができます。

Flutter のウィジェットとは

デベロッパーは Flutter ではウィジェットを使用して UI レイアウトを構築しています。これは、ウィンドウやパネルからボタンやテキストに至るまで、ユーザーが画面上で見るものすべてがウィジェットで作成されていることを意味します。

Flutter ウィジェットは、デベロッパーが簡単にカスタマイズできるように設計されています。Flutter は、コンポジションアプローチによってこれを実現します。つまり、ほとんどのウィジェットは小さなウィジェットで構成されており、最も基本的なウィジェットには特定の目的があります。これにより、デベロッパーはウィジェットを結合または編集して新しいウィジェットを作成できます。

Flutter は、プラットフォームの組み込みウィジェットを利用するのではなく、独自のグラフィックエンジンを使用してウィジェットをレンダリングします。このようにして、ユーザーはプラットフォーム全体で Flutter アプリケーションで同様のルックアンドフィールを体験できます。一部の Flutter ウィジェットは、プラットフォーム固有のウィジェットでは実行できない機能を実行できるため、このアプローチはデベロッパーに柔軟性ももたらします。

Flutter では、コミュニティが開発したウィジェットも簡単に使用できます。Flutter のアーキテクチャは複数のウィジェットライブラリを持つことをサポートしており、Flutter はコミュニティが新しいライブラリを構築して維持することを奨励しています。

Flutter ウィジェットのタイプ

Flutter には、ダウンロードした時点から広範なウィジェットカタログが付属しています。カタログには 14 のカテゴリがあり、スタイリング、Cupertino (iOS スタイルのウィジェット)、Material Components (Google のマテリアルデザインガイドラインに従うウィジェット) が含まれます。

Flutter にはレイアウトとテーマも含まれているため、デベロッパーはすぐに構築するのに役立ちます。

Flutter のサポート方法

Flutter は Google と、Reddit、Discord、Slack、Stack Overflow、Gitter の活発なオープンソースコミュニティによってサポートされています。Google は 2018 年のリリース以来、Flutter を一貫して更新してきました。例えば、2022 年の Flutter 3 アップデートでは、安定したサポートを macOS と Linux に拡張しました。

Flutter の習得を容易にするために、Google は Flutter のサイトで広範なドキュメントとチュートリアルを用意しています。Flutter ユーザーと交流するために、Google はグローバルイベントをホストし、コミュニティプロジェクトを促進し、デベロッパーチャレンジを後援しています。今後のイベントは Flutter のサイトで確認できます。

Flutter のコミュニティは、デベロッパーエクスペリエンスを合理化する何千ものサードパーティーパッケージと優れたツールを作成してきました。これらのライブラリは pub.dev で入手できます。

AWS が Flutter をサポートする方法

Flutter は、ユーザーに表示されるアプリケーションの一部を構築するのに役立ちます。ただし、アプリケーション開発には、認証、ファイルストレージ、分析など、ユーザーが目にすることのない多くの機能が必要です。ここで、AWS Amplify と Amplify Flutter の出番です。

AWS Amplify は、セキュアでスケーラブルなモバイルおよびウェブアプリケーションを構築するためのフレームワークです。iOS、Android、ウェブ、React Native、Flutter をサポートする AWS Amplify を使用すると、AWS を利用したアプリケーションをすばやく簡単に構築できます。

Amplify Flutter は、Flutterアプリケーションのバックエンドをプロビジョニング、構築、デプロイできるツールとライブラリのセットです。Amplify Flutter を使用して Flutterアプリケーションを AWS に接続し、一般的なバックエンドのニーズを解決できます。

バックエンドソリューションとして Amplify Flutter を使用する

Amplify Flutter を使用すると、AWS と連携して次の一般的なバックエンド機能を Flutterアプリケーションに追加できます。

  • 分析。 Amplify Flutter を使用すると、Amazon Pinpoint でユーザーの追跡データを収集できます。イベントを簡単に記録し、ニーズに合わせてメトリクスと属性をカスタマイズできます。
  • API。 Amplify Flutter には堅牢な API 機能があります。GraphQL API は、バックエンドでデータを取得するのに役立ち、AWS AppSync によってバックアップされています。REST API とハンドラーは、Amazon API GatewayAWS Lambda を使用して、バックエンドにリクエストを行うのに役立ちます。
  • 認証。 Amplify Flutter を使用すると、ユーザーを認証し、サインアップおよびサインインフォームと多要素認証を実装できます。バックグラウンドで、他の Amplify カテゴリに必要な承認を行います。Amplify Flutter は、使用開始時から Cognito ユーザープールと ID プールをサポートします。
  • DataStore。Amplify Flutter を使用すると、オフラインおよびオンラインのシナリオのために追加のコードを記述することなく、分散された共有データを使用できます。これにより、ローカルのみのデータを操作するのと同じように、分散したクロスユーザーデータを簡単に操作できます。Amplify DataStore は、データを自動的にバージョンアップし、AppSync を使用してクラウド上で競合の検出と解決を行います。
  • ストレージ。 Amplify Flutter を使用すると、ストレージ内のオブジェクトをアップロード、ダウンロード、および削除できます。また、Amplify Flutter には、Amazon Simple Storage Service (Amazon S3) のサポートが組み込まれています。

Amplify Flutter の詳細をご覧ください。

AWS を使用した Flutter の次のステップ

追加の製品関連リソースを確認する
デベロッパーツールの詳細 
無料のアカウントにサインアップする

AWS 無料利用枠にすぐにアクセスできます。 

サインアップ 
コンソールで構築を開始する

AWS マネジメントコンソールで、AWS を使って構築を開始しましょう。

サインイン