Flutter開発環境構築:Windows編

Flutter
スポンサーリンク

WindowsでのFlutter開発環境構築

はじめに

今回はWindowsでのFlutterの開発環境構築の流れを説明していきます。

 

最近盛り上がっているFlutter SDKはiPhoneアプリとAndroidアプリを同時に開発することができ、

Windowsでも使用できるため今までiPhoneアプリを作るためにMac、XcodeがないとiPhoneアプリが開発できなかったのがWindowsのPCでもできるようになります。

*実際にはiOSシミュレーターやiPhoneでの実機テスト、リリースなどはMac、Xcodeがないとできません。

 

Flutterはそれ単体で使えるようなソフトウェアではなく、実際にはAndroid StudioやVisual Studio Code、IntelliJ IDEAなどのアプリ開発ソフトで用いて使用します。

 

今回は基本的なAndroid Studioでの開発環境構築をしていきます。

 

Flutterインストール

さっそくFlutterをインストールしていきます。

以下のリンクからFlutterの公式サイトにとんでFlutterをダウンロードします。

 

Install
Select the operating system on which you are installing Flutter:{{site.alert.note}} **Are you on Chrome OS?** If so, see the official (/docs/get-started/insta...

ダウンロード

  1. 今回はwindowsでの開発環境を構築するので”windows”を選択します。
  2. 次に画像の赤丸で囲った部分を選択し、Flutterをダウンロードします。
  3. zipファイルで保存されるのでzipファイルを解凍します。
  4. 解凍されたファイル”flutter”を探し、適当な位置(:C/user/・・/documentsなど)に移動させます。
  5. これでflutterのダウンロードが完了しました。

PATHを通す

「PATHを通すってなんぞや?」ってなる人もいるかと思いますがここではPATHについての詳しい説明はしません。

すごく簡単に説明すると「いつでも簡単にFlutterを使用できるようにしておくこと」です。PATHについて詳しく知りたい方は下に丁寧に説明されているQiita記事を見つけたのでリンク貼っておきます。

「PATH を通す」の意味をできるだけわかりやすく説明する試み - Qiita
「PATH を通す」の意味をできるだけわかりやすく説明する試みです。 # 前提知識 - Windows - ファイル、フォルダ、フルパス、実行ファイルの意味がわかっている - コマンドプロンプト上で実行ファイルを開く程度の操作を行っ...

 

以下の手順でPATHを設定します。

  1. スタート画面での検索欄で”システム環境変数の編集”を検索し、開きます。
  2. “環境変数”を選択し、”ユーザー環境変数”で新規でPATHを追加します。
  3. nameは任意で設定し、変数値は”ファイルの参照”で先ほど移動させたflutterを開きbinというファイルを選択、開くで設定できます。(自分で打ち込んでも大丈夫ですが間違えるとPATHが通らないので注意してください。)                  
  4. ユーザー環境変数に新たに変数が追加されていることを確認し、”OK”を押し、変数の編集を完了します。
  5. 次にflutterファイル内にある”flutter_console”を開き、「flutter doctor」を入力しEnterを押します。                       
  6. 以下の画像のようになればPATHの設定は終了です。   

コメント