Flutterウィークリー #68

# Flutterウィークリーとは？
FlutterファンによるFlutterファンのためのニュースレター
https://flutterweekly.net/

この記事は#68の日本語訳です
https://mailchi.mp/flutterweekly/flutter-weekly-68

※Google翻訳を使って自動翻訳を行っています。翻訳に問題がある箇所を発見しましたら編集リクエストを送っていただければ幸いです。


# アナウンス

### ハミルトンフレアデザインチャレンジ - Flutter
https://medium.com/flutter/hamilton-flare-design-challenge-54993a7dd0be

<img src="https://miro.medium.com/max/1200/0*wAn4IQgexh-pkr6K" />
Very Good Ventures and 2Dimensionが主催する新しいコンテスト。ハミルトンアプリのための最高のフレアアニメーションを作成しよう！


# 読み物＆チュートリアル

### プロバイダ - 興味のあるポイント - 気にするポイント
https://www.didierboelens.com/2019/07/provider---points-of-interest---points-to-care-about/

<img src="https://www.didierboelens.com/images/logo.png" />
Didier BoelensによるProviderパッケージの広範なレビュー


### 単純なFlutterパターン
https://chimon.hashnode.dev/simple-flutter-patterns-cjxyxxjaj0008nrs16f6q1wdn

<img src="https://hashnode.com/util/r?url=https%3A%2F%2Fhashnode.imgix.net%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1562864818939%2FUbnYsebNE.jpeg%3Fw%3D800%26h%3D420%26fit%3Dcrop%26crop%3Dentropy%26auto%3Dformat%2Cenhance%26q%3D60" />
Ryan Edgeは、例としてフェッチ方法を使用して、彼が最もよく使用しているパターンをいくつか概説しています。


### Streamsを使用した反応的で永続的なFlutterアプリケーションの構築
https://medium.com/flutter-community/building-a-reactive-and-persistent-flutter-app-using-streams-4d6b947c5cb5

<img src="https://miro.medium.com/max/1200/1*WqOZYuVE_ksU12jnrtv-rw.jpeg" />
Jayeshによる、ストリームに基づいて変化するUIの作成方法の例。


### Flutter Web（Hummingbird）を使用してサインアップページUIを構築する
https://medium.com/@jideguru/building-a-signup-page-ui-with-flutter-web-hummingbird-b9fa80e9fdb7

<img src="https://miro.medium.com/max/1200/1*uYk78HUZFzlOLZUcl0khEg.png" />
Web用のFlutterでサインインページを作成する方法に関するJideGuruによる完全な例。


### Flutter iOS Phoneアプリケーションを構築する
https://medium.com/flutter-community/building-ios-phone-application-in-flutter-f312dc207655

<img src="https://miro.medium.com/max/1200/1*s7KqlDVo1vBZm0R5qJf8TA.png" />
このチュートリアルでiOS Phoneアプリケーションを真似ることを学びましょう。


### FlaskをREST APIとして使用してMLモデルをデプロイし、 Flutterアプリを介してアクセスする
https://medium.com/analytics-vidhya/deploy-ml-models-using-flask-as-rest-api-and-access-via-flutter-app-7ce63d5c1f3b

<img src="https://miro.medium.com/max/1200/1*7nFTOvKLYdIp7Zml3FeWXA.jpeg" />
Sharon Zachariaは、画像をサーバーにアップロードしてそれを予測することができるアプリケーションを作成する方法を示しています。


### Flutter BLoCとプロバイダー：ショッピングカートの例
https://medium.com/flutter-community/flutter-bloc-and-provider-a-shopping-cart-example-af75004e1666

<img src="https://miro.medium.com/max/502/1*4JWvD8Buzbf7cA6EfRvkiA.png" />
このチュートリアルでBLoCとProviderを使用してショッピングカートでショップを作成する方法を学ぶ


### Flutter Hackathon 2019：それがどんな感じだったのか
https://medium.com/flutter-community/flutter-hackathon-2019-what-it-felt-like-and-how-was-it-was-eba3b976c0e2

<img src="https://miro.medium.com/max/1200/1*FwocNzNz7wikad9Ydlj72w.jpeg" />
AntonelloGalipòはFlutter Hackathon 2019に出席し、この記事で彼の経験を紹介します。


### Flutter ： Reduxフローでのトースト通知（SnackBar）の表示
https://medium.com/flutter-community/flutter-redux-toast-notification-fcd0971eaf0f

