Flutterウィークリー #60

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

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

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


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

### PeanutであなたのFlutter / Dart Webアプリを披露する
https://medium.com/@kevmoo/show-off-your-flutter-dart-web-app-with-peanut-c0307f2b733c

<img src="https://cdn-images-1.medium.com/max/1200/1*LK63RBtMraGAPXZ2NQzcuA.png" />
Kevin Mooreが、自分のWebプロジェクトをghページに簡単に公開するために作成したCLIユーティリティ、Peanutの使い方を説明します。


### ペディスティックDart
https://medium.com/dartlang/pedantic-dart-1c7d365510de

<img src="https://cdn-images-1.medium.com/max/1200/1*QCajckOeBhRaLzi0RoFqig.png" />
David Morganが、Pedantic、Googleの内部で使用されている糸くずの構成、およびそれを構築するために行った決定について話します。


### CodemagicでFlutter Webアプリケーションを構築してホストする
https://blog.codemagic.io/build-and-host-your-flutter-web-apps-on-codemagic/

<img src="https://blog.codemagic.io/uploads/2019/05/CM_Web-app-host_FB.png" />
Codemagicの人々は、新機能、静的ページをリリースし、Codemagic CIからFlutter Webビルドをデプロイする方法を説明します。


### CircularRevealAnimationをFlutterライブラリとして実装し、その途中でpub.devに公開する方法
https://medium.com/flutter-community/how-to-implement-circularrevealanimation-as-flutter-library-and-publish-it-on-pub-dev-on-the-way-34e8cd21a46

<img src="https://cdn-images-1.medium.com/max/1200/1*FOXlcTIkBTZv47ERIPaEIw.gif" />
Alexander Zhdanovが、Circularの啓示を作成し、それをpub.devのライブラリとして公開する方法を説明しています。


### 初心者のためのFlutterでFuturesを使うためのガイド
https://medium.com/flutter-community/a-guide-to-using-futures-in-flutter-for-beginners-ebeddfbfb967

<img src="https://cdn-images-1.medium.com/max/1200/0*3ALY4LfYIkbHU1ra.png" />
あなたがそれらを初めて使うとき、Futuresは少し気が遠くなるかもしれません。 Dane Mackierによるこの記事で、あなたは短時間でプロのようにそれらを使用するでしょう。


### Widget-Async-Bloc-Service： Flutterアプリのための実用的なアーキテクチャ
https://medium.com/coding-with-flutter/widget-async-bloc-service-a-practical-architecture-for-flutter-apps-250a28f9251b

<img src="https://cdn-images-1.medium.com/max/1200/1*euB_G715Js8UrRrpPiLKXw.jpeg" />
Andrea BizzottoがBLoCアーキテクチャに新たな工夫を加え、彼が行った微調整を実用的なパターンにすることを説明します。


### マテリアルスタイルのセグメント化コントロール
https://medium.com/@sebbenkra/a-material-styled-segmented-control-1e92310c3a67

<img src="https://cdn-images-1.medium.com/max/1200/1*8m1BTienl2l3jb0Opnscqg.png" />
Sebastian KraatzはFlutterでセグメント化されたコントロールを必要としていたので、彼はそれを作り、自分でそれを行う方法を説明しました。


### Flutterクリッピング
https://medium.com/flutter-community/clipping-in-flutter-e9eaa6b1721a

<img src="https://cdn-images-1.medium.com/max/1200/1*xavlBnnHaqs7T6YDuqIX5w.png" />
Raouf Rahicheによるこの記事で、クリッピングの力を解き放ってください。


### Flutter PageViewのスクロールとウィジェットアニメーションの同期
https://medium.com/flutter-community/synchronising-widget-animations-with-the-scroll-of-a-pageview-in-flutter-2f3475fcffa3

<img src="https://cdn-images-1.medium.com/max/1200/1*sbDhkfuSwelo9dJSadWIRg.jpeg" />
AntonelloGalipòによる、アニメーションとPageViewスクロールとの接続方法に関するチュートリアル。


### Flutterテキストリーダーアニメーション
https://medium.com/aubergine-solutions/text-reader-animation-in-flutter-12f81a47ec7f

<img src="https://cdn-images-1.medium.com/max/1200/1*oEBFCiP1d4j4Y7aMEWBmYw.png" />
Pinkesh Darjiは、Google I / Oに表示されるアニメーションを再現して、AIがテキストを読み取る方法をシミュレートします。


