From a8731d065127a1403500e1ac5c2126fddcda9004 Mon Sep 17 00:00:00 2001
From: Tim Neutkens <tim@timneutkens.nl>
Date: Sun, 5 Feb 2017 00:13:23 +0100
Subject: [PATCH] Added universal configuration example (#991)

* Added universal configuration example

* Make example more clear
---
 .../with-universal-configuration/.babelrc     |  8 ++++++
 .../with-universal-configuration/README.md    | 28 +++++++++++++++++++
 .../env-config.js                             |  5 ++++
 .../with-universal-configuration/package.json | 17 +++++++++++
 .../pages/index.js                            |  5 ++++
 5 files changed, 63 insertions(+)
 create mode 100644 examples/with-universal-configuration/.babelrc
 create mode 100644 examples/with-universal-configuration/README.md
 create mode 100644 examples/with-universal-configuration/env-config.js
 create mode 100644 examples/with-universal-configuration/package.json
 create mode 100644 examples/with-universal-configuration/pages/index.js

diff --git a/examples/with-universal-configuration/.babelrc b/examples/with-universal-configuration/.babelrc
new file mode 100644
index 00000000..e1580ad7
--- /dev/null
+++ b/examples/with-universal-configuration/.babelrc
@@ -0,0 +1,8 @@
+{
+  "presets": [
+    "next/babel"
+  ],
+  "plugins": [
+    ["transform-define", "./env-config.js"]
+  ]
+}
diff --git a/examples/with-universal-configuration/README.md b/examples/with-universal-configuration/README.md
new file mode 100644
index 00000000..2331fc2e
--- /dev/null
+++ b/examples/with-universal-configuration/README.md
@@ -0,0 +1,28 @@
+
+# With universal configuration
+
+## How to use
+
+Download the example [or clone the repo](https://github.com/zeit/next.js):
+
+```bash
+curl https://codeload.github.com/zeit/next.js/tar.gz/master | tar -xz --strip=2 next.js-master/examples/basic-css
+cd basic-css
+```
+
+Install it and run:
+
+```bash
+npm install
+npm run dev
+```
+
+Deploy it to the cloud with [now](https://zeit.co/now) ([download](https://zeit.co/download))
+
+```bash
+now
+```
+
+## The idea behind the example
+
+This example show how to set custom environment variables for your application based on NODE_ENV using [transform-define](https://github.com/FormidableLabs/babel-plugin-transform-define).
diff --git a/examples/with-universal-configuration/env-config.js b/examples/with-universal-configuration/env-config.js
new file mode 100644
index 00000000..47555f89
--- /dev/null
+++ b/examples/with-universal-configuration/env-config.js
@@ -0,0 +1,5 @@
+const prod = process.env.NODE_ENV === 'production'
+
+module.exports = {
+  'BACKEND_URL': prod ? 'https://api.example.com' : 'https://localhost:8080'
+}
diff --git a/examples/with-universal-configuration/package.json b/examples/with-universal-configuration/package.json
new file mode 100644
index 00000000..88e3be23
--- /dev/null
+++ b/examples/with-universal-configuration/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "with-env",
+  "version": "1.0.0",
+  "scripts": {
+    "dev": "next",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "next": "^2.0.0-beta"
+  },
+  "devDependencies": {
+    "babel-plugin-transform-define": "^1.2.0"
+  },
+  "author": "",
+  "license": "ISC"
+}
diff --git a/examples/with-universal-configuration/pages/index.js b/examples/with-universal-configuration/pages/index.js
new file mode 100644
index 00000000..afb3c4ee
--- /dev/null
+++ b/examples/with-universal-configuration/pages/index.js
@@ -0,0 +1,5 @@
+/* global BACKEND_URL */
+
+export default () => (
+  <div>Loading data from { BACKEND_URL }</div>
+)