dotenvの環境設定
dotenvとは環境変数を.envファイルからロードするためのパッケージです。.envファイルにはパスワードなどの機密データを格納して管理できます。gitにソースコードをアップロードするときにアップロードしないように設定できます。
LaravelやReact、Djangoなどいろんなフレームワークやライブラリーなどで容易に導入できて幅広く使われています。
dotenvのインストール
dotenvをインストールします。以下のコマンドをターミナルで実行します。
npm i dotenv
dotenvを使ってみる
dotenvをインストールしたら、早速使ってみます。ソースコードは以下の記事で動作確認に使ったapp.tsを使います。
コードを眺めてみるとportが変数で3000が代入されています。では変数portの値を.envファイルで管理できるようにします。
import express from "express";
const app = express();
const port = 3000;
app.get("/", (req, res) => {
res.send("<H1>Hello World!</H1>");
});
app.listen(port, () => {
console.log(`Example app listening on port ${port}`);
});まずは.envファイルを作成します。以下のコマンドをターミナルで実行します。
touch .env
.envファイルにPORTを3000で指定しておきます。
PORT=3000
次にdotenvをインポートします。変数portはいらないので削除してdotenv.config();を追加します。そして.envファイルの値を参照するために9行目と10行目のportをprocess.env.PORTに変更します。
import dotenv from "dotenv"; //ここを追加
import express from "express";
const app = express();
dotenv.config(); //ここを追加
// const port = 3000; ここを削除
app.get("/", (req, res) => {
res.send("<H1>Hello World!</H1>");
});
app.listen(process.env.PORT, () => { // ここを変更
console.log(`Example app listening on port ${process.env.PORT}`); // ここを変更
});コードを変更したら、以下のコマンドでnodemonを実行します。
npm run nodemon
そうすると変更前と同じように実行できました。.envファイルの値が反映されているか確かめてみます。ウィンドウの上部を見るとlocalhost:3000で接続してことが分かります。
.envファイルのPORTの値を3000から4000に変更して再び実行してみます。
# PORT=3000 PORT=4000
ウィンドウの上部を見ると.envファイルのPORTの値が反映されて、localhost:4000で接続してことが分かります。
次回はMySQLを容易に扱えるようなパッケージを導入します。