### FlutterレスポンシブUIを構築する
https://medium.com/flutter-community/build-responsive-uis-in-flutter-fd450bd59158

<img src="https://cdn-images-1.medium.com/max/1200/1*IbhW1o72CWMQ_KaIxpuRzQ.jpeg" />
モバイル、Web、デスクトップ用のFlutterアプリを作成するには、レスポンシブUIを作成する必要があります。 Raouf Rahicheがあなたに基本とFlutterからそれを処理する方法を示します。


### なぜFlutterようなツールが成功する必要があるのか
https://medium.com/flutter-community/why-tools-like-flutter-need-to-succeed-965a9408e8dc

<img src="https://cdn-images-1.medium.com/max/1200/1*V_AU7WNHFBTcxoIGqV3QjQ.png" />
Ryan Edgeによる開発作業と、なぜFlutter （およびその他のフレームワーク）が存在すべきかについての興味深い考察。


### 実行時にテーマを変更する
https://medium.com/@bimsina/changing-theme-at-run-time-flutter-d634c307de8a

<img src="https://cdn-images-1.medium.com/max/1200/1*G1vGDPXUTIgkbTgHQd5Wgg.png" />
ダークモードはMaterialスペックの中の1つですので、Bibek Timsinaが実行時にアプリのテーマを変更する方法を説明します。


### Flutterウィジェットパーフェクトステート管理出来ますか？
https://medium.com/flutter-community/widget-perfect-state-management-in-flutte-is-it-possible-73e76c205620

<img src="https://cdn-images-1.medium.com/max/1200/1*zSQnnss0Sdx-D1wx_S-a2A.png" />
州の管理を容易かつ効果的にするためのMellati Meftahによる努力。


### Flutter - バウンスボタンアニメーション
https://medium.com/flutter-community/flutter-bouncing-button-animation-ece660e19c91

<img src="https://cdn-images-1.medium.com/max/1200/1*XAKGyMNlZNWcs0ux9N8WIw.png" />
アニメーションボタンの作成に関するDaniele Cambiによるチュートリアル。


### Shimmerパッケージを使ったFlutter簡単なスケルトンビュー
https://medium.com/flutter-community/easy-skeleton-views-in-flutter-using-shimmer-package-acdde0288e1b

<img src="https://cdn-images-1.medium.com/max/1200/1*Q--LEKI_TCdvdO-bV-zbxQ.png" />
情報をロードしている間にスケルトンを表示することは最近かなり流行しています。 Dane MackierがFlutterそれを行う方法を説明します。


# ビデオ＆メディア

### MediaQuery（今週のFlutterウィジェット）
https://www.youtube.com/watch?v=A3WrA4zAaPw

<img src="https://i.ytimg.com/vi/A3WrA4zAaPw/maxresdefault.jpg" />
MediaQueryを使用して、さまざまな画面サイズに基づいてアプリのUIレイアウトを調整します。


### Flutter UI  - クリーンデザイン - レンタルサービス
https://www.youtube.com/watch?v=y_hX5AAFEB8&feature=youtu.be

<img src="https://i.ytimg.com/vi/y_hX5AAFEB8/maxresdefault.jpg" />
もう一つのUIチャレンジ。今回は、レンタルサービスのアプリです。


### Flutter ：LinearGradientの背景
https://www.youtube.com/watch?v=FZiw9MWLlys

<img src="https://i.ytimg.com/vi/FZiw9MWLlys/hqdefault.jpg" />
LinearGradientデコレーションを使用してウィジェット内に興味深い背景を作成する方法についてのビデオ。


### ソース生成とあなた自身のパッケージの書き方（The Boring Flutter Development Show、Ep。23）
https://www.youtube.com/watch?v=mYDFOdl-aWM&list=PLjxrf2q8roU3ahJVrSgAnPjzkpGmL9Czl&index=32&t=6s&linkId=67913821

<img src="https://i.ytimg.com/vi/mYDFOdl-aWM/maxresdefault.jpg" />
ボーリングショーのこのエピソードでは、FilipはSwavとDiegoの2人のゲストが参加します。 Swavを使って、カスタムウィジェットを自動的に作るためのソース生成の使い方を紹介します。 Diegoでは、彼らはDiegoのパーセントインジケーターFlutterパッケージでCustomPainter関連の機能要求に取り組んでいます。


