Flutter Meetup Tokyo #12 参加報告　#flutter_meetup_tokyo

Flutter Meetup Tokyo #12 ブログ枠に参加させていただいたため、
簡単に概要だけまとめました！
LT１５分枠のもののみ一旦感想を入れています。

詳しい内容は資料のリンクをはっているので、そちらをご参照ください！

## Flutter Meetup Tokyo #12
https://flutter-jp.connpass.com/event/147892/

## 開催概要
・共催: Flutter Japan User Group, 株式会社ガイアックス
・日時: 2019年11月7日（木）
・会場: 株式会社ガイアックス 6F Attic

## togetterまとめ
https://togetter.com/li/1427577

# 発表内容

## ①Add Flutter to existing apps
### ・ 発表者：　
　[@neonankiti](https://twitter.com/neonankiti)
### ・ 資料：
　https://scrapbox.io/neonankiti-portfolio/Add_Flutter_to_existing_apps
### ・ 概要：　
　タイトル通りですが、既存のネイティブで開発したアプリケーションに対して、
　Flutterで作成したViewを活用法についてです。
　
　GitHubにWikiがあるようなので、それも載せておきます。
　https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps

### ・ 感想：
　既にネイティブで開発し、それなりのコードベースの場合は、
　このアプローチ法が多くなるのかなと思いました。
　実際に上記の手法で運用中とのことですが、

　**・良かった点としては**
　- *開発速度が早いので、リソースの削減が可能*
　- *モックの作成や検証用として活用*

　**・課題の点としては**
　- *Flutterを利用するとiOS1人, Android1人の工数がFlutter1人になるわけではない*
　- *プラッフォーム固有の実装が多い場合、プラグインの開発でIOS、Androidで実装が必要*
　- *プラグイン開発を行わない場合でも、iOS/Android固有の知識は一定必要*

　やはりプラットフォーム固有のUIを実装したい場合には、Flutterだけだと
　厳しいという現実があると思いました。
　既存アプリに対するアプローチがもっと増えることに期待です。

## ②Flutterリプレイスして良かったことと困ったこと
### ・ 発表者：　
　[@ryo_ryoo_ryooo](https://twitter.com/ryo_ryoo_ryooo)
### ・ 資料：
　https://www.slideshare.net/RyoMiyake2/flutter-190978137
### ・ 概要：　
　**・良かったこと**
　　　- Navigatorが最高(処理を細かく書かなくてもいい感じにやってくれる)
　　　- IOS、Androidで二回作らなくて良い(モチベーション下がらない)
　　　- UI作るのが楽(角丸とかグラデーションとか用意されてる)
　　　- その他もろもろ
    
　**・困ったこと**
　　　- WebViewがやばい(Android10でキーボードが切り替えられないなど・・)
　　　- TextViewがやばい(チャットみたいなリンクタップや文字選択両方できるものがない)
　　　- enumが弱い(メソッド定義できないので、Helperメソッドを作る必要がある)
　　　- その他もろもろ
　　　
　**・結論**
　　　- 開発速度が早い(リプレイスを2ヶ月でできた。ネイティブなら３ヶ月はかかる)
　　　- リプレイス後の開発速度は３倍になった。
　　　- Android単体のアプリでもFlutterの方が簡単に作れた。

### ・ 感想：
　開発速度早い！と率直に思いました。
　リプレイス後の開発はFlutterで完結できて、開発速度もあがるのを考えると、
　プラットフォーム固有のUI等が少ないアプリの場合は、
　リプレイスするのも手だな思いました。
　上記の困ったことについても、プラグインを追加し、Dart 2.6で
　解決できるとのことだったので、なおいいと思いました！
　要件によりけりですが、積極的にFlutter使っていきたいですね、、
　
## ③Bloc PatternにおけるBloc分割の方針と実践例
### ・ 発表者：　
　[@yamarkz](https://twitter.com/yamarkz)
### ・ 資料：
　https://speakerdeck.com/yamarkz/division-plan-and-practical-example-in-bloc-pattern

### ・ 概要：
**以下のブロックパターンに棲み分けを行なった。**

　①アプリケーション全体に関わる処理を一つにまとめる(Global Bloc)

　②スクリーンだけで利用する処理を一つにまとめる(Local Bloc)

　③コンポーネントで利用する処理を一つにまとめる(Component Bloc)

　④共通で利用する処理を一つにまとめる(Template Bloc)
　
**なぜブロックパターンを適用しようと思ったのか**

　①ブロックごとに処理がまとまるため、構造が単純かつコード数が短くなる。
　　(しかしファイル数は多くなる。)

　②スコープの範囲が明確のブロックに切り分けるため、ブロック自体が疎結合になる。
　　保守性・可読性があがる。

**まとめ**
　・作られたブロックの数は26個(多い？少ない？開発者としてはこんなもんかなという感じ)
　・各々のブロックの使い方を見極めて、スコープを明確化、構造化できれば
　　保守性が大きく向上する。

### ・ 感想：
　とても参考になりました！
　自分がFlutterのコードを書く時はどうしても長く読みづらいコードになっていました。
　共通処理をファイル分けしていこうとは思っていたのですが、
　どの程度、どの範囲で分けていくのかが明確ではなかったので今回のパターンを参考に
　ブロックパターンを組んで行ければ良いと思いました。

## ④Flutterで個人的につまったところとその解決策
### ・ 発表者：　
　[@maru0401](https://twitter.com/marudroid)
### ・ 資料：
　https://speakerdeck.com/maru01/fluttermeetup
### ・ 概要：
**困った内容**
　①画面の入れ替え

　②GridViewにアイテム画像(サーバー上)が含まれている場合、画像が縮小されてしまう

　③ある画面の上に、半透明の画面を表示したい

**解決方法**
①`Navigator.of(context).popUntil`メソッドで初期画面に戻して解決

②あらかじめサイズを指定することで解決

③表示Widgetの背景色を変更することで解決

## ⑤FlutterのWebView プラグインどれ使えば？
### ・ 発表者：　
　[@espresso3389](https://twitter.com/espresso3389)
### ・ 資料：
　https://speakerdeck.com/espresso3389/flutterfalsewebview-hurakuintoreshi-eha
### ・ 概要：
**現在主流のWebViewのプラグイン**
　①webview_flutter
　　→Flutter.dev　純正
　　→PlatformViewで実装
　
　②flutter_webview_plugin
　　→ネイティブのWebviewにオーバレイ

　③flutter_inappbrowser
　　→PlatformViewで実装
　　→Chrome　Custom　Tabs(Android)
　　→SFSfariViewController(IOS)

**オススメのプラグイン**
③のflutter_inappbrowser
　機能が豊富なのでいろんな実装が可能とのこと。

## ⑥Static Extension Methods 使う前に知っておきたい注意書き
### ・ 発表者：　
　[@makicamel](https://twitter.com/makicamel)
### ・ 資料：
　https://speakerdeck.com/makicamel/carefully-use-and-enjoy-static-extension-methods
### ・ 概要：
**注意点**
　①インスタンス変数は追加できない
　
　②NNBD(Non-Null by Default; null安全)でない変数のnullは拡張できない

　③メソッド名の衝突に注意

**結論**
　・クラスの挙動の変更は危険なので注意が必要
　・簡単に始められて、標準クラスにメソッド追加できるので、
　　可読性の高いものにできるのオススメ
　　→Dartの可読性がよくない時がある。

## ⑦Flutter こんな案件で活躍しました！
### ・ 発表者：　
　[@chooyan_i18n](https://twitter.com/chooyan_i18n)
### ・ 資料：
　https://docs.google.com/presentation/d/1KXlFVGwIQy812Nplh6sPs4x86-t2raXZ93f97cHqXEw
### ・ 概要：
**どんな案件にはまったのか**
　①ひとりでIOS、Androidの対応をしなければならない
　　→Flutterがマルチプラットフォーム
　②デザインはこだわらない。プラットフォーム固有のUIいらない。
　　→マテリアルWidgetそのまま使えば満足
　③非機能要件もそんなに気にしない。
　　→プラグインのバージョンが0.x.xでも使える！

## ⑧Gitpodでブラウザから Flutterで開発する
### ・ 発表者：　
　[@sakebook](https://twitter.com/sakebook)
### ・ 資料：
　https://www.slideshare.net/sakebook/gitpodflutter
### ・ 概要：
**Gitpodとは**
　・Eclipse Theiaベースのオンライン開発環境
　・Publicリポジトリなら無料(月１００時間まで)
　・GitHubとの連携が強い(PR作成やレビューコメントなどもできる)

**触ってみた感想**
　・Extension入れられるので補完周りは良い
　・環境を整えられるのは良い
　・もっとショートカットほしい
　・webしか開発できない
　・メインで使うかは怪しいが、普段の開発環境がない場合とかは十分代替になる

# 参加してみて

　意外とFlutter経験が3ヶ月〜半年という人が多かったにも関わらず、　
　アプリ等リリースしたり、リプレイスしたりと様々なことができていて
　やっぱりFlutter使いこなしたら便利だなと思いました。
　何より個人的には、HotReloadの機能が最高なので、
　なるべくFlutterを使い、開発速度・保守性を上げていきたいともいます。
　みんなでFlutterをどんどん盛り上げていきましょう！！

　運営のみなさま、
　会場や飲食物をご提供くださったFlutter Japan User Group, 株式会社ガイアックス様、
　登壇されたみなさま、
　今回は有意義な時間を誠にありがとうございました。