Fly.ioにPhoenix PJ構築

# Brightの対象
Webアプリ開発 Elixir > クラス1 > Elixir環境構築 > クラウド > Fly.ioにPhoenix PJ構築

# 前提
fly.ioのアカウント登録済みであること
　└クレジットカード登録済みであること

#  flyctlをインストール　(Linux)
```
$ curl -L https://fly.io/install.sh | sh
```

他のOSはこちらを参考にしてください
https://fly.io/docs/hands-on/install-flyctl/

 # Phoenix PJを構築
前提:ymnbの部分は適宜変更してください

```sh
$ mix phx.new ymnb
```
Fetch and install dependencies? [Yn] Y
と聞かれるのでY

```sh
$ cd ymnb
$ mix phx.gen.live Accounts User users name:string
```

router.exのscope "/", YmnbWeb doに追加
```diff_elixir:lib/ymnb_web/router.ex
   scope "/", YmnbWeb do
     pipe_through :browser
 
     get "/", PageController, :home
+     live "/users", UserLive.Index, :index
+     live "/users/new", UserLive.Index, :new
+     live "/users/:id/edit", UserLive.Index, :edit

+     live "/users/:id", UserLive.Show, :show
+     live "/users/:id/show/edit", UserLive.Show, :edit
  end
```

# fly.io構築
前提:コマンドラインでfly.ioにログイン済みであること　fly auth login

```sh
$ fly launch
```

下記のエラーはでますがローカルにPostgrを構築してないので表示します
が今回はfly.ioでの構築の為無視します

```
[error] Postgrex.Protocol (#PID<0.441.0>) failed to connect: **
(DBConnection.ConnectionError) 
tcp connect (localhost:5432): connection refused - :econnrefused
```

↓これを聞かれるのでy
```
 Do you want to tweak these settings before proceeding? (y/N) 
```

この画面が表示します、Databaseを変更します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/a52b97fb-6c22-99c2-8416-215151a82c15.png)

下記の用に変更しました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/789c17c7-0ddf-3363-e9ed-7d124e00510b.png)

設定完了後Confirm Settingsをクリックします

下記の画面が表示後ブラウザを閉じます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/180aa80b-ab3d-b0e6-334f-0f0585576c1c.png)

その後の処理は下記の状態で完了です（時間かかります）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/d8226d1b-105b-63a9-e7f7-a12c5be6db25.png)


Visit your newly deployed app at `https://任意の名前.fly.dev/`が表示します

# 検証
`https://任意の名前.fly.dev/`にアクセス
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/84224136-28d4-95b6-1974-e8ae0b44dab4.png)

`https://任意の名前.fly.dev/users`にアクセス
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/12a3a5ef-9c52-7447-1bd1-600e73876da3.png)


New Userをクリック後Nameに文字を入力しSeve User
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/5bb5a59c-119a-47c2-7d5c-2b87bc36a055.png)

下記のようにの表示できました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/1a724c83-f64b-ab71-1b8d-7d43a325c6ec.png)

# fly.ioからAppの消し方
https://fly.io/　
にアクセス
前提:ログイン済み

Dashboardをクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/ea7a85c4-253c-3652-6f4c-c8c34314ba14.png)

Settingsをクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/6df4ac36-644e-9a33-21b7-f6d8b1a97af2.png)

消したいアプリをクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/fa80dbf3-21df-ec26-ee12-15dd20af4d4b.png)

アプリ名を入力しYes,delete itをクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/295814/834f2fd6-d3b8-236d-43ce-e72476c3f70e.png)

これで消えました
同様手順でdbも削除できます