本サイトはプロモーションが含まれています

無料枠が終了するHerokuからfly.ioにポートフォリオを移行してみた【Express】

導入

先日突然発表されたHeroku無料枠終了のお知らせ。

私も含め、影響を受けた方は多いのではないでしょうか。


私の場合、Herokuにポートフォリオを無料で置いていたため、無料枠が終了するのは非常に困ります。
代わりとなるサービスを調べていると、fly.ioというサービスには無料枠があり、SSL化も無料でできるという情報を得ました。


そこで今回の記事では、無料枠が終了するHerokuから、代替サービスのfly.ioに移行する方法を紹介します。

fly.ioとは

fly.io

fly.ioとは、静的サイトからRailsやLaravel、Node.jsなどのWebアプリ、PostgreSQLデータベースまでフルスタックなアプリをデプロイできるHerokuのようなプラットフォームです。
米シカゴを本社とする2017年創業のスタートアップ企業が運営しています。

料金

料金は、仮想マシン、データベース、ネットワークで料金体系が異なります。

  • 仮想マシンの場合は、CPUとRAMのスペック
  • データベースの場合は、データ量($0.15/GB)
  • ネットワークの場合は、追加するIPアドレス数とSSL証明書の数、送信データ量

で決まります。


無料枠は豊富で、小規模なアプリであれば十分無料枠で収まります。
クレジットカードを登録しない場合はアプリ1つまで、登録するとアプリ3つまでが目安です。


無料枠で使えるのは以下の通りです。(クレジットカードを登録した場合)

仮想マシン共有CPU1つ・RAM256MBのマシンが最大3つ
データベース合計3GBまで
IPアドレスエニーキャストIPv4アドレス1つと無制限のエニーキャストIPv6アドレス
SSL証明書最大10個まで
データ転送量アウトバウンドは合計160GBまで・インバウンドは無制限

なかなか太っ腹だと思います。
詳細な料金については、公式サイトを参照してください。

Herokuからfly.ioに移行するメリット・デメリット

fly.ioは基本的にはHerokuに似ているサービスなので、Herokuからは違和感なく置き換えることができます。

メリット

Herokuの後発のサービスということもあり、Herokuに比べてメリットは大きいです。
十分な無料枠がありPostgreSQLが使え、サイトのSSL化も自動でしてくれるなどメリットが多いです。

  • Herokuで廃止予定の無料枠がある(目安はアプリ3つまで)
  • データベースはPostgreSQLでHerokuからの移行が簡単
  • データベースがインターネットに公開されていないので安心(Herokuの場合は公開されているのでSSL接続が必要)
  • 無料でSSLが使える(https化可能)
  • 無料プランで一定時間操作しなくてもスリープしない
  • 日本リージョンが存在する

デメリット

デメリットもありますが、そこまで大きくないと思います。
CLIはHerokuに近いので、Heroku CLIを使い慣れている方であれば、問題なく利用できると思います。

  • CLIでのみデプロイできる
  • 環境変数などの設定もCLIでのみ設定・削除可能


Herokuからfly.ioに移行する方法

それでは本題のHerokuからfly.ioに移行する方法を紹介します。

移行するアプリ

今回は、以前に自分のポートフォリオ用に作ったExpress製のアプリを移行します。
フレームワークにExpress、テンプレートエンジンにPug、データベースにPostgreSQLを使った基本的なWebアプリです。


アプリの使用技術の詳細は以下の通りです。


バックエンド

  • Node.js
  • Express

データベース

  • PostgreSQL
  • Sequelize

テスト

  • Jest

フロントエンド

  • jQuery
  • Bootstrap
  • Pug(テンプレートエンジン)

具体的な手順

それでは、Herokuにデプロイしたことのあるアプリをfly.ioに移行する方法を紹介します。


fly.ioはGUIではデプロイができないため、CLIでデプロイする必要があります。
今回はUbuntu20.04(WSL2)上で行っています。
それでは順に紹介していきます。

flyctlのインストール

まずターミナルを開き、以下のコマンドを入力して、CLIツールであるflyctlをインストールします。

curl -L https://fly.io/install.sh | sh

参考までに、Windowsとmacの場合も紹介します。

Windowsの場合

Windowsの場合、WSL2をインストールし、WSL2上のUbuntuで上記のコマンドを実行するほうが良いと思いますが、Windows本体に直接インストールすることもできます。
本体に直接インストールする場合、PowerShell上で以下のコマンドを入力します。

iwr https://fly.io/install.ps1 -useb | iex
macの場合

ターミナル上で以下のコマンドを入力します。


Homebrewがインストールされている場合

brew install flyctl

Homebrewがインストールされていない場合

curl -L https://fly.io/install.sh | sh

.bash_profileに環境変数を設定

flyctlをインストールすると、以下のようなメッセージが出てくると思います。

Manually add the directory to your $HOME/.bash_profile (or similar)
export FLYCTL_INSTALL="/home/{UserName}/.fly"
export PATH="$FLYCTL_INSTALL/bin:$PATH"
Run '/home/{UserName}/.fly/bin/flyctl --help' to get started

vimで.bash_profile(macの場合は.zshrc)を開き、

vim ~/.bash_profile

※macの場合

