リモートUbuntu20.04にFlutter環境構築

# はじめに
## 対象読者
* ローカルに開発環境入れるのが嫌な人
* ローカルに仮想環境つくるのも嫌な人

## どこまでの範囲の記事か
* Ubuntu 20.04 に Flutter インストールする
* VisualStudioCode でプロジェクト弄るところは次回記事で予定

## 環境
* Ubuntu 20.04
* nested virtualization 対応
    * これに対応していることによって Android Studio のエミュレータがリモートで起動できます
    * 対応サービスの例
        * GCE ( Google Compute Engine ) の N1 or N2 インスタンス
            * 参考記事 : [GCEでNestedVirtualization対応のUbuntuインスタンスを立てる](https://qiita.com/Hi_Noguchi/items/c75f7a73c3538c117f43)
        * Azure の fvs2 あたりが

## 前準備
### ユーザー作成
* よしなに

### タイムゾーン設定
* リージョンによりけり、必要に応じて

```sh
sudo timedatectl set-timezone Asia/Tokyo
```

### パッケージ更新
```sh
sudo apt update
sudo apt upgrade
```


### パッケージインストール
```sh
sudo apt install bash clang curl git libcanberra-gtk-module libglu1-mesa unzip xz-utils zip
```

### ネットワーク設定
* リモートデスクトップ接続用に 3389 ポートは開放しておく

### swap メモリを追加
* このまま進んでいくとメモリ不足でつらいことになるので……
* 物理メモリ／ suwap メモリの確認方法

```sh
free -m
```

```
              total        used        free      shared  buff/cache   available
Mem:           1986         849          86          16        1050         936
Swap:             0           0           0
```

* cd で swapfile 作成するところに移動した後で以下を実行
    * *** G のところが容量。 5GB 追加したければ、 5G と入力

```sh
sudo fallocate -l 5G /swapfile
sudo chmod 600 /swapfile
sudo mkswap /swapfile
sudo swapon /swapfile
```

* /etc/fstab に下記の1行を追加

```:/etc/fstab
/swapfile none swap sw 0 0
```

* 再起動

```sh
sudo shutdown -r now
```


# インストール
## Flutter
### 公式ドキュメント
* https://flutter.dev/docs/get-started/install/linux

### ダウンロード
* 以下すべて username は自身のユーザ名で

```sh
cd /home/username/
wget https://storage.googleapis.com/flutter_infra/releases/stable/linux/flutter_linux_1.17.1-stable.tar.xz
```

### 展開
```sh
tar xf flutter_linux_1.17.1-stable.tar.xz
```

### 圧縮ファイル削除
```sh
rm flutter_linux_1.17.1-stable.tar.xz
```

### PATH を通す
* flutter の PATH を通す
* ついでに .bashrc を読み込む設定も入れておく

```sh
vi /home/username/.bash_profile
```

```vim:.bash_profile
export PATH=/home/username/flutter/bin:$PATH
source ~/.bashrc
```

### PATH 確認
* 一度セッション切断して再度ログインした後に

```sh
echo $PATH
```

```sh
/home/username/flutter/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin
```

### flutter コマンド確認
* command not found とならなければ OK

```sh
flutter
```


## Android Studio
### ダウンロード
* くどいようですが username は自身のユーザ名
* 最新版は以下にてご確認を
    * https://developer.android.com/studio

```sh
cd /home/username/
wget https://redirector.gvt1.com/edgedl/android/studio/ide-zips/3.6.3.0/android-studio-ide-192.6392135-linux.tar.gz
```

### 展開
```sh
sudo tar -xzvf android-studio-ide-192.6392135-linux.tar.gz -C /usr/local/
```

### 不要圧縮ファイル削除
```sh
rm android-studio-ide-192.6392135-linux.tar.gz
```

### セットアップ
```sh
/usr/local/android-studio/bin/studio.sh
```

### 参考
* [Flutter デスクトップアプリ環境構築 for Linux](https://qiita.com/kurun_pan/items/47c25a4b2425725bc199)


## Android Studio 起動用のエイリアス作成
### .bash_aliases 作成
* 起動したいコマンドは任意で

```sh
cd /home/username/
vi .bash_aliases
```

```sh:.bash_aliases
alias androidst='/usr/local/android-studio/bin/studio.sh'
alias androidstd='/usr/local/android-studio/bin/studio.sh'
alias androidstudio='/usr/local/android-studio/bin/studio.sh'
```

### 実行確認
* 一度セッションを切断して再接続した後で、登録したコマンドを実行して command not found とならず Android Studio が起動してくれれば OK


## Flutter プラグイン導入
* Android Studio を起動
* Configures > Plugins > Flutter
    * Dart も一緒にインストールされる
* Android Studio 再起動


## flutter doctor の実行
### flutter doctor で項目チェック
```sh
flutter doctor
```

### Android Licenses の同意
```sh
flutter doctor --android-licenses
```

## Android エミュレータの用意
### 前準備
* これをおこなわずに進むとエミュレータ作成途中で permission denied となって詰む
* 以下 adduser username のところは自身のユーザ名を指定

```sh
sudo apt install qemu-kvm
sudo adduser username kvm
```

* 参考
    * [ubuntu 18.04 /dev/kvm permission denied について](https://qiita.com/ceratophry/items/0b2a974f3c02a2d4b23c)

### エミュレータ作成
* Android Studio 起動
* Configure > AVD Manager > + Create Virtual Device
* 任意の端末を選択
    * Google Pixel 3a XL とか
* Android OS ver. を選択 + download
* next > finish


# おわりに
## 次回記事の予定
* VisualStudioCode でプロジェクト弄るところへ進める予定

## 感想
* Dart は別個にインストールしなくてもよいのですね。へー
* GUI 環境必要なのでは、と思って環境構築したけれど、 Android Studio は CLI からでも起動してくれたので、別に GUI 環境要らなかった…… GUI 環境の構築については、以下のオマケに記述しています。



# オマケ : Ubuntu GUI デスクトップ環境
## インストール
### パッケージインストール
```sh
sudo apt install gnome-session gdm3
```

### 再起動
```sh
sudo shutdown -r now
```

### インストール続き
```sh
sudo apt install tasksel
sudo tasksel install ubuntu-desktop
```

### 再起動
```sh
sudo shutdown -r now
```

### リモートデスクトップ接続を受けられるようにする
```sh
sudo apt install xrdp

cat <<EOF > ~/.xsessionrc
export GNOME_SHELL_SESSION_MODE=ubuntu
export XDG_CURRENT_DESKTOP=ubuntu:GNOME
export XDG_DATA_DIRS=/usr/share/ubuntu:/usr/local/share:/usr/share:/var/lib/snapd/desktop
export XDG_CONFIG_DIRS=/etc/xdg/xdg-ubuntu:/etc/xdg
EOF

sudo sed -e 's/^new_cursors=true/new_cursors=false/g' -i /etc/xrdp/xrdp.ini

cat <<EOF | \
sudo tee /etc/polkit-1/localauthority/50-local.d/xrdp-color-manager.pkla
[Netowrkmanager]
Identity=unix-user:*
Action=org.freedesktop.color-manager.create-device
ResultAny=no
ResultInactive=no
ResultActive=yes
EOF

sudo systemctl restart xrdp
sudo systemctl restart polkit
```

### リモートデスクトップ接続用にパスワード設定
```sh
sudo passwd username
```

### 参考
* [How to install Gnome on Ubuntu 20.04 LTS Focal Fossa](https://linuxconfig.org/how-to-install-gnome-on-ubuntu-20-04-lts-focal-fossa)
* [Ubuntu/WindowsからUbuntuにリモートデスクトップ接続する](https://linux.just4fun.biz/?Ubuntu/Windows%E3%81%8B%E3%82%89Ubuntu%E3%81%AB%E3%83%AA%E3%83%A2%E3%83%BC%E3%83%88%E3%83%87%E3%82%B9%E3%82%AF%E3%83%88%E3%83%83%E3%83%97%E6%8E%A5%E7%B6%9A%E3%81%99%E3%82%8B)


## リモートデスクトップ接続
### Windows の場合
* 「リモートデスクトップ接続」を使用
    * 資格情報保存にチェック
        * これでやらないとパスワードのペーストができない……
    * ユーザー入力
    * パスワード入力
    * オプション > 画面の色 > High Color ( 16 bit )
        * 最高品質にすると遅延でつらい

### Mac の場合
* 「Microsoft Remote Desktop」などを使用
    * 詳細は Windows の場合に準じる