Merge pull request #5 from manoj-nama/elements-scaffold

Setting up basic routes and scaffold

package.json

@@ -11,6 +11,7 @@
     "react-dom": "^16.13.1",
     "react-redux": "^7.2.0",
     "react-router": "^5.2.0",
+    "react-router-dom": "^5.2.0",
     "react-scripts": "3.4.1",
     "redux": "^4.0.5"
   },

src/app/Main.js

@@ -1,11 +1,30 @@
 import React from 'react';
+import { Router, Route, Redirect, Switch } from "react-router-dom";
+import history from './utils/history';
+
+import {
+  ElementsCreatePage,
+  ElementsListPage,
+} from './elements';
+
+import {
+  Header,
+} from './components';
 
 const MainApp = () => {
   return (
-    <div className="app">
-      <p>Hello Main App</p>
-    </div>
-  )
+    <Router history={history}>
+      <Header />
+      <Switch>
+        <Route exact path="/" component={ElementsListPage} />
+        <Route path="/elements/create" component={ElementsCreatePage} />
+        <Route path="/elements" component={ElementsListPage} />
+
+        {/* No Match */}
+        <Route render={() => <Redirect to='/elements' />} />
+      </Switch>
+    </Router>
+  );
 };
 
 export default MainApp;

src/app/components/Header/index.js

@@ -0,0 +1,12 @@
+import React from 'react';
+
+const Header = () => {
+  return (
+    <div>
+      <h1>EasyAPI</h1>
+      <p>This is the header</p>
+    </div>
+  )
+};
+
+export default Header;

src/app/components/index.js

@@ -0,0 +1 @@
+export { default as Header } from './Header';

src/app/elements/create/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+
+const ElementsCreate = () => {
+  return (
+    <div>
+      <p>This is Elements Create page</p>
+    </div>
+  )
+};
+
+export default ElementsCreate;

src/app/elements/index.js

@@ -0,0 +1,2 @@
+export { default as ElementsCreatePage } from './create';
+export { default as ElementsListPage } from './list';

src/app/elements/list/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+
+const ElementsList = () => {
+  return (
+    <div>
+      <p>This is Elements List page</p>
+    </div>
+  )
+};
+
+export default ElementsList;

src/app/utils/history.js

@@ -0,0 +1,3 @@
+import { createBrowserHistory } from 'history';
+
+export default createBrowserHistory({});