<img src="https://miro.medium.com/max/1200/0*XWC8X7Cj342F6KV3.jpeg" />
Pavel Sulimauは、 Redux 1回限りの操作を処理する方法の例として、スナックバーを使用しています。


### Flutter ：Googleサインインの実装
https://medium.com/flutter-community/flutter-implementing-google-sign-in-71888bca24ed

<img src="https://miro.medium.com/max/1200/1*XXZb2P_z8nO44MzHDnvCNQ.png" />
Souvik Biswasによるこのチュートリアルでは、Firebase認証を使用してサインインを実装する方法を説明します。


### Flutterページ遷移のレベルアップ：画面全体のアニメーションの振り付け
https://medium.com/@lvlzeros/level-up-flutter-page-transition-choreographing-animations-across-screens-efb5ea105fca

<img src="https://miro.medium.com/max/1200/1*_SLOtrJ8WrSv_Zv5ww9fpw.jpeg" />
Shian Poonは、画面内のいくつかのアイテムを振り付けて高度なトランジションを探ります。


### Flutterビジュアルプログラミング
https://medium.com/@ecspike/visual-programming-with-flutter-20b2af9a22cc

<img src="https://miro.medium.com/max/1200/1*yVdhmF2PosYL04RkuotAUQ.jpeg" />
Flutterビジュアルプログラミングを実行するためのBlockyライブラリの作成については、James Williamsによるこの実験を確認してください。


### ダムアイコンフラッターパッケージを書く
https://medium.com/flutter-community/writing-a-dumb-icon-flutter-package-9682d949002f

<img src="https://miro.medium.com/max/1200/1*FJoGGIBlEwKu-35DE2DMTw.png" />
Rishi Banerjeeによるこの記事では、さまざまなアイコンセットを使用して独自のアイコンクラスを作成する方法を学びます。


### Flutter引き出し
https://blog.usejournal.com/flutter-drawers-done-right-b30a715e334b

<img src="https://miro.medium.com/max/1200/1*s3SbEpmcnFE5O9qN1Zd5ig.png" />
各ページで引き出しが繰り返されないように、DrawerとPageViewを組み合わせる方法を学びます。


# ビデオ＆メディア

### Flutter用Flutter
https://skillsmatter.com/skillscasts/14106-firestore-for-flutter?utm_medium=social&utm_source=twitter&utm_campaign=893d46&utm_content=skillscast

<img src="https://res.cloudinary.com/skillsmatter/image/upload/c_fill,w_200,h_200,g_face/v1561378746/wralfddbht6z3qjoc2e1.png" />
Flutter Firestoreを使用した経験についてのMiguel Beltranによる講演。


### HNアプリのデータベース（ボーリングFlutter開発ショー、第26話）
https://www.youtube.com/watch?v=9o_M-LjO4no&list=PLjxrf2q8roU3ahJVrSgAnPjzkpGmL9Czl&index=35&t=0s&linkId=70677724

<img src="https://i.ytimg.com/vi/9o_M-LjO4no/maxresdefault.jpg" />
このエピソードでは、EmilyとAndrewがHackerNewsアプリにデータベースを追加します。


### チョッパー（ Flutterためのレトロフィット）＃3  - コンバーターと内蔵価値の統合 - Dart HTTPクライアントチュートリアル
https://www.youtube.com/watch?v=fynWAe9GjmE&feature=youtu.be&app=desktop

<img src="https://i.ytimg.com/vi/fynWAe9GjmE/maxresdefault.jpg" />
Chopperでコンバーターを作成する方法と、それをBuilt Valueと統合して自動逆シリアル化する方法を学びます。


### 完全なFlutterアニメーションガイド|アニメーションのためのFlutterフックFlutterアニメーションシーケンス
https://www.youtube.com/watch?v=mdhoIQqS2z0&feature=youtu.be

<img src="https://i.ytimg.com/vi/mdhoIQqS2z0/maxresdefault.jpg" />
Flutterコントローラ、 Flutterフック、 Flutter sequence builderを使ってアニメーションを作成する方法についてのチュートリアル。


### Flutter UI卑劣な私のキャラクター - パート2
https://www.youtube.com/watch?v=2cl70GbiJZc&feature=youtu.be

