chore(image-upload):configure cloudinary

.gitignore

@@ -13,4 +13,6 @@ testk.json
 author.test.js
 mock.js
 views
-code.js
+code.js
+.env
+client/.env

bin/www.js

@@ -1,6 +1,6 @@
 // Set up server here for application entry
 const http = require('http');
-const app = require('../app'); // The express app we just created
+const app = require('../app');
 
 const port = parseInt(process.env.PORT, 10) || 5432;
 app.set('port', port);

client/.env

@@ -3,11 +3,15 @@
 # store your secrets and config variables in here
 # reference these in your code with process.env.{ Environment Variable}
 
-APP_ENV:'development',
-ROOT_URL:'',
-PORT: 3000,
-HOST: '127.0.0.1',
-APP_CLOUD_NAME:
-APP_API_KEY:
-APP_API_SECRET:
-API_VERSION:
+NODE_ENV="development"
+ROOT_URL=''
+PORT= 3000
+HOST= '127.0.0.1'
+APP_CLOUD_NAME=
+APP_API_KEY=
+APP_API_SECRET=
+API_VERSION=
+CLOUDINARY_API_KEY=597274945855178
+CLOUDINARY_API_SECRET="LsbYsNPjMVjC14vMNS-I3KM6d-o"
+CLOUD_NAME="power-mobile"
+CLOUDINARY_URL="cloudinary://597274945855178:LsbYsNPjMVjC14vMNS-I3KM6d-o@power-mobile"

client/client/config/webpack.common.js

@@ -0,0 +1,134 @@
+const path = require('path');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const dotEnv = require('dotenv');
+
+dotEnv.config();
+
+/**
+ * Sorts chunk in alphabetical order
+ */
+const chunksSortMode = (prev, next) => (
+  prev.names[0].localeCompare(next.names[0])
+)
+const HtmlWebpackPluginConfig = new HtmlWebpackPlugin({
+  template: path.resolve(__dirname, '../public/index.html'),
+  filename: 'index.html',
+  inject: 'body',
+  chunksSortMode
+});
+
+const ProvidePlugin = new webpack.ProvidePlugin({
+  $: 'jquery',
+  jQuery: 'jquery',
+  'window.jQuery': 'jquery'
+});
+
+const DefinePlugin = new webpack.DefinePlugin({
+  "process.env": {
+    PORT: JSON.stringify(process.env.PORT),
+    NODE_ENV: JSON.stringify(process.env.NODE_ENV),
+    CLOUDINARY_CLOUD_NAME: JSON.stringify(process.env.CLOUDINARY_CLOUD_NAME),
+    CLOUDINARY_API_KEY: JSON.stringify(process.env.CLOUDINARY_API_KEY),
+    CLOUDINARY_API_SECRET: JSON.stringify(process.env.CLOUDINARY_API_SECRET),
+    ROOT_URL: JSON.stringify(process.env.ROOT_URL),
+    SOCKET_URL: JSON.stringify(process.env.SOCKET_URL),
+    API_VERSION: JSON.stringify(process.env.API_VERSION)
+  }
+});
+
+module.exports = {
+  entry: {
+    csocket: path.resolve(__dirname, '../src/assets/js/socket/index.js'),
+    bloader: path.resolve(__dirname, '../src/assets/js/loader/js/loader.js'),
+    dmain: path.resolve(__dirname, '../src/index.jsx')
+  },
+  resolve: {
+    extensions: [' ', '.js', '.jsx'],
+    alias: {
+      Assets: path.resolve(__dirname, '../src/assets'),
+      Utils: path.resolve(__dirname, '../src/utils'),
+      Actions: path.resolve(__dirname, '../src/actions'),
+      Routes: path.resolve(__dirname, '../src/Routes'),
+      Public: path.resolve(__dirname, '../public'),
+      Components: path.resolve(__dirname, '../src/components'),
+      HomePage: path.resolve(__dirname, '../src/components/homepage'),
+      Forms: path.resolve(__dirname, '../src/components/forms'),
+      General: path.resolve(__dirname, '../src/components/general'),
+      Modal: path.resolve(__dirname, '../src/components/Modal')
+    }
+  },
+  module: {
+    rules: [{
+        test: /\.(js|jsx)$/,
+        use: 'babel-loader',
+        exclude: /node_modules/
+      },
+      {
+        test: /\.(jpg|jpeg|gif|png)?$/,
+        loader: 'url-loader',
+        exclude: /node_modules/,
+        options: {
+          name: 'images/[name].[ext]'
+        }
+      },
+      {
+        test: /\.(eot|ttf|otf|svg)(\?.*$|$)?$/,
+        loader: 'url-loader?limit=10000&mimetype=application/font-woff',
+        options: {
+          name: 'fonts/[name].[ext]'
+        }
+      },
+      {
+        test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+        loader: 'file-loader',
+        exclude: /node_modules/
+      }, {
+        test: /\.scss$/,
+        use: [{
+          loader: 'style-loader',
+          options: {
+            sourceMap: true
+          }
+        }, {
+          loader: 'css-loader',
+          options: {
+            sourceMap: true
+          }
+        }, {
+          loader: 'sass-loader',
+          options: {
+            sourceMap: true
+          }
+        }]
+      }, {
+        test: /\.html$/,
+        use: ['html-loader']
+      }
+    ],
+    noParse: function(content) {
+      return /node_modules\/ws/.test(content);
+    }
+  },
+  externals: ['ws'],
+  plugins: [
+    HtmlWebpackPluginConfig,
+    ProvidePlugin,
+    DefinePlugin
+  ],
+  optimization: {
+    splitChunks: {
+      name: 'acommon',
+      filename: 'js/acommon.js',
+      minChunks: 2,
+      chunks: 'all'
+    }
+  },
+  stats: {
+    colors: true
+  },
+  target: 'web',
+  node: {
+    fs: 'empty'
+  }
+};

