From 34f464ca830e05fd3c907d189dfc3bec67a3af34 Mon Sep 17 00:00:00 2001
From: Nisar Hassan Naqvi <syednisarhassan12@gmail.com>
Date: Sat, 24 Oct 2020 17:34:02 +0000
Subject: [PATCH] feat: simplifies code contributions by automating the dev
 setup

---
 .gitpod.yml          | 6 ++++++
 README.md            | 1 +
 styleguide.config.js | 7 +++++--
 3 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 .gitpod.yml

diff --git a/.gitpod.yml b/.gitpod.yml
new file mode 100644
index 00000000..7a3be1d7
--- /dev/null
+++ b/.gitpod.yml
@@ -0,0 +1,6 @@
+tasks:
+  - init: yarn install && yarn run build
+    command: yarn run start
+ports:
+  - port: 8080
+    onOpen: open-preview
diff --git a/README.md b/README.md
index 982b3a42..c0f40b34 100644
--- a/README.md
+++ b/README.md
@@ -7,6 +7,7 @@
 [![codecov](https://img.shields.io/codecov/c/gh/react-dropzone/react-dropzone/master.svg?style=flat-square)](https://codecov.io/gh/react-dropzone/react-dropzone)
 [![Open Collective](https://img.shields.io/opencollective/backers/react-dropzone.svg?style=flat-square)](#backers)
 [![Open Collective](https://img.shields.io/opencollective/sponsors/react-dropzone.svg?style=flat-square)](#sponsors)
+[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/react-dropzone/react-dropzone) 
 
 Simple React hook to create a HTML5-compliant drag'n'drop zone for files.
 
diff --git a/styleguide.config.js b/styleguide.config.js
index af5fec2f..44d61c18 100644
--- a/styleguide.config.js
+++ b/styleguide.config.js
@@ -1,12 +1,15 @@
 /* eslint import/no-extraneous-dependencies: 0 */
 const path = require('path')
-const { createConfig, babel, css } = require('webpack-blocks')
+const { createConfig, babel, css, devServer } = require('webpack-blocks')
 
 // https://react-styleguidist.js.org/docs/configuration.html
 module.exports = {
   title: 'react-dropzone',
   styleguideDir: path.join(__dirname, 'styleguide'),
-  webpackConfig: createConfig([babel(), css()]),
+  webpackConfig: createConfig([babel(), css(), devServer({
+    disableHostCheck: true,
+    host: '0.0.0.0',
+  })]),
   exampleMode: 'expand',
   usageMode: 'expand',
   showSidebar: false,