<img src="https://i.ytimg.com/vi/2cl70GbiJZc/maxresdefault.jpg" />
このチュートリアルの後半部分では、PageViewの使い方と、カスタムボトムシート実装の作成方法について学びます。


### Flutter ：Androidアプリバンドルステップバイステップガイド
https://www.youtube.com/watch?v=dRbmjsqERVw&feature=youtu.be

<img src="https://i.ytimg.com/vi/dRbmjsqERVw/maxresdefault.jpg" />
Androidアプリバンドルとは何か、それがどれほど有用であるか、そして最高のアプリを展開するための使い方を学びましょう。また、アプリバンドルを使用して32ビットと64ビットの両方のアーキテクチャをサポートする方法も学びます。


### Flutter ：データ接続チェッカーWifiは接続されているがインターネットがない
https://www.youtube.com/watch?v=u_Xyqo6lhFE&feature=youtu.be

<img src="https://i.ytimg.com/vi/u_Xyqo6lhFE/maxresdefault.jpg" />
指定されたアドレスのリストへのソケットを開くことによってインターネット接続をチェックするプラグインの使い方の説明


### Flutter UI  - クリーンデザイン - フルーツ
https://www.youtube.com/watch?v=wodEsx1_OA8&feature=youtu.be

<img src="https://i.ytimg.com/vi/wodEsx1_OA8/maxresdefault.jpg" />
もう1つのUIの課題、今回はFruit Eコマースアプリです。


### Flutter使ったCloud Firestoreでの全文検索
https://www.youtube.com/watch?v=2DCASHWYj1M&feature=youtu.be

<img src="https://i.ytimg.com/vi/2DCASHWYj1M/maxresdefault.jpg" />
Firestoreを使用するときにFlutterから全文検索を実装する方法を学びます。


### ジェネレータ関数 - フォーカスインFlutter
https://www.youtube.com/watch?v=TF-TBsgIErY

<img src="https://i.ytimg.com/vi/TF-TBsgIErY/maxresdefault.jpg" />
ジェネレータ関数（syncとasync）、それらがどのように機能するのか、そしてどこでそれらを使うのかについて学びましょう。


### Flutterフォームを作成する方法
https://www.youtube.com/watch?v=WpwIZW75YuE&feature=youtu.be

<img src="https://i.ytimg.com/vi/WpwIZW75YuE/maxresdefault.jpg" />
FlutterのFormsの基本を学びましょう。


### ReorderableListView（今週のFlutterウィジェット）
https://www.youtube.com/watch?v=3fB1mxOsqJE&feature=youtu.be

<img src="https://i.ytimg.com/vi/3fB1mxOsqJE/maxresdefault.jpg" />
ReorderableListViewウィジェットは、移動したい場所にドラッグするだけでユーザーが並べ替えることができるアイテムのリストを表示します。


# ライブラリ＆コード

### blankapp / flutter_flipperkit
https://github.com/blankapp/flutter_flipperkit

ばたつきのためのFlipper（拡張可能なモバイルアプリデバッガ）。


### dart-lang / tflite_native
https://github.com/dart-lang/tflite_native

Dartの外部関数インタフェース（FFI）を介したTensorFlow Lite（tflite）へのDartインタフェース。


### flutter-devs / flutter_Flipkart_UI_clone
https://github.com/flutter-devs/flutter_Flipkart_UI_clone

<img src="https://repository-images.githubusercontent.com/190748231/91fbe800-a7e7-11e9-946c-e71e1ad08b8d" />
Flutter作ったFlipkartアプリのデモUI。


### HossamElghamry / FLX
https://github.com/HossamElghamry/FLX

Flutterを使用してさまざまな方法であなたの反応速度をテストするモバイルゲーム


### HossamElghamry / Mediminder
https://github.com/HossamElghamry/Mediminder

Flutter 、Provider、およびBLoCパターンを使用して作成されたシンプルなモバイル医療リマインダー。


### JideGuru / Flutter SocialAppUIKit
https://github.com/JideGuru/FlutterSocialAppUIKit

<img src="https://repository-images.githubusercontent.com/196858357/4537d600-a65c-11e9-9c4b-22ccc34ee065" />
ソーシャルアプリの概念のFlutter表現。


### xsahil03x / before_after
https://github.com/xsahil03x/before_after

<img src="https://repository-images.githubusercontent.com/196949511/99100e00-a85a-11e9-997e-17d9e38a8451" />
2つの画像の違いを表示しやすくするフラッターパッケージ。