diff --git a/frontend/package.json b/frontend/package.json
index 4ff295a..558b650 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -6,12 +6,18 @@
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
+ "bootstrap": "^4.5.0",
+ "jquery": "^3.5.1",
+ "lite-server": "^2.5.4",
+ "popper.js": "^1.16.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
- "react-scripts": "3.4.1"
+ "react-js-banner": "^0.5.2",
+ "react-scripts": "3.4.1",
+ "reactstrap": "^8.5.1"
},
"scripts": {
- "start": "react-scripts start",
+ "start": "react-scripts start npm run lite-server",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
diff --git a/frontend/src/App.js b/frontend/src/App.js
index ce9cbd2..1c29261 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -1,26 +1,24 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+// import React from 'react'
+// import 'bootstrap/dist/css/bootstrap.min.css'
+// import './components/Home/body/body.css'
+// import logo from './components/Home/footer/1.png'
+// import './components/Home/body/body.css'
+// import Banner from 'react-js-banner'
-function App() {
- return (
-
- );
-}
+// function App() {
+// return (
+//
+// )
+// }
-export default App;
+// export default App
diff --git a/frontend/src/Users.js b/frontend/src/Users.js
new file mode 100644
index 0000000..0656ee5
--- /dev/null
+++ b/frontend/src/Users.js
@@ -0,0 +1,46 @@
+import React from 'react';
+// import fetch from 'node-fetch';
+
+export default class Users extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ response: [],
+ loadingF: true,
+ }
+ };
+
+ componentDidMount() {
+ fetch('http://localhost:2017/rest/getposts', {
+ method: 'GET',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ }).then(res => res.json())
+ .then(response => {
+ console.log({ response });
+ this.setState({
+ response: response,
+ loadingF: false
+ })
+ }).catch((err) => this.setState({ loadingF: false }));
+ }
+ render() {
+ const { loadingF, response } = this.state;
+ if (loadingF) {
+ return bitch this is loading right now
+ }
+
+ const Title = ({ title }) => {title}
;
+ const ListItem = ({ item }) => ;
+ return (
+
+
+ {response.map(response1 =>
+ {response1.title}
{response1.content}
+
+
+
+
+
+
+
Events list
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Events and Vision
+
+ NOtice
+ {/* */}
+
+
+ );
+ }
+}
+
+export default IdeasNVision;
\ No newline at end of file
diff --git a/frontend/src/components/Home/body/banner.js b/frontend/src/components/Home/body/banner.js
new file mode 100644
index 0000000..f1d380f
--- /dev/null
+++ b/frontend/src/components/Home/body/banner.js
@@ -0,0 +1,23 @@
+import React from 'react';
+import 'bootstrap/dist/css/bootstrap.min.css';
+import './body.css';
+import logo from '../footer/1.png';
+import Banner from 'react-js-banner';
+
+function MainBanner() {
+ return (
+
+ )
+}
+
+export default MainBanner
diff --git a/frontend/src/components/Home/body/body.css b/frontend/src/components/Home/body/body.css
new file mode 100644
index 0000000..3ff3b51
--- /dev/null
+++ b/frontend/src/components/Home/body/body.css
@@ -0,0 +1,58 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+.background {
+ width: 100%;
+ padding: 45px 0;
+ background-image: url(https://a0.muscache.com/airbnb/static/footer/background-317dd7c2cb678ddbdb0a983d511cb9a0.png);
+ background-color: #2b2d2e;
+ color: #fff;
+}
+
+.Applogo {
+ width: 20%;
+}
+
+.site-section {
+ padding: 2.5em 0; }
+ @media (min-width: 768px) {
+ .site-section {
+ padding: 7em 0; } }
+ .site-section.site-section-sm {
+ padding: 4em 0; }
+
+.site-section-heading {
+ padding-bottom: 20px;
+ margin-bottom: 0px;
+ position: relative;
+ font-size: 2.5rem; }
+ @media (min-width: 768px) {
+ .site-section-heading {
+ font-size: 3rem; } }
+
+.container {
+ width: 1045px;
+ margin: 0 auto;
+ padding: 0 24px;
+}
+
+.section-title {
+ color: #000;
+margin-bottom: 50px;
+}
+
+.trend-entry {
+ margin-bottom: 30px;
+}
+
+.post-meta {
+ font-size: .8rem;
+}
+
+.cardimg {
+ width: 20%;
+ align-items: center;
+}
diff --git a/frontend/src/components/Home/footer/1.png b/frontend/src/components/Home/footer/1.png
new file mode 100644
index 0000000..72a54ae
Binary files /dev/null and b/frontend/src/components/Home/footer/1.png differ
diff --git a/frontend/src/components/Home/footer/footer.js b/frontend/src/components/Home/footer/footer.js
new file mode 100644
index 0000000..bf2bb34
--- /dev/null
+++ b/frontend/src/components/Home/footer/footer.js
@@ -0,0 +1,116 @@
+import React from 'react';
+import './style.css';
+import logo from './1.png'
+export default class Footer extends React.Component {
+ render() {
+ return(
+
+ )
+ }
+}
\ No newline at end of file
diff --git a/frontend/src/components/Home/footer/style.css b/frontend/src/components/Home/footer/style.css
new file mode 100644
index 0000000..d8f934f
--- /dev/null
+++ b/frontend/src/components/Home/footer/style.css
@@ -0,0 +1,128 @@
+/*
+ ========================================
+ Reset & Basic styles
+ ========================================
+*/
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ }
+ body {
+ background: #F5F5F5;
+ font: 14px Arial, sans-serif;
+ }
+ a {
+ color: inherit;
+ text-decoration: none;
+ }
+ .cf {
+ overflow: auto;
+ }
+ .container {
+ width: 1045px;
+ margin: 0 auto;
+ padding: 0 24px;
+ }
+ h2 {
+ font-size: 16px;
+ font-weight: bold;
+ margin-bottom: 15px;
+ }
+ .footer {
+ width: 100%;
+ padding: 45px 0;
+ background-image: url(https://a0.muscache.com/airbnb/static/footer/background-317dd7c2cb678ddbdb0a983d511cb9a0.png);
+ background-color: #2b2d2e;
+ color: #fff;
+ }
+
+ /*
+ ========================================
+ Config
+ ========================================
+ */
+ .config {
+ display: inline-block;
+ vertical-align: top;
+ width: 447px;
+ }
+ .config img{
+ padding-left: 8%;
+ margin-left: 10%;
+ padding-bottom: 8%;
+ }
+
+ /*
+ ========================================
+ Nav
+ ========================================
+ */
+ .footer-nav {
+ display: inline-block;
+ }
+ .footer-nav .col {
+ float: left;
+ padding: 0 6px;
+ width: 168px;
+ }
+ .footer-nav li {
+ list-style: none;
+ }
+ .footer-nav a {
+ line-height: 1.43;
+ }
+ .footer-nav a:hover {
+ color: #bbb;
+ }
+
+ /*
+ ========================================
+ Social
+ ========================================
+ */
+ .social {
+ border-top: 1px solid rgba(255,255,255,0.2);
+ margin-top: 48px;
+ padding-top: 24px;
+ }
+ .social h2 {
+ text-align: center;
+ margin-bottom: 24px;
+ }
+ .social ul {
+ width: 360px;
+ margin: 0 auto;
+ }
+ .social li {
+ display: inline-block;
+ }
+ .social a {
+ border: 1px solid rgba(255,255,255,0.2);
+ border-radius: 100%;
+ width: 36px;
+ height: 36px;
+ display: block;
+ text-align: center;
+ margin: 0 6px;
+ }
+ .social a .title {
+ display: none;
+ }
+ .social a svg {
+ fill: #fff;
+ width: 16px;
+ }
+ .social a:hover svg {
+ fill: #bbb;
+ }
+ .social p {
+ text-align: center;
+ margin-top: 12px;
+ color: #757575;
+
+ }
+ img{
+ height: 32%;
+ width: 47%;
+ }
\ No newline at end of file
diff --git a/frontend/src/components/Home/header/header.js b/frontend/src/components/Home/header/header.js
new file mode 100644
index 0000000..7ff2569
--- /dev/null
+++ b/frontend/src/components/Home/header/header.js
@@ -0,0 +1,3 @@
+import React, { Component } from 'react';
+import logo from '../footer/1.png';
+import './';
\ No newline at end of file
diff --git a/frontend/src/index.js b/frontend/src/index.js
index f5185c1..9752c86 100644
--- a/frontend/src/index.js
+++ b/frontend/src/index.js
@@ -1,9 +1,10 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
-import App from './App';
+import Footer from "./components/Home/footer/footer";
import * as serviceWorker from './serviceWorker';
+
ReactDOM.render(