【Tool】ngrokでローカル環境で実行中のコンテンツを簡単に外部公開する方法

# ngrokとは？
ngrok（エングロック）とはnginxをベースにしたローカル上で動かしているコンテンツを外部に簡単に公開できるサービスです。
今回はこのサービスの最低限の利用方法を紹介したいと思います。

# 利用方法
## 1.Homebrewを使用しngrokをインストール
```terminal
$ brew install ngrok --cask
```

## 2.インストールの確認
以下のコマンドでバージョンを確認します。
バージョンが表示して、問題なくインストールされているか確認してください。
```terminal
$ ngrok -v
ngrok version 2.3.29
```

## 3.会員登録
以下の公式サイトから会員登録をお願いいたします。
登録確認のメールが届くので、そのメールのリンクを叩いて認証しないとサービスが利用できないので、注意してください。
https://dashboard.ngrok.com/signup

## 4.アカウントの紐付け
登録したら以下の画像の内容が表示されるので、記載のコマンドを実行してアカウントの紐付けを行なってください。
![スクリーンショット 2023-04-18 19.51.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/357475/4b44f36b-891c-819d-7a0d-e2aa43e6e03d.png)

## 5.ローカル環境で実行
各々の方法でローカル環境でコンテンツをビルドしてください。

## 6.外部環境への公開
以下のコマンドでローカルホストのポート番号を叩くと外部へ公開されます。
青字で書かれているForwardingの右のリンクを叩けば、外部端末からでもコンテンツが表示できます。
外部公開を辞めたい時は「Ctrl + C」でngrokを止めれば大丈夫です。

```terminal
$ ngrok http ポート番号
ngrok                                                                                                                                                       (Ctrl+C to quit)
                                                                                                                                                                            
Join us in the ngrok community @ https://ngrok.com/slack                                                                                                                    
                                                                                                                                                                            
Session Status                online                                                                                                                                        
Account                       ABCDEF123 (Plan: Free)                                                                                                                          
Version                       3.1.0                                                                                                                                         
Region                        Japan (jp)                                                                                                                                    
Latency                       25ms                                                                                                                                          
Web Interface                 http://127.0.0.1:4040                                                                                                                         
Forwarding                    https://XXXXXXXXXXXXXXXX -> http://localhost:8000                                                       
                                                                                                                                                                            
Connections                   ttl     opn     rt1     rt5     p50     p90                                                                                                   
                              0       0       0.00    0.00    0.00    0.00           
```

# 参考
https://labo.kon-ruri.co.jp/ngrok/
https://hirooooo-lab.com/development/https-for-localhost/