Flutterの特徴総まとめ 

「Flutter」と書いて「フラッター」と読みます。
この記事では、そんな「Flutter」の特徴をまとめていきます。

## Flutterとは
Googleが開発したオープンソース型のモバイルUIフレームワーク。
2018年12月4日にFlutter1.0がリリース。
[Flutter公式サイト](https://flutter.dev/)

## Flutterの特徴
### Dartベースの単一のコードベース
DartはGoogleが開発したプログラミング言語で、
TypeScriptと同じでJavaScriptへトランスコンパイルして使う。
TypeScriptとの違いは、宣言型UIフレームワークが組み込まれていること。
宣言型UIフレームワークは、必要なパーツは全てサポートされ、
直感的なコードを書くだけでUIを構築できます。
[Dart公式サイト](https://dart.dev/)

FlutterはこのDartを使って開発します。

### クロスプラットフォーム
単一のコードで、Android・iOS向けのアプリを同時に作ることができます。
今までは、AndroidならKotlinやJavaを使って開発、
iOSならSwiftを使って開発していたものが、
Flutterなら1つのコードで開発できます。

当然、プログラムの修正も1つのコードで管理できるので、管理コストも減ります。

そして、Android・iOSの開発ができるだけでなく...
Webやデスクトップアプリも出来ちゃう...らしい...

### ホットリロード
コードを書いてすぐに実際の動きを確認できます。
コンパイルの時間が短縮されるので、格段に開発スピードをあげることができます！

### マテリアルデザイン
宣言型UIフレームワークが導入されているので、
直感的なコードでUIを構築できるのですが、
そのUIが私たちがよく目にするようなデザインのものに
なっちゃいます。勝手に。

### その他の特徴
その他にも特徴がかなりあるので、後はメモ程度に列挙しておきます。

- 処理速度が高速
- カスタマイズ可能なUIウィジェット → 少し複雑なレイアウトも可能
- VSCodeで開発可能 → 開発はVSCodeかAndroid Studioの2択
- ビルドが簡単
- Firebaseとの相性抜群 → サーバー側はBaaS
- API・SDKが豊富(になってきている) → Stripe(決済)なども入れられる
- 英語の情報が多数 → 特に公式の情報が役に立つ

## Flutterの将来性
### AdobeXDでのコード生成
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Today we announce <a href="https://twitter.com/AdobeXD?ref_src=twsrc%5Etfw">@AdobeXD</a> x Flutter 👏!<br><br>The XD to Flutter plugin is now available as early access for broader public testing. Adobe XD is a UI/UX collaboration tool to help teams create and share designs. <a href="https://twitter.com/hashtag/FlutterGoodNewsWednesday?src=hash&amp;ref_src=twsrc%5Etfw">#FlutterGoodNewsWednesday</a> <br><br>Learn more here ↓ <a href="https://t.co/v9Xa381XSs">https://t.co/v9Xa381XSs</a></p>&mdash; Flutter (@FlutterDev) <a href="https://twitter.com/FlutterDev/status/1260590281306472449?ref_src=twsrc%5Etfw">May 13, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
AdobeXDでアプリのデザインしたら、そのデザインをFlutterのコードに書き出してくれます。
つまり、デザインはデザイナーに任せて、エンジニアはBaaSとの接続などに集中すれば良いだけになるのです。

理想ではあるので、どんな感じのコードを生成してくれるかによって使い勝手は変わってきそう...
あと、Flutterが良い感じのデザインのウィジェット用意してくれてるので、勝手にデザインが出来ちゃう感じだから...

### Codepenでのコードスニペット作成
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">When one door closes, an entry point opens! 🚪<br><br>Check out the new entry point for the CodePen Flutter Editor. You can now easily create a new Flutter pen by going to Create &gt; Pen &gt; Flutter Pen. <br><br>See the gif below for more details ↓ <a href="https://t.co/uarI3yhawc">pic.twitter.com/uarI3yhawc</a></p>&mdash; Flutter (@FlutterDev) <a href="https://twitter.com/FlutterDev/status/1272593162138087429?ref_src=twsrc%5Etfw">June 15, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
これがシンプルに凄い。
Flutterをインストールすることなく試せるって初心者からしても嬉しいし、
なんせCodepenの良さは共有できることだから、これを使って解説記事も書きやすい。
最高すぎますね。

### Googleがガチで開発中(?)
開発のスピードがとにかく速いです。
この間、webの開発もできるようになったのかと思えば、
デスクトップアプリもいけるのかと。

Googleが出す公式のドキュメントは英語だがわかりやすい。
特に、Flutter Widget of WeekというYouTubeに上がっている動画は、
FlutterのUIウィジェットの理解に非常に役立ちます。
[Flutter Widget of Week](https://www.youtube.com/playlist?list=PLjxrf2q8roU23XGwz3Km7sQZFTdB996iG)

### 新OS「Fuchsia」の登場でさらに...
Googleは新OS「Fuchsia」(フクシア)を開発しています。
このOSは、Androidを置き換わると言われています。

何が変わるのかというと、このFuchsiaというOSは、
デジタルなもの全てに搭載させられるように開発している。

つまり、IoTに対応できるOSを開発しているというわけなんです。
どこまでが実現されるかわかりせんが、公式サイトはもうすでに↓
[Fuchsia公式サイト](https://fuchsia.dev/)

この「Fuchsia」で動くアプリも作れてしまうのがFlutter。
というより、元は「Fuchsia」のために作られたのがFlutter。

ということはですよ。みなさん！！！
Flutterを制するものは、、、

## まとめ
Flutterマジでワクワクです！
学び始める前は、聞いたことないなぁって感じで、
やっている人も周りに数人って感じでしたが、なんか流行ってきたかもですね。
日本語の情報ももっと増えれば完璧やね！(^^) ← 発信頑張るよ！

この記事が良いと思った方は、LGTMをしていただければ嬉しいです！
フォローも是非お願い致します(^^)