diff --git a/config/webpack/webpack.config.base.js b/config/webpack/webpack.config.base.js
new file mode 100644
index 0000000..34cae75
--- /dev/null
+++ b/config/webpack/webpack.config.base.js
@@ -0,0 +1,49 @@
+const Path = require('path');
+const TsConfigPathsPlugin = require('awesome-typescript-loader').TsConfigPathsPlugin;
+const packages = require('../../package.json');
+ 
+module.exports = { 
+    target: 'web',
+    entry: {
+        app: [
+            Path.resolve(__dirname, '../../src/ts/@overflow/app/index.tsx')
+        ],
+        vendor: Object.keys(packages.dependencies)
+    },
+ 
+    output: {
+        path: Path.resolve(__dirname, '../../dist'),
+        filename: '[name].js',
+        publicPath: '/'
+    },
+ 
+    devtool: '',
+ 
+    resolve: {
+        extensions: ['.ts', '.tsx', '.js', '.json'],
+        plugins: [
+            new TsConfigPathsPlugin({
+                tsconfig: "tsconfig.json",
+                compiler: "typescript"
+            })
+        ]
+    },
+ 
+    module: {
+        rules: [
+            {
+                test: /\.tsx?$/,
+                enforce: 'pre',
+                exclude: [
+                    Path.resolve(__dirname, '../../node_modules/')
+                ],
+                loader: 'tslint-loader',
+            }
+        ]
+    },
+    plugins: [
+    ],
+    node: {
+        fs: 'empty'
+    }
+};
diff --git a/config/webpack/webpack.config.dev.js b/config/webpack/webpack.config.dev.js
new file mode 100644
index 0000000..fad9808
--- /dev/null
+++ b/config/webpack/webpack.config.dev.js
@@ -0,0 +1,101 @@
+const Path = require('path');
+const Webpack = require('webpack');
+const WebpackMerge = require('webpack-merge');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const WebpackDashboardPlugin = require('webpack-dashboard/plugin');
+const configBase = require('./webpack.config.base.js');
+ 
+module.exports = WebpackMerge(configBase, {
+    entry: {
+        app: [
+            'react-hot-loader/patch'
+        ]
+    },
+
+    devtool: 'inline-source-map',
+    
+    devServer: {
+        hot: true,
+        inline: true,
+        historyApiFallback: true,
+        publicPath:  '/', // match the output `publicPath`
+        contentBase: [__dirname + '/public', __dirname + '/dist', __dirname + '/node_modules'], // match the output path
+        host: '127.0.0.1',
+        port: 9091,
+        stats: { 
+            colors: true 
+        },
+        watchOptions: {
+          ignored: /node_modules/,
+        },
+    },
+ 
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                loader: 'source-map-loader',
+                exclude: [
+                    Path.resolve(__dirname, '../../node_modules/')
+                ]
+            },
+            {
+                enforce: 'pre',
+                test: /\.tsx?$/,
+                use: "source-map-loader",
+                exclude: [
+                    Path.resolve(__dirname, '../../node_modules/')
+                ]
+            },
+            // {
+            //     test: /\.tsx?$/,
+            //     loaders: [
+            //         'awesome-typescript-loader'
+            //     ],
+            //     exclude: [
+            //         Path.resolve(__dirname, '../../node_modules/')
+            //     ],
+            //     include: [
+            //         Path.resolve(__dirname, '../../src/')
+            //     ]
+            // },
+            {
+                test: /\.tsx?$/,
+                exclude: [
+                    Path.resolve(__dirname, '../../node_modules/')
+                ],
+                include: [
+                    Path.resolve(__dirname, '../../src/')
+                ],
+                use: [
+                    {
+                        loader: 'react-hot-loader/webpack' 
+                    },
+                    {
+                        loader: 'awesome-typescript-loader',
+                        options: {
+                            transpileOnly: true,
+                            useTranspileModule: false,
+                            sourceMap: true,
+                        },
+                    },
+                ],
+            },
+        ]
+    },
+    plugins: [
+        new WebpackDashboardPlugin(),
+        new Webpack.HotModuleReplacementPlugin(),
+        new Webpack.NamedModulesPlugin(),
+        new Webpack.NoEmitOnErrorsPlugin(),
+        new HtmlWebpackPlugin({
+            template: Path.resolve(__dirname, '../../public/index.html')
+        }),
+        new Webpack.optimize.CommonsChunkPlugin({
+            name: 'vendor',
+            minChunks: Infinity,
+            filename: 'vendor.js'
+        }),
+    ]
+});
diff --git a/config/webpack/webpack.config.prod.js b/config/webpack/webpack.config.prod.js
new file mode 100644
index 0000000..66fd666
--- /dev/null
+++ b/config/webpack/webpack.config.prod.js
@@ -0,0 +1,71 @@
+const Path = require('path');
+const Webpack = require('webpack');
+const WebpackMerge = require('webpack-merge');
+const configBase = require('./webpack.config.base.js');
+ 
+ 
+module.exports = WebpackMerge(configBase, {
+    devtool: 'source-map',
+ 
+    module: {
+        rules: [
+            {
+                enforce: 'pre',
+                test: /\.js$/,
+                loader: 'source-map-loader',
+                exclude: [
+                    Path.resolve(__dirname, '../../node_modules/')
+                ]
+            },
+            {
+                test: /\.tsx?$/,
+                loader: 'awesome-typescript-loader',
+                exclude: [
+                    Path.resolve(__dirname, '../../node_modules/')
+                ]
+            },
+        ]
+    },
+    plugins: [
+        new Webpack.DefinePlugin({
+            'process.env': {
+                'NODE_ENV': JSON.stringify('production')
+            },
+            'DEBUG': false,
+            '__DEVTOOLS__': false
+        }),
+        // Plugings for optimizing size and performance.
+        // Here you have all the available by now:
+        //    Webpack 1. https://github.com/webpack/webpack/blob/v1.13.3/lib/optimize
+        //    Webpack 2. https://github.com/webpack/webpack/tree/master/lib/optimize
+        new Webpack.optimize.UglifyJsPlugin({
+            compress: {
+                warnings: false,
+                screw_ie8: true,
+                conditionals: true,
+                unused: true,
+                comparisons: true,
+                sequences: true,
+                dead_code: true,
+                evaluate: true,
+                if_return: true,
+                join_vars: true,
+                drop_console: true,
+                drop_debugger: true,
+                global_defs: {
+                    __REACT_HOT_LOADER__: undefined // eslint-disable-line no-undefined
+                }
+            },
+            minimize: true,
+            debug: false,
+            sourceMap: true,
+            output: {
+                comments: false
+            },
+ 
+        }),
+        // Included by default in webpack 2
+        // new webpack.optimize.OccurrenceOrderPlugin(),
+        new Webpack.optimize.AggressiveMergingPlugin()
+    ]
+});
diff --git a/config/webpack/webpack.config.stats.js b/config/webpack/webpack.config.stats.js
new file mode 100644
index 0000000..6f894b6
--- /dev/null
+++ b/config/webpack/webpack.config.stats.js
@@ -0,0 +1,32 @@
+///////////////////////////////////////////////////////////////////////////////////////////////////
+//  WebPack 2 STATS Config
+///////////////////////////////////////////////////////////////////////////////////////////////////
+//
+//
+// REMEMBER UPLOAD YOUR stats.json to http://webpack.github.io/analyse/
+// IMPORTANT. If you use console.log in this file, the stats.json will not work...
+// TODO. Include fileDateTime in stats.json as well.
+//
+///////////////////////////////////////////////////////////////////////////////////////////////////
+ 
+const Visualizer = require('webpack-visualizer-plugin');
+const WebpackMerge = require('webpack-merge');
+ 
+////////////////////////////////////////////////
+// File name for Visualizer
+////////////////////////////////////////////////
+const currentDateTime = new Date();
+const currentDate = currentDateTime.toLocaleDateString('en-GB').replace(/\//g, "-");
+const currentTime = currentDateTime.toLocaleTimeString('en-GB', { hour12: false }).replace(/:/g, "-");
+const fileDateTime = currentDate + "-" + currentTime;
+const statisticsFileName = './stats/statistics-' + fileDateTime + '.html';
+const configBase = require('./webpack.config.prod.js');
+ 
+ 
+module.exports = WebpackMerge(configBase, {
+    plugins: [
+        new Visualizer({
+            filename: statisticsFileName
+        })
+    ]
+});
diff --git a/public/asset/image/overFlow_CI_blue_180.png b/public/asset/image/overFlow_CI_blue_180.png
new file mode 100644
index 0000000..98833b7
Binary files /dev/null and b/public/asset/image/overFlow_CI_blue_180.png differ
diff --git a/public/index.html b/public/index.html
new file mode 100644
index 0000000..526580b
--- /dev/null
+++ b/public/index.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="UTF-8" />
+    <title>Hello React!</title>
+    <!--[if lte IE 9]>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.0/es6-promise.auto.js"></script>
+    <![endif]-->
+    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css"></link>
+    <style type="text/css">
+        .fullHeight {
+            height: 100%;
+        }
+    </style>
+</head>
+
+<body>
+    <div id="appContainer" class="fullHeight"></div>
+</body>
+
+</html>
\ No newline at end of file