Flutter (フラッター) とは

1. Flutter (フラッター)

2. Flutter (フラッター) とは
Google が開発している、モバイルアプリケーション開発用のフレームワ
ークです。
単一のコードベースでiOSとAndroidアプリを構築できます。
Flutterアプリケーションを開発するにはGoogleによって開発されたウェ
ブ向けのプログラミング言語Dart（ダート）を使います。
Flutter を利用してコードを書くと、同一のコードベースで Android と
iOS の両方向けのアプリケーションをビルドすることができます。
A framework developed by Google for mobile application
development.
Create iOS and Android apps with a single code base.
The Flutter application is developed using the Dart web programming
language developed by Google.
Writing code using Flutter allows you to build applications for both
Android and iOS with the same code base.

3. 「わざわざ学ばなくてもいいプロ
グラミング言語」で2018年はDart
言語が1位でしたが、2019年にか
けて Dart言語は13位まで下がりま
した。
GoogleによるFlutterの発表によ
って人気が出てきました。
In 2018, the Dart language
ranked first in the
"programming language that
you don't have to learn", but the
Dart language dropped to 13th
in 2019.
Popular with the announcement
of Flutter by Google.
http://codemntr.io/worst-languages-2019

4. Flutter アプリ開発（Apps）
実際に、Dart という言語を使い、
同じコードで Android/iOS 両方のListView表示のアプリを作ってみました
。
Using the language Dart
I tried to make ListView display app for both Android and iOS with the
same code.

5. Android
エミュレーター起動
iPhone
シュミレーター起動
ListView表示のアプリ

6. ListView表示のアプリ 実際に動かした動画
実際に動かした動画のURL
https://www.youtube.com/watch?v=6yve7wKyR2k

7. Flutter アプリのサンプルGitページ
https://github.com/nisrulz/flutter-examples
FlutterアプリのサンプルがGitに公開されて
いるので、いろいろと試す事ができます。
The Flutter app sample is available on
Git, so you can try it out.

8. Flutter アプリのサンプルGitペ
ージ
https://github.com/iampawan/Fl
utterExampleApps

9. Flutter for Web
Google I/O 2019で、Dartを使ってiOS/AndroidのUIが簡単に開発できる
FlutterのWeb版「Flutter for Web」が発表されました。
Flutter for Webは、クロスプラットフォームではなく、スマホアプリで作
ったソースコードをWebだけで動くものにコンパイルできます。
Webサイトなのに、ネイティブアプリのモバイルUIのような動きになりま
す。
Flutter's web version "Flutter for Web" that can easily develop iOS /
Android UI using Dart at Google I / O 2019 was announced.
Flutter for Web can compile source code created with a smartphone
app instead of cross-platform into something that only works on the
web.
Although it is a website, it works like a mobile UI for native apps.

10. では、試しに、GitHubのサンプルを動かしてみましょう。
Let's try GitHub sample.
PCでもスマホでも試せます。
You can try it on your PC or smartphone.
https://flutter.github.io/samples/
QRコード

11. サンプルのGalleryをみてみましょう。
Let's try GitHub sample Gallery.
PCでもスマホでも試せます。
You can try it on your PC or smartphone.
https://flutter.github.io/samples/gall
ery/#/
QRコード

12. サンプルのGallery 実際にスマホで動かした動画
実際に動かした動画のURL
https://www.youtube.com/watch?v=VQJxnhb6QJw

13. 環境構築や実装方法など詳細については以下のQiitaページに記載してます
。
【Flutter】Flutterの環境構築
https://qiita.com/nonkapibara/items/b7d09bf48cb0b71035a8
【Flutter】FlutterでHello World
https://qiita.com/nonkapibara/items/eeffb67d4b6965fe36e4
【Flutter】アプリ内のページの背景色をつけてListView表示して
みた。
https://qiita.com/nonkapibara/items/52a5bc4869f5010a8ff8
【Flutter】「FlutterHub」を試してみた
https://qiita.com/nonkapibara/items/d00c4c535d58996062f1
【Flutter】「Flutter for Web」を試してみた。
https://qiita.com/nonkapibara/items/afdb1abd5762c926a18f

14. まだ開発中ですが、Dart言語で実装した１つのコー
ドで、PC、モバイル（IOS,Android）のアプリケー
ション開発ができるのはとても便利だと思います。
Although it is still under development, I think that
it is very convenient to develop applications for
PC and mobile (IOS, Android) with a single code
implemented in the Dart language.