diff --git a/.babelrc b/.babelrc
index 9f41d3bc8b..43e170a0a5 100644
--- a/.babelrc
+++ b/.babelrc
@@ -16,6 +16,9 @@
     }]
   ],
   "env": {
+    "development": {
+      "plugins": "react-hot-loader/babel"
+    },
     "test": {
       "plugins": [
         ["istanbul", { "include": ["src"] }]
diff --git a/package.json b/package.json
index 468f74c84d..b37dad9c6a 100644
--- a/package.json
+++ b/package.json
@@ -68,7 +68,6 @@
     "babel-loader": "^7.0.0",
     "babel-plugin-istanbul": "^4.1.4",
     "babel-plugin-lodash": "^3.2.10",
-    "babel-plugin-react-transform": "^2.0.2",
     "babel-plugin-transform-react-handled-props": "^0.2.3",
     "babel-plugin-transform-react-remove-prop-types": "^0.3.2",
     "babel-plugin-transform-runtime": "^6.15.0",
@@ -122,6 +121,7 @@
     "react-docgen": "^2.13.0",
     "react-document-title": "^2.0.2",
     "react-dom": "15.5.4",
+    "react-hot-loader": "^3.0.0-beta.7",
     "react-router": "^4.0.0",
     "react-router-dom": "^4.0.0",
     "react-test-renderer": "^15.5.4",
diff --git a/webpack.config.js b/webpack.config.js
index d5577b896c..cb2d9342c1 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -44,6 +44,7 @@ const APP_ENTRY = paths.docsSrc('index.js')
 
 webpackConfig.entry = __DEV__ ? {
   app: [
+    'react-hot-loader/patch',
     webpackHotMiddlewareEntry,
     APP_ENTRY,
   ],
@@ -165,18 +166,21 @@ if (!__TEST__) {
 // ------------------------------------
 // Rules
 // ------------------------------------
+const jsLoaders = [{
+  loader: 'babel-loader',
+  options: {
+    cacheDirectory: true,
+  },
+}]
+if (__DEV__) jsLoaders.unshift('react-hot-loader/webpack')
+
 webpackConfig.module.rules = [...webpackConfig.module.rules, {
   //
   // Babel
   //
   test: /\.js$/,
   exclude: /node_modules/,
-  use: {
-    loader: 'babel-loader',
-    options: {
-      cacheDirectory: true,
-    },
-  },
+  use: jsLoaders,
 }]
 
 module.exports = webpackConfig