Flutterをインストールしてみた（Mac）

FlutterでHello, Worldをしてみました。

インストール方法から、動かすまでの開発ログです。


# FlutterをMacにインストールする

## 1. Flutterのインストールページにアクセス

[Flutterのインストールページ](https://flutter.dev/docs/get-started/install)にアクセスする


<img width="1439" alt="スクリーンショット 2020-07-14 20.08.57.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/238739/cb4ef99e-8122-78b5-9428-5c2553a73732.png">


## 2. Flutterが使える環境かどうか確認する

- MacOS(64bit)
- 2.8GB以上の空きスペースがあること
- 下記のコマンドが使用可能であること
    - bash
    - curl
    - git 2.x
    - mkdir
    - rm
    - unzip
    - which
    - zip

<img width="1440" alt="スクリーンショット 2020-07-14 20.15.59.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/238739/a9d4ef97-737f-6a30-2539-1b1445113a01.png">



## 3. Flutter SDKをインストールする

### 3-1. Flutter SDKをダウンロードする

Flutter SDKをダウンロードします。なかなか時間がかかります。（30分くらい）

<img width="1440" alt="スクリーンショット 2020-07-14 20.16.47.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/238739/919976d3-3fe0-bb13-60e3-dfeab517f317.png">

### 3-2. Flutter SDKをインストールするディレクトリを作成する

```bash

$ mkdir ~/flutter
$ cd ~/flutter 
```

### 3-3. ダウンロードしたZIPを解凍する

```bash

$ unzip ~/Downloads/flutter_macos_1.17.5-stable.zip  # 1.17.5の部分はバージョンなので、1.17.5ではない場合もあります
```

### 3-4. パスを通す


bashの人は `~/.bashrc`、zshの人は `~/.zshrc`に下記を追加してください。

どちらかわからない人はおそらく `~/.bashrc`だと思います。

※ `{ユーザー名}`は各自のPCのユーザー名を入れてください。

```bash

export PATH="$PATH:/Users/{ユーザー名}/flutter/flutter/bin" 
```

その後、下記のコマンドを打ってください

```bash
$ source ~/.bashrc # bashの人、bashかzshか分からない人は多分こっち
$ source ~/.zshrc # zshの人

```


### 3-5. インストールできたことを確認する

Flutterのバージョンを確認して、バージョンが表示されれば問題なくインストールされています！

```
$ flutter --version    
Flutter 1.17.5 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 8af6b2f038 (2 weeks ago) • 2020-06-30 12:53:55 -0700
Engine • revision ee76268252
Tools • Dart 2.8.4

  ╔════════════════════════════════════════════════════════════════════════════╗
  ║                 Welcome to Flutter! - https://flutter.dev                  ║
  ║                                                                            ║
  ║ The Flutter tool uses Google Analytics to anonymously report feature usage ║
  ║ statistics and basic crash reports. This data is used to help improve      ║
  ║ Flutter tools over time.                                                   ║
  ║                                                                            ║
  ║ Flutter tool analytics are not sent on the very first run. To disable      ║
  ║ reporting, type 'flutter config --no-analytics'. To display the current    ║
  ║ setting, type 'flutter config'. If you opt out of analytics, an opt-out    ║
  ║ event will be sent, and then no further information will be sent by the    ║
  ║ Flutter tool.                                                              ║
  ║                                                                            ║
  ║ By downloading the Flutter SDK, you agree to the Google Terms of Service.  ║
  ║ Note: The Google Privacy Policy describes how data is handled in this      ║
  ║ service.                                                                   ║
  ║                                                                            ║
  ║ Moreover, Flutter includes the Dart SDK, which may send usage metrics and  ║
  ║ crash reports to Google.                                                   ║
  ║                                                                            ║
  ║ Read about data we send with crash reports:                                ║
  ║ https://flutter.dev/docs/reference/crash-reporting                         ║
  ║                                                                            ║
  ║ See Google's privacy policy:                                               ║
  ║ https://policies.google.com/privacy                                        ║
  ╚════════════════════════════════════════════════════════════════════════════╝
```

# 終わりに

以上で、Flutterのインストールが完了しました！

Flutterを使用するには、Android StudioやXCodeなどのインストール・セットアップが必要なので、それが未完了の方は調べながらやってみてください！