Next.jsにて環境変数を用いて、APIのURLを変更する方法 - Qiita

概要 SPA構成のシステムを開発する際に、本番環境や開発環境によってAPIのURLが変わるので、それを環境ごとに切り替えたい！ってことよくありますよね。 こういう場合は環境変数を用いて使用するURLを切り替えるのがオーソドックスなのですが、Next.jsだと環境変数の取り扱いが少し変わってくるので、それを今回まとめてみました！ やりたいこと 以下の3種類の環境のAPIを用意しています。 1. 本番環境用のAPI (production) 2. 開発環境用のAPI (development) 3. 開発環境用のモックAPI (swagger) 3つ目のモックAPIはOpenAPI(swagger)と呼ばれるもので、スキーマを用いてAPIを定義するだけで擬似的にAPIを使用することができます。 サーバーサイドのAPIの開発を待ってからフロントのAPI関連の実装をすると効率が悪いので、swagg

[winterfall]

“// NODE_ENVの値 - 「next dev」コマンドでは、developmentの値が設定される - 「next build」、「next start」コマンドでは、productionの値が設定される - 「jest」実行時は、testの値が設定される”