### Flutter Web：GithubページにFlutter UIKitをデプロイするピーナッツチュートリアル
https://www.youtube.com/watch?v=TJDSQBm51cI&feature=youtu.be

<img src="https://i.ytimg.com/vi/TJDSQBm51cI/maxresdefault.jpg" />
Flutter UI Kit WebアプリケーションをGitHubページまたはgithub.ioにデプロイする方法に関するチュートリアル


### Flutter Web：レスポンシブポートフォリオアプリケーションを作成するパート1
https://www.youtube.com/watch?v=QAHqlsAky_4&feature=youtu.be

<img src="https://i.ytimg.com/vi/QAHqlsAky_4/maxresdefault.jpg" />
Flutter For Webを使用してレスポンシブポートフォリオアプリを作成する方法


### プロバイダと接続性を使用したFlutterネットワークセンシティブUI
https://www.youtube.com/watch?v=u9O8NOnQi_A&feature=youtu.be

<img src="https://i.ytimg.com/vi/u9O8NOnQi_A/maxresdefault.jpg" />
接続しているネットワークの種類に基づいてUIを更新するNetworkSensitiveウィジェットの作成方法を学びましょう。


### フラッタルートを使用したグローバル通知
https://www.youtube.com/watch?v=FRCvqkyeCzQ

<img src="https://i.ytimg.com/vi/FRCvqkyeCzQ/maxresdefault.jpg" />
より分離されたコードのためのルートミドルウェアと通知ミドルウェアを持つredux付きの本物のアプリ。


# ライブラリ＆コード

### appspector / flutter-plugin
https://github.com/appspector/flutter-plugin

AppSpectorをあなたのFlutterプロジェクトに統合するプラグイン。


### pinkeshdarji / SuperHeroInteraction：スーパーヒーローインタラクション
https://github.com/pinkeshdarji/SuperHeroInteraction

Flutter開発したスーパーヒーローインタラクション


### lesnitsky / network_state
https://github.com/lesnitsky/network_state

サービスアウェアネットワーク状態プラグイン


### ayush221b / wallio
https://github.com/ayush221b/wallio

<img src="https://repository-images.githubusercontent.com/187299313/341f7e00-7a8c-11e9-944f-fdcd4e4c72de" />
Android、iOS、Web、およびデスクトップ用のJSON解析およびアニメーションを実装する単純なフラッターアプリケーション。


### TakeoffAndroid /フラッター・サンプル
https://github.com/TakeoffAndroid/flutter-examples

キュレーションデザインの究極のチートブック


### Ethiel97 / nice_button
https://github.com/Ethiel97/nice_button

あなたのアプリに手間をかけずに素敵なボタンをデザインするためのAndroidとIOS用のFlutterパッケージ。


### kalismeras61 / flutter_web_dashboard
https://github.com/kalismeras61/flutter_web_dashboard

Flutterブートストラップスタイル管理UI


### MeshackMusundi /国
https://github.com/MeshackMusundi/Countries

Countries GraphQL APIを使用して国のリストを表示するFlutterアプリ


### andrewackerman / bloc_lite
https://github.com/andrewackerman/bloc_lite

合理化されたBLoC実装ライブラリ


### evant / streamqflite
https://github.com/evant/streamqflite

sqlbriteに触発されたsqfliteの周りのFlutter反応型ストリームラッパー


### メゾニ/マーシャリング
https://github.com/mezoni/marshalling

整列化ライブラリを使用すると、オブジェクトの整列化と非整列化（シリアル化/逆シリアル化も可能）を行うことができます（たとえば、json互換型への変換）。


### roughike / streaming_shared_preferences
https://github.com/roughike/streaming_shared_preferences

Flutterプロジェクト用の反応型Key-Valueストア。 shared_preferencesと似ていますが、Streamsを使用します。


### ayush221b / hack19ハンドブック
https://github.com/ayush221b/hack19-handbook

<img src="https://repository-images.githubusercontent.com/188605854/15067c00-7fb7-11e9-8825-2cd4eb8acfc3" />
Hack&#39;19の参加者を手助けするための、一連の資料がまとめられている、便利なハンドブック。