【Flutter学習 #1】環境構築　その１

# はじめに
この記事はFlutter初心者の筆者が学習のために書いている記事です。
間違っていたら温かくご指摘いただけるとありがたいです。

# 動作環境
* PC：Macbook
* CPU：Intel
* OS：MacOS Ventura 13.3.1

# Flutter SDKをインストール
[Flutter公式サイト](https://docs.flutter.dev/get-started/install/macos)からインストーラーを使ってインストールするという手もありますが、今回はHomebrewを使ってインストールしていきます。

ターミナルで以下のコマンドを実行します。

```
brew install flutter
```

以下のコマンドを実行してバージョンが表示されれば完了です。

```
flutter --version
```

次に、以下のコマンドを実行してみます。

```
flutter doctor
```

すると、私の場合は以下のようなメッセージが返ってきました。
iOSとAndroidのセットアップが必要になります。
![スクリーンショット 2023-05-10 22.34.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/6bd49ed1-d4a2-6d91-15cc-2f67e4ea7989.png)

# iOSをセットアップ

* ### Xcodeをインストール
私は既にインストール済みでしたので割愛しますが、Xcodeがインストールされていない場合はAppStoreからインストールしてください。

インストールが終わったら、flutter doctorでも出てきているように以下の2つのコマンドを実行します。

```
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch
```

* ### cocoapodsをインストール
ターミナルで以下のコマンドを実行します。

```
brew install cocoapods
```

# Androidのセットアップ

* ### Android Studioをインストール
Homebrewを使ってインストールしていきます。
ターミナルで以下のコマンドを実行します。

```
brew install android-studio
```

* ### Android Studioの初期設定
Android Studioを立ち上げて初期設定を行なっていきます。

![スクリーンショット 2023-05-10 23.22.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/4a7d2d37-3c0c-6527-db70-2ca9ed238071.png)
→「Do not import setting」のままOK

![スクリーンショット 2023-05-10 23.23.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/04efb2ea-5a52-a091-f12c-35f75fae5aa8.png)
→どちらを選んでもOK

![スクリーンショット 2023-05-10 23.24.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/8b112e20-2ba2-0f87-6ae1-ee2b4d2380ba.png)
→そのままNext

![スクリーンショット 2023-05-10 23.25.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/b26f5da3-cee3-b706-719e-71b7eb1ba7d7.png)
→StandardのままNext

![スクリーンショット 2023-05-10 23.25.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/12a9a6dd-0de3-f0d4-3530-e0228d246904.png)
→どちらかを選んでNext

![スクリーンショット 2023-05-10 23.26.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/b10c700d-8c5b-dbad-c4d4-6f9645e33a69.png)
→そのままNext

![スクリーンショット 2023-05-10 23.27.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/3b6cc1fd-0a55-2fd3-3838-1460373afa64.png)
→Acceptを選択してFinish

これでコンポーネントのダウンロードが始まりますので、終わるまで待ってください。

![スクリーンショット 2023-05-10 23.35.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/f8cd0717-bf3a-631e-d56f-4d897a06c876.png)
→Finishを押して終了

次に、Welcome to Android Studioという画面が出るのでSDK Managerを選択します。
![スクリーンショット 2023-05-10 23.36.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/af2f5646-d564-2c00-0bfa-641bf00e1cc3.png)

![スクリーンショット 2023-05-10 23.40.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/6cd0f33d-fc5d-c6d4-f2f8-4fd93fcf0ef2.png)
→Android SDK Command-line Toolsにチェックを入れてOK

インストールが終わったらFinishを押して終了です。


* ### Android Licenseに同意する
ターミナルで以下のコマンドを実行します。

```
flutter doctor --android-licenses
```

何回も同意を求められますが、全部「y」を入力して同意してください。

# 確認
最後に、再度以下のコマンドを実行して確認します。

```
flutter doctor
```

オールクリアです！
![スクリーンショット 2023-05-10 23.48.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3344066/c6afa7b4-c7f4-5a51-4255-424cba172111.png)

これでFlutterのインストールは完了です。
長くなってしまったので、プロジェクトの作成以降は次回にしたいと思います。


# 最後に
急遽業務で使うことになったのでFlutterの勉強も始めてみたのですが、環境構築からなかなかめんどいですね。とはいえ、新しい技術を学ぶことはとても楽しいことなので、楽しみながらFlutterの学習記録の記事も上げていきたいと思います。