差分

このページの2つのバージョン間の差分を表示します。

--- 00.flutter:01.windows10にflutterをインストール [2019/09/23] – [01.Windows10にFlutterをインストール] adash333
+++ 00.flutter:01.windows10にflutterをインストール [2021/05/23] (現在) – [リンク] adash333
@@ 行 1: / 行 1: @@
 ====== 01.Windows10にFlutterをインストール ======
+{{tag>flutter}}
+ ---//2021/5/22更新//
-以下に記載させていただきました。
+[[00.flutter:index.html|スマホアプリ作成フレームワークFlutter]]
+Flutterは、もともとiOS/Androidアプリ作成用フレームワークですが、2021年3月より、Webアプリも作成できるようになりました。ただし、Webアプリとしてはスピードは速くなく、大規模なWebサイトやブログの作成には向かないとのことです。
+===== 見出し =====
+Windows10 (1909)にFlutter 2.2 をインストールした経過を、以下に記載させていただきました。(2021年5月)
+https://i-doctor.sakura.ne.jp/font/?p=46146
+Windows10にFlutter2.2をインストールしてFultterWebを試してみる
+Windows10 (1803)にFlutter 1.12 をインストールした経過を、以下に記載させていただきました。(2019年12月)
+https://i-doctor.sakura.ne.jp/font/?p=42109
+『Flutter×Firebaseで始めるモバイルアプリ開発』をWEBアプリにして写経してみる（１）Windows10でFlutterをインストールしてAndroid実機で開発画面を表示
+Windows10 (1803)にFlutter 1.9 をインストールした経過を、以下に記載させていただきました。(2019年9月)
 https://i-doctor.sakura.ne.jp/font/?p=41098
-{{:00.flutter:pasted:20190923-132938.png}}
+===== 開発環境 =====
+<code>
+Windows 10 Pro (1909)
+git version 2.29.2.windows.2
+Chrome
+VisualStudioCode 1.55.2
+</code>
+gitのインストールについては、[[https://qiita.com/manabu-watanabe/items/ecf1b434baf305adaa00|こちらのサイト]]が分かりやすいです。
+今回構築した環境
+<code>
+Flutter 2.2
+VisualStudioCodeのFlutter Extensions
+</code>
+===== WindowsにFlutter(Web)をインストールするときの流れ =====
+  -Flutter SDKをダウンロードして解凍
+  -Windowsの環境変数にflutterのPATHを通す
+  -VisualStudioCodeでflutter doctor コマンドを実行して環境チェック
+  -新規Flutterアプリを作成
+  -VisualStudioCodeのExtensions(拡張機能)でFlutter(dart-code.fultter)を入れる
+詳細は<wrap hi>[[https://i-doctor.sakura.ne.jp/font/?p=46146|Windows10にFlutter2.2をインストールしてFultterWebを試してみる(2021/5/22)]]</wrap>をご覧ください。
+また、Androidアプリを作成するためのFlutterの設定方法については、<wrap hi>[[https://i-doctor.sakura.ne.jp/font/?p=42109|『Flutter×Firebaseで始めるモバイルアプリ開発』をWEBアプリにして写経してみる（１）Windows10でFlutterをインストールしてAndroid実機で開発画面を表示(2020/1/5)]]</wrap>をご覧ください。
+===== Flutter SDKのダウンロード =====
+以下のサイトへ行き、SDKをインストールするためのZIPファイル（約650MB）をダウンロードして展開し、中身のflutter/ フォルダを、D:/ 直下(またはC:/ 直下)にコピーします。
+https://flutter.dev/docs/get-started/install/windows
+{{:00.flutter:pasted:20200107-044235.png}}
+分くらいでダウンロードが終了するので、ZIPファイルをダブルクリックして開き、 中のflutter/ フォルダを、そのまま、D:/ 直下(またはC:/ 直下)にドラッグ＆ドロップします。
+{{:00.flutter:pasted:20200107-044436.png}}
+なんと1.54 GBもあります。コピーするだけで1時間くらいかかりそうです。他のことをします。恐ろしや、、、
+===== Flutterをインストールした後はCodelabがお勧め =====
+英語ですが、上から順番にやっていくのが良いと思います。
+https://flutter.dev/docs/codelabs
+{{:00.flutter:pasted:20200103-025515.png}}
+===== リンク =====
+https://flutter.dev/docs/get-started/web
+Building a web application with Flutter (公式サイト)
+https://zenn.dev/fastriver/books/caff13da8b852c
+FlutterでWebアプリ開発入門 fastriver
+https://zenn.dev/kazutxt/books/flutter_practice_introduction
+Flutter実践入門 ～環境構築からAndroid/iOS/Webに広告を付けて同時にリリース!!～
+kazutxt
+/5/23 2.1.1版
+→すごく分かりやすいです。
+https://recruit.gmo.jp/engineer/jisedai/blog/flutter2-canvaskit-performance/
+.03.23
+Flutter 2で使えるWebAssemblyレンダラー CanvasKit は本当に高速なのか？
 ===== リンク =====
 目次：[[00.flutter:index.html|スマホアプリ作成フレームワークFlutter]]
@@ 行 12: / 行 85: @@
 前：[[00.flutter:index.html|スマホアプリ作成フレームワークFlutter]]
-次：
+次：[[00.flutter:02.flutterでwebアプリを作成|02.FlutterでWebアプリを作成してNetlifyにデプロイ]]