diff --git a/example/index.html b/example/index.html
new file mode 100644
index 0000000..108a37c
--- /dev/null
+++ b/example/index.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <title>Examples &amp; Test Scenarios</title>
+
+    <style type="text/css">
+        .tt {
+            font-family: Courier New, Courier, monospace;
+        }
+        
+        .example {
+            color: #777;
+            padding: 4px;
+        }
+    </style>
+</head>
+
+<body>
+    <h1>Examples &amp; Test Scenarios</h1>
+
+    <div id="app"></div>
+
+    <script src="/bundle.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/example/index.js b/example/index.js
new file mode 100644
index 0000000..2dc4e01
--- /dev/null
+++ b/example/index.js
@@ -0,0 +1,48 @@
+import React, { Component } from 'react';
+import ReactDOM from 'react-dom';
+
+import ReactPhoneInput from '../src';
+
+class ExampleUsageComponent extends Component {
+
+    constructor(props) {
+        super(props);
+        this.state = {
+            phone: ''
+        };
+        
+        this.handleChange = this.handleChange.bind(this);
+    }
+
+    handleChange(phone) {
+        this.setState({
+            phone: phone
+        });
+    }
+
+    render () {
+        return (
+            <div>
+                <h3>Example 1</h3>
+                <p>Demonstrates usages of 'preferredCountries' option, in conjunction with 'excludeCountries'</p>
+                <pre className="example">&lt;ReactPhoneInput defaultCountry='us' preferredCountries={['us', 'de']} excludeCountries={'in'}/&gt;</pre>
+                <ReactPhoneInput defaultCountry='us' preferredCountries={['us', 'de']} excludeCountries={'in'}/>
+                <h3>Example 2</h3>
+                <p>Demonstrates usages of 'preferredCountries' option only</p>                
+                <pre className="example">&lt;ReactPhoneInput defaultCountry='de' preferredCountries={['it']}/&gt;</pre>                
+                <ReactPhoneInput defaultCountry='de' preferredCountries={['it']}/>
+                <h3>Example 3</h3>
+                <p>Demonstrates usages of <span className="tt">onChange</span> event handler</p>
+                <pre className="example">&lt;ReactPhoneInput onChange={'{this.handleChange}'} /&gt;</pre>
+                <ReactPhoneInput onChange={this.handleChange} />
+                <p>You entered: {this.state.phone}</p>
+            </div>
+        );
+    }
+
+}
+
+ReactDOM.render(
+	<ExampleUsageComponent />,
+	document.getElementById('app')
+);
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 596e118..a14ac49 100644
--- a/src/index.js
+++ b/src/index.js
@@ -580,14 +580,4 @@ ReactPhoneInput.propTypes = {
     onKeyDown: React.PropTypes.func
 };
 
-export default ReactPhoneInput;
-
-if (__DEV__) {
-  const ReactDOM = require('react-dom');
-  ReactDOM.render(
-    <ReactPhoneInput defaultCountry='us' preferredCountries={['us', 'de']} excludeCountries={'in'}/>,
-    document.getElementById('content'));
-  ReactDOM.render(
-      <ReactPhoneInput defaultCountry='de' preferredCountries={['it']}/>,
-      document.getElementById('content'));
-}
+export default ReactPhoneInput;
\ No newline at end of file
diff --git a/webpack.config.js b/webpack.config.js
index 8b8ff00..e956ea2 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -18,8 +18,7 @@ var common = {
     filename: 'index.js'
   },
   module: {
-    loaders: [
-      {
+    loaders: [{
         test: /\.(js|jsx)$/,
         loader: 'babel',
         include: path.resolve(ROOT_PATH, 'src')
@@ -41,15 +40,27 @@ var common = {
 if (TARGET === 'dev') {
   module.exports = merge(common, {
     devtool: 'eval',
-    // module: {
-    //   loaders: [
-    //     {
-    //       test: /\.jsx?$/,
-    //       loaders: ['react-hot', 'babel?stage=1'],
-    //       include: path.resolve(ROOT_PATH, 'src')
-    //     }
-    //   ]
-    // },
+    module: {
+      loaders: [{
+        test: /\.js$/,
+        loader: 'babel-loader',
+        exclude: [/node_modules/],
+        options: {
+          presets: [
+            'babel-preset-es2015',
+            'babel-preset-react'
+          ].map(require.resolve),
+        }
+      }]
+    },
+    entry: {
+      app: ['./example/index.js']
+    },
+    output: {
+      path: 'example',
+      filename: 'bundle.js'
+    },
+    // externals: [/node_modules/],
     devServer: {
       publicPath: 'http://localhost:8181/',
       port: '8181',
@@ -59,7 +70,7 @@ if (TARGET === 'dev') {
       hot: true,
       inline: true,
       progress: true,
-      contentBase: 'dist'
+      contentBase: 'example'
     },
     plugins: [
       new webpack.HotModuleReplacementPlugin(),
@@ -110,5 +121,4 @@ if (TARGET === 'build') {
       new webpack.optimize.DedupePlugin()
     ]
   });
-}
-
+}
\ No newline at end of file