vim ~/.zshrc

iを押してインサートモードにし、先ほどのメッセージにある2行をそのままコピペして追加します。(UserNameの部分はそれぞれのユーザー名になっているはずです)

export FLYCTL_INSTALL="/home/{UserName}/.fly"
export PATH="$FLYCTL_INSTALL/bin:$PATH"

追加したらEscキーを押した後、:wqで保存して閉じます。


その後、以下のコマンドをターミナルに入力し、.bash_profile(macの場合は.zshrc)の設定を反映します。

source ~/.bash_profile

※macの場合

source ~/.zshrc

fly.ioへの会員登録(初回のみ)・ログイン(2回目以降)

初回は、ターミナルに以下のコマンドを入力して会員登録します。

flyctl auth signup

するとリンクが表示されるので、開きます。
ブラウザが立ち上がり、会員登録ページが開くので、「Sign up with GitHub」をクリックします。

会員登録画面

GitHubのログイン画面が開くので、GitHubアカウントでログインし、「Authorize fly.io」をクリックします。

GitHubログイン画面

メール認証などもあるので、認証します。
これで会員登録は完了で、ターミナル上にログインできた旨が表示されます。


2回目以降は以下のコマンドを入力し、リンクを開いてGitHubアカウントでログインすればOKです。

flyctl auth login

アプリのデプロイ

あとは、デプロイするだけです。
まず、デプロイしたいアプリがあるディレクトリに移動します。

cd {デプロイしたいアプリがあるディレクトリへのPath}

その後、初回はターミナルに以下のコマンドを入力します。

flyctl launch

すると、以下のようにfly.ioがherokuでデプロイしていたことを推測してくれるので、

Creating app in /home/{UserName}/{Your App Path}
Scanning source code
Detected a NodeJS app
Using the following build configuration:
Builder: heroku/buildpacks:20

その後表示される質問に答えていくだけです。
以下の例では、アプリ名なし(この場合自動で名前をつけてくれる)、リージョンは日本、PostgreSQLデータベースあり、無料の仮想マシンを指定しています。

? App Name (leave blank to use an auto-generated name):(空欄)
? Select region: nrt (Tokyo, Japan)
? Would you like to set up a Postgresql database now? Yes
? Select configuration: Development - Single node, 1x shared CPU, 256MB RAM, 1GB disk

しばらく待つと準備が完了し、データベースの認証情報が表示されます。
これは一度しか表示されないみたいなので、どこかにメモしておきます。

Postgres cluster *****-*****-*****-db created
Username: ******
Password: *****************
Hostname: *****-*****-*****-db.internal
Proxy Port: 5432
PG Port: 5433
Save your credentials in a secure place -- you won't be able to see them again!

しばらく待つとデプロイを今すぐ行うか確認されるので、y(Yes)と入力します。

? Would you like to deploy now? Yes

これでデプロイが完了です。


2回目以降は、デプロイしたいアプリのディレクトリに移動し、代わりに以下のコマンドを入力するだけです。

fly deploy
参考情報: デプロイ時にエラーが出る場合

デプロイ時に

Status: Downloaded newer image for heroku/heroku:20-cnb
Error executing lifecycle: io: read/write on closed pipe

というエラーが出る場合は、fly.ioにブラウザでログインし、Free builderとあるアプリ名(この場合fly-builder-floral-frog-1297)をメモします。


管理画面

その後、以下のコマンドを入力します。

fly apps destroy (先ほどメモしたビルダー名)

最後に、ローカルでデプロイしなおすと成功します。

fly deploy --local-only


環境変数の設定・削除・確認

先述の通り、環境変数の設定・削除・確認はflyctlを使って行います。
環境変数の確認はWeb上でも行うことができますが、CLIと同様に環境変数の値の確認はできません。

環境変数の設定

環境変数を設定する場合は、デプロイしたいアプリのディレクトリで以下のコマンドを入力します。

flyctl secrets set {環境変数}={環境変数の値} {環境変数}={環境変数の値} ...

例えば、環境変数secretvalueという値を設定する場合は、以下のように設定します。

flyctl secrets set secret=value

環境変数の削除

環境変数を削除したい場合は、以下のコマンドを入力します。

flyctl secrets unset {環境変数} {環境変数} ...

例えば、環境変数secretを削除する場合は、以下のコマンドを入力します。

flyctl secrets unset secret

環境変数の確認

環境変数の一覧を確認するには、以下のコマンドを入力します。
注意点としては、環境変数の値はセキュリティ上の理由から暗号化されている値のみが確認できるようになっています。

flyctl secrets list

特定のファイルを除外する場合

秘密情報を含むファイルなど、特定のファイルをデプロイしたくない場合は、.gitignoreではなく、.dockerignoreに記載します。
https://fly.io/docs/getting-started/node/#bonus-points


例えば、以下のように記載します。
(secret・testフォルダ配下のファイルを除外したい場合)

secret
test


まとめ

今回は、Herokuからfly.ioに移行するメリット・デメリットと、具体的な移行方法を紹介しました。
fly.ioは基本CLIで操作することを除けば、無料枠も大きく使いやすいサービスだと思います。


参考になったらSNSでシェアしていただけると嬉しいです!