Zenn
📑

Remix の開発環境を構築する ( Volta、Node.js、Yarn、Docker Desktop )

2024/03/21に公開
Volta
Remix
tech

目的

Remix を使用したフルスタックアプリケーションの開発に向けて、開発環境を整備するため、関連ツールを導入します。

環境

環境 バージョン等
OS macOS ( Apple Chip )
shell zsh
Volta 1.1.0
Node.js 20.11.1
Yarn 4.1.1

Node.js バージョン管理ツール ( Volta )

概要
Volta は、 tool chain manager として JavaScript CLI を管理するツールなことから、 Node.js 以外にパッケージ管理ツールも管理します。
他の選択肢として nvm や n がありますが、好みの観点から Volta を導入します。

作業
Volta のインストールコマンドを実行します。

curl https://get.volta.sh | bash

zsh 設定ファイルを開きます。

vim ~/.zshrc

以下を追記します。

export VOLTA_HOME="$HOME/.volta"
export PATH="$VOLTA_HOME/bin:$PATH"

volta を有効化します。

volta setup

シェルの設定をリフレッシュする。

zsh

以下のコマンドを実行し、バージョンを確認できたら導入完了です。

volta --version

Node.js

概要
Remix 開発に必要な JavaScript ランタイム環境を提供する Node.js をインストールします。
2024/03/20 時点の最新は v21.7.1 ですが、 Node.js のリリースサイクルの観点から偶数番号のバージョンは長期サポート ( Long Term Support ) を受けられるため、v20.11.0 を選択しています。

作業
Volta を通じて、Node.js をインストールします。

volta install node@20.11.1

以下のコマンドを実行し、バージョンを確認できたら導入完了です。

node --version

パッケージ管理ツール ( Yarn )

概要
触り慣れている及び好みの観点から、 Yarn をインストールします。
パッケージ管理ツールには、 npm、 Yarn、 pnpm など選択肢があるため、好みのツールを使用すると良いでしょう。
今回は、最新バージョンの Yarn v4.1.1 を導入します。

作業
Volta を通じて、Yarn をインストールします。

volta install yarn@v4.1.1

以下のコマンドを実行し、バージョンを確認できたら導入完了です。

yarn --version

Docker Desktop

概要
今回実装するアプリケーションでは Relational Database ( RDB ) を使用します。
RDB のサーバは Homebrew でも導入可能ですが、 Docker を使用すると環境構築や RDB のバージョン管理も容易なため、 Docker Desktop を導入します。

作業
Docker Desktop からダウンロードします。

アプリを起動し、ウィザードに従い設定を進めてください。

以下のコマンドを実行し、バージョンを確認できたら導入完了です。
完了すると、Client と Server のバージョンが表示されます。

docker version

参考 URL

Discussion