Flutter によるスマホアプリ開発
はじめに
Flutter (フラッター) は、Googleによって開発されたフリーかつオープンソースのモバイルアプリケーションフレームワークです。FlutterはAndroidやiOS向けのアプリケーションの開発に利用されています。
様々なUIパーツが初めから用意されており、組み合わせることで簡単にUIを実装することができます。
プログラミング言語には「Dart」を使用します。
※JavaScriptやJavaの開発経験者であれば、簡単に理解出来ると思います。
https://twitter.com/pirorororonn/status/1254773673380085761
Flutterの開発環境構築とプロジェクトを作成する方法を備忘録としてまとめます。
事前準備
公式ドキュメントや開発環境の構築方法について把握します。
ドキュメント
Flutter
公式サイト : https://flutter.dev/
Dart
公式サイト : https://dart.dev/
参考にした本
環境構築
GitHub のFlutterリポジトリからソースコードを取得し、必要に応じてブランチまたはタグを変更します。 https://github.com/flutter/flutter
$ git clone https://github.com/flutter/flutter.git -b stable
.bash_profileにflutterツールのパスを追加します。
#Flutter
$ export PATH_TO_FLUTTER_GIT_DIRECTORY=/Applications/flutter
$ export PATH=${PATH_TO_FLUTTER_GIT_DIRECTORY}/bin:$PATH
PATH_TO_FLUTTER_GIT_DIRECTORY はFlutterのgitリポジトリを複製したパスにします。
次のコマンドを実行して、flutter/binディレクトリがPATHに含まれていることを確認します。
$ echo $PATH
次のコマンドを実行して、flutterコマンドが使用できることを確認します。
$ which flutter
次のコマンドを実行して、セットアップを完了するために必要な可能性のある他のソフトウェアがあるかどうかを確認します （詳細出力の場合は、-vフラグを追加します）。
$ flutter doctor
実装
新規プロジェクト作成
新しいアプリを作成するには、次のコマンドを実行し、myappプロジェクトの名前に置き換えます。
$ flutter create myapp $ cd myapp
iOS simulatorで実行する
$ open -a Simulator $ flutter run
FlutterやDartのパッケージを使用する
FlutterやDartの各種パッケージは、「Dart packages」で探せます。
Flutterでは、外部パッケージなどの依存関係やアプリの設定は pubspec.yaml に記述します。 次のコマンドを実行すると、pubspec.yamlに記載された外部パッケージなどが取得され、使えるようになります。
$ flutter packages get
まとめ
今回はFlutterの開発環境構築を行い、 サンプルプロジェクト を作成して、いろいろな動作を検証してみました。 検証からいくつか、メリット・デメリットとして挙げられる点を感じたのでまとめます。
メリット
- １つのソースコードで、iOS・Androidの両方で動作するアプリを手軽に開発出来る
- クオリティの高いUIが簡単実装出来る
- Dart言語は、JavaScriptやJavaの開発経験者であれば、簡単に理解出来る
デメリット
- 日本での採用事例が少なく、開発者の人口も多くない
- オープンソースライブラリや情報が少ない（日本語で書かれた資料が少ない）
- OSに依存する機能については、各プラットフォームごとに実装する必要がある
また別で、Flutter と Firebase で、「アプリのアクセス/クラッシュ解析」や「クロスプラットフォームでPUSH通知」や「ログイン認証」などが簡単に実装出来たので、今後まとめていきます。
追記
Flutterプロジェクト に Firebase の設定について、 Flutter アプリに Firebase を追加する にまとめました。
