diff --git a/package.json b/package.json
index 097f94abee..847d6d95eb 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
     "babel-loader": "^8.0.6",
     "body-parser": "^1.19.0",
     "compression": "^1.7.4",
+    "connect-history-api-fallback": "^1.6.0",
     "cookie-parser": "^1.4.5",
     "date-fns": "^2.14.0",
     "dotenv": "^6.0.0",
diff --git a/src/index.js b/src/index.js
index 8683460450..e053cfc28a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,6 +3,7 @@ require('isomorphic-fetch');
 
 const path = require('path');
 const express = require('express');
+const history = require('connect-history-api-fallback');
 const graphQLPlayground = require('graphql-playground-middleware-express').default;
 const getConfig = require('./utilities/getConfig');
 const authenticate = require('./express/middleware/authenticate');
@@ -55,8 +56,10 @@ class Payload {
 
     // Initialize Admin panel
     if (!this.config.admin.disable && process.env.NODE_ENV !== 'test') {
+      this.express.use(`${this.config.routes.admin}`, history());
+
       if (process.env.NODE_ENV === 'production') {
-        this.express.use(this.config.routes.admin, express.static(path.resolve(process.cwd(), 'build')));
+        this.express.use(`${this.config.routes.admin}`, express.static(path.resolve(process.cwd(), 'build')));
       } else {
         this.express.use(this.initWebpack());
       }
diff --git a/src/webpack/getWebpackDevConfig.js b/src/webpack/getWebpackDevConfig.js
index 8c83949e25..d8e0d2ed95 100644
--- a/src/webpack/getWebpackDevConfig.js
+++ b/src/webpack/getWebpackDevConfig.js
@@ -14,7 +14,7 @@ module.exports = (config) => {
     },
     output: {
       path: '/',
-      publicPath: '/static',
+      publicPath: config.routes.admin,
       filename: '[name].js',
     },
     devServer: {
diff --git a/src/webpack/init.js b/src/webpack/init.js
index 359136b166..3877abe67f 100644
--- a/src/webpack/init.js
+++ b/src/webpack/init.js
@@ -16,15 +16,6 @@ function initWebpack() {
 
   router.use(webpackHotMiddleware(compiler));
 
-  router.get(`${this.config.routes.admin}*`, (req, res, next) => {
-    compiler.outputFileSystem.readFile('/index.html', (err, result) => {
-      if (err) {
-        return next(err);
-      }
-      return res.set('content-type', 'text/html').send(result);
-    });
-  });
-
   return router;
 }
 
diff --git a/yarn.lock b/yarn.lock
index 6c5d2f1799..c02fe9961b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2827,6 +2827,11 @@ confusing-browser-globals@^1.0.5:
   resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.9.tgz#72bc13b483c0276801681871d4898516f8f54fdd"
   integrity sha512-KbS1Y0jMtyPgIxjO7ZzMAuUpAKMt1SzCL9fsrKsX6b0zJPTaT0SiSPmewwVZg9UAO83HVIlEhZF84LIjZ0lmAw==
 
+connect-history-api-fallback@^1.6.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc"
+  integrity sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==
+
 console-browserify@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/console-browserify/-/console-browserify-1.2.0.tgz#67063cef57ceb6cf4993a2ab3a55840ae8c49336"