diff --git a/package.json b/package.json
index 640c161..b5a2409 100644
--- a/package.json
+++ b/package.json
@@ -94,6 +94,7 @@
     "sinon": "^7.2.0",
     "style-loader": "^0.23.1",
     "webpack": "^4.27.1",
+    "webpack-cli": "^3.1.2",
     "webpack-dev-server": "^3.1.10",
     "webpack-hot-middleware": "^2.19.1"
   },
diff --git a/playground/app/conf/index.js b/playground/app/conf/index.js
index 4447c3f..5cb9dde 100644
--- a/playground/app/conf/index.js
+++ b/playground/app/conf/index.js
@@ -1,82 +1,7 @@
-const schema = {
-  type: "object",
-  title: "Encounter",
-  required: ["firstName", "password", "nickName"],
-  properties: {
-    encounter: {
-      type: "string",
-      title: "Encounter",
-    },
-    firstName: {
-      type: "string",
-      title: "First name",
-    },
-    lastName: {
-      type: "string",
-      title: "Last name",
-    },
-    age: {
-      type: "integer",
-      title: "Age",
-    },
-    nickName: {
-      type: "string",
-      title: "nickname",
-    },
-    bio: {
-      type: "string",
-      title: "Bio",
-    },
-    password: {
-      type: "string",
-      title: "Password",
-      minLength: 3,
-    },
-    telephone: {
-      type: "string",
-      title: "Telephone",
-      minLength: 10,
-    },
-  },
-};
-
-const uiSchema = {
-  encounter: {
-    nav: "Encounter",
-  },
-  firstName: {
-    nav: "First name",
-  },
-  lastName: {
-    nav: "Last name",
-  },
-  age: {
-    nav: "Age",
-  },
-  nickName: {
-    type: "string",
-    nav: "nickname",
-  },
-  bio: {
-    type: "string",
-    nav: "Bio",
-  },
-  password: {
-    type: "string",
-    nav: "Password",
-    minLength: 3,
-  },
-  telephone: {
-    nav: "Telephone",
-  },
-};
+import schema from "./schema.json";
+import uiSchema from "./uiSchema.json";
 
-const formData = {
-  encounter: "Some",
-  lastName: "",
-  firstName: "",
-  age: 20,
-};
+const formData = {};
 
 export default {
   schema,
diff --git a/playground/app/conf/schema.json b/playground/app/conf/schema.json
new file mode 100644
index 0000000..bec20b1
--- /dev/null
+++ b/playground/app/conf/schema.json
@@ -0,0 +1,45 @@
+{
+  "type": "object",
+  "title": "Encounter",
+  "required": [
+    "firstName",
+    "password",
+    "nickName"
+  ],
+  "properties": {
+    "encounter": {
+      "type": "string",
+      "title": "Encounter"
+    },
+    "firstName": {
+      "type": "string",
+      "title": "First name"
+    },
+    "lastName": {
+      "type": "string",
+      "title": "Last name"
+    },
+    "age": {
+      "type": "integer",
+      "title": "Age"
+    },
+    "nickName": {
+      "type": "string",
+      "title": "nickname"
+    },
+    "bio": {
+      "type": "string",
+      "title": "Bio"
+    },
+    "password": {
+      "type": "string",
+      "title": "Password",
+      "minLength": 3
+    },
+    "telephone": {
+      "type": "string",
+      "title": "Telephone",
+      "minLength": 10
+    }
+  }
+}
diff --git a/playground/app/conf/uiSchema.json b/playground/app/conf/uiSchema.json
new file mode 100644
index 0000000..f4a023e
--- /dev/null
+++ b/playground/app/conf/uiSchema.json
@@ -0,0 +1,30 @@
+{
+  "encounter": {
+    "nav": "Encounter"
+  },
+  "firstName": {
+    "nav": "First name"
+  },
+  "lastName": {
+    "nav": "Last name"
+  },
+  "age": {
+    "nav": "Age"
+  },
+  "nickName": {
+    "type": "string",
+    "nav": "nickname"
+  },
+  "bio": {
+    "type": "string",
+    "nav": "Bio"
+  },
+  "password": {
+    "type": "string",
+    "nav": "Password",
+    "minLength": 3
+  },
+  "telephone": {
+    "nav": "Telephone"
+  }
+}
diff --git a/webpack.config.dist.js b/webpack.config.dist.js
index b8c5963..7760220 100644
--- a/webpack.config.dist.js
+++ b/webpack.config.dist.js
@@ -1,5 +1,5 @@
-var webpack = require("webpack");
-var path = require("path");
+const webpack = require('webpack');
+const path = require('path');
 
 module.exports = {
     cache: true,
@@ -29,7 +29,7 @@ module.exports = {
         }
     },
     module: {
-        loaders: [
+        rules: [
             {
                 test: /\.js$/,
                 loaders: ["babel-loader"],
diff --git a/webpack.config.js b/webpack.config.js
index b9840d1..be179f5 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,7 +1,8 @@
-var path = require("path");
-var webpack = require("webpack");
+const path = require('path');
+const webpack = require('webpack');
 
 module.exports = {
+  mode: 'development',
   devtool: "eval-source-map",
   entry: [
     "./playground/app",
diff --git a/webpack.config.prod.js b/webpack.config.prod.js
index da0ea89..9a98943 100644
--- a/webpack.config.prod.js
+++ b/webpack.config.prod.js
@@ -3,6 +3,7 @@ var webpack = require("webpack");
 var ExtractTextPlugin = require("extract-text-webpack-plugin");
 
 module.exports = {
+    mode: 'development',
     entry: path.join(__dirname, "playground/app"),
     output: {
         path: path.join(__dirname, "build"),
@@ -24,7 +25,7 @@ module.exports = {
       extensions: [".js", ".jsx", ".css"],
     },
     module: {
-        loaders: [
+        rules: [
             {
                 test: /\.jsx?$/,
                 loader: "babel-loader",