diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json
index 4779f18eee1..e304f6e31a1 100644
--- a/packages/react-scripts/package.json
+++ b/packages/react-scripts/package.json
@@ -34,6 +34,7 @@
     "cross-spawn": "4.0.0",
     "css-loader": "0.24.0",
     "detect-port": "1.0.0",
+    "dotenv": "2.0.0",
     "eslint": "3.5.0",
     "eslint-config-react-app": "0.2.0",
     "eslint-loader": "1.5.0",
diff --git a/packages/react-scripts/scripts/build.js b/packages/react-scripts/scripts/build.js
index a0805e601ac..f8c3dda4faa 100644
--- a/packages/react-scripts/scripts/build.js
+++ b/packages/react-scripts/scripts/build.js
@@ -12,6 +12,12 @@
 // Do this as the first thing so that any code reading it knows the right env.
 process.env.NODE_ENV = 'production';
 
+// Load environment variables from .env file. Surpress warnings using silent
+// if this file is missing. dotenv will never modify any environment variables
+// that have already been set.
+// https://github.com/motdotla/dotenv
+require('dotenv').config({silent: true});
+
 var chalk = require('chalk');
 var fs = require('fs-extra');
 var path = require('path');
diff --git a/packages/react-scripts/scripts/start.js b/packages/react-scripts/scripts/start.js
index 19163169457..530e675d519 100644
--- a/packages/react-scripts/scripts/start.js
+++ b/packages/react-scripts/scripts/start.js
@@ -11,6 +11,12 @@
 
 process.env.NODE_ENV = 'development';
 
+// Load environment variables from .env file. Surpress warnings using silent
+// if this file is missing. dotenv will never modify any environment variables
+// that have already been set.
+// https://github.com/motdotla/dotenv
+require('dotenv').config({silent: true});
+
 var path = require('path');
 var chalk = require('chalk');
 var webpack = require('webpack');
diff --git a/packages/react-scripts/scripts/test.js b/packages/react-scripts/scripts/test.js
index d297e2d0c4c..8a98aad891f 100644
--- a/packages/react-scripts/scripts/test.js
+++ b/packages/react-scripts/scripts/test.js
@@ -10,6 +10,12 @@
 process.env.NODE_ENV = 'test';
 process.env.PUBLIC_URL = '';
 
+// Load environment variables from .env file. Surpress warnings using silent
+// if this file is missing. dotenv will never modify any environment variables
+// that have already been set.
+// https://github.com/motdotla/dotenv
+require('dotenv').config({silent: true});
+
 const createJestConfig = require('./utils/createJestConfig');
 const jest = require('jest');
 const path = require('path');
diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md
index 3c9952b8895..5378712fc48 100644
--- a/packages/react-scripts/template/README.md
+++ b/packages/react-scripts/template/README.md
@@ -434,7 +434,8 @@ REACT_APP_SECRET_CODE=abcdef npm start
 ```
 
 > Note: Defining environment variables in this manner is temporary for the life of the shell session. Setting
-permanent environment variables is outside the scope of these docs.
+permanent environment variables in development can be done in a `.env` file in the root of your project.
+[dotenv](https://github.com/motdotla/dotenv) takes care of loading these for you.
 
 With our environment variable defined, we start the app and consume the values. Remember that the `NODE_ENV`
 variable will be set for you automatically. When you load the app in the browser and inspect the `<input>`, you will see
diff --git a/packages/react-scripts/template/gitignore b/packages/react-scripts/template/gitignore
index 56b6cc8a311..6c96c5cff12 100644
--- a/packages/react-scripts/template/gitignore
+++ b/packages/react-scripts/template/gitignore
@@ -11,4 +11,5 @@ build
 
 # misc
 .DS_Store
+.env
 npm-debug.log