Add ant design to the project (#2)

- Remove the MaterialUI theme from the project
- Add ant design dependencies
- Add a card in home page to test ant setup

frontend/.babelrc

@@ -4,5 +4,8 @@
     "development": {
       "presets": ["react-hmre"]
     }
-  }
+  },
+  "plugins": [
+    ["import", { libraryName: "antd", style: true }] // `style: true` for less
+  ]
 }

frontend/package.json

@@ -22,10 +22,10 @@
   "author": "Utkarsh Gupta",
   "license": "GPL-3.0",
   "dependencies": {
+    "antd": "^2.10.0",
     "body-parser": "^1.15.2",
     "express": "^4.14.0",
     "immutable": "^3.8.1",
-    "material-ui": "^0.18.0",
     "prop-types": "^15.5.8",
     "react": "^15.4.2",
     "react-dom": "^15.3.2",
@@ -43,6 +43,7 @@
     "babel-cli": "^6.18.0",
     "babel-core": "^6.17.0",
     "babel-loader": "^7.0.0",
+    "babel-plugin-import": "^1.1.1",
     "babel-plugin-react-display-name": "^2.0.0",
     "babel-plugin-transform-object-rest-spread": "^6.20.2",
     "babel-polyfill": "^6.16.0",
@@ -67,6 +68,8 @@
     "extract-text-webpack-plugin": "2.1.0",
     "file-loader": "^0.11.1",
     "jsdom": "^10.1.0",
+    "less": "^2.7.2",
+    "less-loader": "^4.0.3",
     "mocha": "^3.1.0",
     "nock": "^9.0.11",
     "node-sass": "^4.5.2",

frontend/src/components/home/HomePage.js

@@ -1,10 +1,14 @@
 import React, { Component } from "react";
 import { PropTypes } from "prop-types";
+import { Card } from "antd";
 
 const HomePage = () => {
   return (
     <div>
       Hello world.
+      <Card title="Ant Design" style={{ width: 300 }}>
+        <p>Everything is working fine</p>
+      </Card>
     </div>
   );
 };

frontend/src/index.js

@@ -5,7 +5,6 @@ import React from "react";
 import { render } from "react-dom";
 import { Provider } from "react-redux";
 import { BrowserRouter as Router } from "react-router-dom";
-import MuiThemeProvider from "material-ui/styles/MuiThemeProvider";
 import injectTapEventPlugin from "react-tap-event-plugin";
 
 import App from "./components/App";
@@ -15,12 +14,10 @@ const store = configureStore();
 injectTapEventPlugin();
 
 render(
-  <MuiThemeProvider>
-    <Provider store={store}>
-      <Router>
-        <App />
-      </Router>
-    </Provider>
-  </MuiThemeProvider>,
+  <Provider store={store}>
+    <Router>
+      <App />
+    </Router>
+  </Provider>,
   document.getElementById("app")
 );

frontend/webpack.config.dev.js

@@ -33,6 +33,7 @@ export default {
       },
       { test: /jquery\.js$/, loader: "expose?jQuery!expose?$" },
       { test: /(\.scss)$/, use: ["style-loader", "css-loader", "sass-loader"] },
+      { test: /(\.less)$/, use: ["style-loader", "css-loader", "less-loader"] },
       { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, use: ["file-loader"] },
       { test: /\.(woff|woff2)$/, loader: "url-loader?prefix=font/&limit=5000" },
       {

frontend/webpack.config.prod.js

@@ -36,6 +36,7 @@ export default {
       },
       { test: /jquery\.js$/, loader: "expose?jQuery!expose?$" },
       { test: /(\.scss)$/, use: ["style-loader", "css-loader", "sass-loader"] },
+      { test: /(\.less)$/, use: ["style-loader", "css-loader", "less-loader"] },
       { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, use: ["file-loader"] },
       { test: /\.(woff|woff2)$/, loader: "url-loader?prefix=font/&limit=5000" },
       {