client/client/config/webpack.dev.js

@@ -0,0 +1,47 @@
+const path = require('path');
+const webpack = require('webpack');
+const merge = require('webpack-merge');
+const common = require('./webpack.common');
+const dotEnv = require('dotenv');
+dotEnv.config();
+
+const { PORT, HOST } = process.env;
+
+module.exports = merge(common, {
+  mode: 'development',
+  module: {
+    rules: [{
+      test: /\.css$/,
+      use: ['style-loader', 'css-loader']
+    }]
+  },
+  output: {
+    path: path.resolve(__dirname, '../dist'),
+    filename: 'js/[name].js',
+    publicPath: `http://localhost:${PORT}/`
+  },
+  plugins: [
+    new webpack.HotModuleReplacementPlugin()
+  ],
+  devServer: {
+    historyApiFallback: true,
+    hot: true,
+    compress: true,
+    inline: true,
+    host: HOST,
+    port: PORT,
+    contentBase: '/client/public',
+    watchOptions: {
+      poll: true,
+      ignored: /node_modules/
+    },
+    proxy: {
+      '/api/v1': {
+        target: 'http://localhost:5432',
+        secure: false,
+        changeOrigin: true
+      }
+    }
+  },
+  devtool: 'source-map'
+})

client/client/config/webpack.prod.js

@@ -0,0 +1,46 @@
+const path = require('path');
+const webpack = require('webpack');
+const merge = require('webpack-merge');
+const CompressionPlugin = require('compression-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const common = require('./webpack.common');
+
+const extractSass = new ExtractTextPlugin({
+  filename: 'css/[name].[contenthash].css',
+  allChunks: true
+});
+
+module.exports = merge(common, {
+  mode: 'production',
+  module: {
+    rules: [{
+      test: /\.(css|scss)$/,
+      use: ExtractTextPlugin.extract({
+        fallback: 'style-loader',
+        use: {
+          loader: 'css-loader',
+          options: {
+            minimize: true
+          }
+        }
+      })
+    }]
+  },
+  output: {
+    path: path.resolve(__dirname, '../build'),
+    filename: 'js/[name].js',
+    publicPath: '/'
+  },
+  plugins: [
+    extractSass,
+    new CompressionPlugin({
+      asset: '[path].gz[query]',
+      algorithm: 'gzip',
+      threshold: 10240,
+      minRatio: 0.8
+    }),
+  ],
+  optimization: {
+    minimize: true
+  }
+});