expense recorder boilerplate code is set

nikhil-bacancy · Mar 21, 2018 · af48a60 · af48a60
commit af48a60
Show file tree

Hide file tree

Showing 22 changed files with 7,188 additions and 0 deletions.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,4 @@
+{
+  "presets": ["es2015", "react"],
+  "plugins": ["react-hot-loader/babel"]
+}
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,21 @@
+{
+    "extends": "airbnb",
+    "plugins": [
+         "react"
+    ],
+    "rules": {
+        "no-console": 0,
+        "react/jsx-filename-extension": 0,
+        "react/no-array-index-key": 0,
+        "react/sort-comp": 0,
+        "react/jsx-no-bind": 0,
+        "jsx-a11y/href-no-hash": 0,
+        "jsx-a11y/no-static-element-interactions": 0,
+        "react/forbid-prop-types": 0,
+        "linebreak-style": 0,
+        "no-underscore-dangle": 0,
+        "import/no-extraneous-dependencies": 0,
+        "jsx-a11y/label-has-for": 0,
+        "jsx-a11y/img-has-alt": 0
+    }
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+/dist
+.env
diff --git a/README.md b/README.md
@@ -0,0 +1 @@
+# Expense-Recorder
diff --git a/client/actions/asyncActions.js b/client/actions/asyncActions.js
@@ -0,0 +1,8 @@
+import Request from 'axios';
+import syncActions from './syncActions';
+
+const ip = '/api';
+function makeRequest(method, api = '/login', data) {
+  return Request[method](ip + api, data)
+        .then(r => r);
+}
diff --git a/client/actions/syncActions.js b/client/actions/syncActions.js
diff --git a/client/components/homepage/HomePage.js b/client/components/homepage/HomePage.js
@@ -0,0 +1,13 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import './HomePage.scss';
+
+const HomePage = () => (
+  <div className="homepage row-col-center">
+    <div className="middle">
+      <h1 className="h1">Welcome</h1>
+      <button><Link to="">Click Here</Link></button>
+    </div>
+  </div>
+);
+export default HomePage;
diff --git a/client/components/homepage/HomePage.scss b/client/components/homepage/HomePage.scss
@@ -0,0 +1,27 @@
+.homepage {
+    background: #3b4465;
+    height: 100vh;
+    .middle {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        h1 {
+            color: #fff;
+            font-size: 3em;
+            margin: 0 0 0.4em 0;
+        }
+        button {
+            font-size: 2em;
+            color: #fff;
+            background: none;
+            border: none;
+            cursor: pointer;
+            a {
+              all: unset;
+            }
+            &:hover, &:active {
+                text-decoration: underline;
+            }
+        }
+    }
+}
diff --git a/client/index.html b/client/index.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>Expense-Recorder</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="../dist/style.css" />
+  </head>
+  <body>
+    <div id="app"></div>
+    <script src="../dist/bundle.js"></script>
+  </body>
+</html>
+
+
+<!-- The Bootstrap 4 grid system has five classes:
+
+.col- (extra small devices - screen width less than 576px)
+.col-sm- (small devices - screen width equal to or greater than 576px)
+.col-md- (medium devices - screen width equal to or greater than 768px)
+.col-lg- (large devices - screen width equal to or greater than 992px)
+.col-xl- (xlarge devices - screen width equal to or greater than 1200px) -->
diff --git a/client/index.js b/client/index.js
@@ -0,0 +1,19 @@
+import React from 'react';
+import { render } from 'react-dom';
+import { Provider } from 'react-redux';
+import { BrowserRouter as Router } from 'react-router-dom';
+import './styles.scss';
+
+import createRoutes from './routes';
+import configureStore from './store';
+
+const initialState = {};
+const store = configureStore(initialState);
+const routes = createRoutes(store);
+
+render(
+  <Provider store={store}>
+    <Router>
+      {routes}
+    </Router>
+  </Provider>, document.getElementById('app'));
diff --git a/client/reducers/index.js b/client/reducers/index.js
@@ -0,0 +1,8 @@
+import { combineReducers } from 'redux';
+import { routerReducer as routing } from 'react-router-redux';
+
+const rootReducer = combineReducers({
+  routing,
+});
+
+export default rootReducer;
diff --git a/client/reducers/initialState.js b/client/reducers/initialState.js
@@ -0,0 +1,5 @@
+const initialState = {
+
+};
+
+export default initialState;
diff --git a/client/routes.js b/client/routes.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import { Redirect, Switch, Route } from 'react-router-dom';
+
+import HomePage from './components/homepage/HomePage';
+
+export default () => (
+  <Switch>
+    <Route path="/" exact component={HomePage} />
+  </Switch>
+);
diff --git a/client/store/index.js b/client/store/index.js
@@ -0,0 +1,10 @@
+import { createStore, applyMiddleware, compose } from 'redux';
+import thunk from 'redux-thunk';
+import { createLogger } from 'redux-logger';
+import rootReducer from '../reducers';
+
+export default function configureStore(initialState) {
+  const middleware = [thunk];
+  middleware.push(createLogger({ collapsed: true }));
+  return createStore(rootReducer, initialState, compose(applyMiddleware(...middleware), f => f));
+}
diff --git a/client/styles.scss b/client/styles.scss
@@ -0,0 +1,9 @@
+@import '../node_modules/bootstrap/dist/css/bootstrap.min.css';
+@import '../node_modules/font-awesome/css/font-awesome.min.css';
+@import '../node_modules/react-select/dist/react-select.min.css';
+
+.row-col-center {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}