From 5639fd8517ff902babad65037818e493df243427 Mon Sep 17 00:00:00 2001
From: username <username@users.noreply.github.com>
Date: Fri, 27 Dec 2019 20:42:52 +0900
Subject: [PATCH] refactor: use dotenv

---
 .env                    |  1 +
 constants/Env.ts        |  7 +++++++
 constants/index.ts      |  1 +
 next.config.js          | 15 ++++++++++++++-
 package-lock.json       | 24 ++++++++++++++++++++++++
 package.json            |  1 +
 store/api/InputApi.ts   |  3 ++-
 store/configureStore.ts |  3 ++-
 8 files changed, 52 insertions(+), 3 deletions(-)
 create mode 100644 .env
 create mode 100644 constants/Env.ts

diff --git a/.env b/.env
new file mode 100644
index 0000000..662fe37
--- /dev/null
+++ b/.env
@@ -0,0 +1 @@
+API_SERVER_URL=http://localhost:3000
diff --git a/constants/Env.ts b/constants/Env.ts
new file mode 100644
index 0000000..00bde29
--- /dev/null
+++ b/constants/Env.ts
@@ -0,0 +1,7 @@
+/**
+ * Environment variables
+ */
+export const Env = {
+  NODE_ENV: process.env.NODE_ENV,
+  API_SERVER_URL: process.env.API_SERVER_URL,
+}
diff --git a/constants/index.ts b/constants/index.ts
index 0c3bb0a..dc5686a 100644
--- a/constants/index.ts
+++ b/constants/index.ts
@@ -1,3 +1,4 @@
+export * from "./Env"
 export * from "./IEnum"
 export * from "./Page"
 export * from "./SagaSetting"
diff --git a/next.config.js b/next.config.js
index c337735..1d42c51 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,3 +1,16 @@
 const withCSS = require("@zeit/next-css")
+const path = require("path")
+const Dotenv = require("dotenv-webpack")
 
-module.exports = withCSS()
+module.exports = withCSS({
+  webpack: config => {
+    config.plugins = [
+      ...config.plugins,
+      new Dotenv({
+        path: path.join(__dirname, ".env"),
+        systemvars: true,
+      }),
+    ]
+    return config
+  },
+})
diff --git a/package-lock.json b/package-lock.json
index 705d3a8..a0a1d1a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3246,6 +3246,30 @@
         "is-obj": "^2.0.0"
       }
     },
+    "dotenv": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-6.2.0.tgz",
+      "integrity": "sha512-HygQCKUBSFl8wKQZBSemMywRWcEDNidvNbjGVyZu3nbZ8qq9ubiPoGLMdRDpfSrpkkm9BXYFkpKxxFX38o/76w==",
+      "dev": true
+    },
+    "dotenv-defaults": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/dotenv-defaults/-/dotenv-defaults-1.0.3.tgz",
+      "integrity": "sha512-EHeXF8VZA/XhkGJCtRpJCTHC8GkoisPXjdvJMzxgFrlN6lTEW/eksRNsVKnW0BxR1pGZH8IEBO/D0mDkIrC6fA==",
+      "dev": true,
+      "requires": {
+        "dotenv": "^6.2.0"
+      }
+    },
+    "dotenv-webpack": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/dotenv-webpack/-/dotenv-webpack-1.7.0.tgz",
+      "integrity": "sha512-wwNtOBW/6gLQSkb8p43y0Wts970A3xtNiG/mpwj9MLUhtPCQG6i+/DSXXoNN7fbPCU/vQ7JjwGmgOeGZSSZnsw==",
+      "dev": true,
+      "requires": {
+        "dotenv-defaults": "^1.0.2"
+      }
+    },
     "duplexify": {
       "version": "3.7.1",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
diff --git a/package.json b/package.json
index b9dd241..77226af 100644
--- a/package.json
+++ b/package.json
@@ -40,6 +40,7 @@
     "@types/react-redux": "^7.1.5",
     "@types/redux": "^3.6.0",
     "@types/styled-jsx": "^2.2.8",
+    "dotenv-webpack": "^1.7.0",
     "prettier": "^1.19.1",
     "redux-devtools-extension": "^2.13.8",
     "tslint": "^5.20.1",
diff --git a/store/api/InputApi.ts b/store/api/InputApi.ts
index d91c993..b4229a9 100644
--- a/store/api/InputApi.ts
+++ b/store/api/InputApi.ts
@@ -1,9 +1,10 @@
+import { Env } from "../../constants"
 import { InputResponseModel } from "../../model"
 import { IReduxSagaFetchPayload } from "../redux-saga"
 
 export const fetchInputApi = (
   payload: IReduxSagaFetchPayload
 ): Promise<InputResponseModel> => {
-  const url = `http://localhost:3000/api/input?value=${payload.input}`
+  const url = `${Env.API_SERVER_URL}/api/input?value=${payload.input}`
   return fetch(url).then<InputResponseModel>(response => response.json())
 }
diff --git a/store/configureStore.ts b/store/configureStore.ts
index ec8d97e..15a2e34 100644
--- a/store/configureStore.ts
+++ b/store/configureStore.ts
@@ -1,7 +1,8 @@
+import { Env } from "../constants"
 import { InitialState } from "../store/states"
 
 const configureStoreComponent = (() => {
-  if (process.env.NODE_ENV === "production") {
+  if (Env.NODE_ENV === "production") {
     return require("./configureStore.production")
   }
   return require("./configureStore.development")