From 2c7ad5222433ef0def27c68c7587d148ba805500 Mon Sep 17 00:00:00 2001
From: adityasimant <adityasimant88@gmail.com>
Date: Mon, 14 Aug 2023 19:24:58 +0530
Subject: [PATCH] Created a Navbar and implimented routes

---
 package.json               |  2 ++
 src/App.js                 | 24 +++++++++++++++++++++---
 src/components/Contact.js  | 13 +++++++++++++
 src/components/CoreTeam.js | 13 +++++++++++++
 src/components/Events.js   | 13 +++++++++++++
 src/components/Home.js     | 13 +++++++++++++
 src/components/Navbar.js   | 31 +++++++++++++++++++++++++++++++
 7 files changed, 106 insertions(+), 3 deletions(-)
 create mode 100644 src/components/Contact.js
 create mode 100644 src/components/CoreTeam.js
 create mode 100644 src/components/Events.js
 create mode 100644 src/components/Home.js
 create mode 100644 src/components/Navbar.js

diff --git a/package.json b/package.json
index 2420268ee..1ee221331 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,8 @@
     "react": "^18.2.0",
     "react-bootstrap": "^2.8.0",
     "react-dom": "^18.2.0",
+    "react-icons": "^4.10.1",
+    "react-router-dom": "^6.15.0",
     "react-scripts": "5.0.1",
     "web-vitals": "^2.1.4"
   },
diff --git a/src/App.js b/src/App.js
index 7605e40c8..bbe38e317 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,10 +1,28 @@
 import './App.css';
-
+import NavBar from './components/Navbar';
+import {
+  BrowserRouter as Router,
+  Route,
+  Routes,
+  Navigate
+} from "react-router-dom";
+import Events from './components/Events';
+import CoreTeam from './components/CoreTeam';
+import Contact from './components/Contact';
+import Home from './components/Home';
 function App() {
   return (
     <>
-      <h2>Hello world!</h2>
-      <h3>You have successfully started the app!</h3>
+      <Router>
+      <NavBar/>
+      <Routes>
+          <Route path="/" element={<Home />} />
+          <Route path="/events" element={<Events />} />
+          <Route path="/coreteam" element={<CoreTeam />} />
+          <Route path="/contact" element={<Contact />} />
+          <Route path="*" element={<Navigate to="/"/>} />
+        </Routes>
+        </Router>
     </>
   );
 }
diff --git a/src/components/Contact.js b/src/components/Contact.js
new file mode 100644
index 000000000..739c40966
--- /dev/null
+++ b/src/components/Contact.js
@@ -0,0 +1,13 @@
+import React, { Component } from 'react';
+
+class Contact extends Component {
+    render() {
+        return (
+            <div>
+                Contact Page
+            </div>
+        );
+    }
+}
+
+export default Contact;
\ No newline at end of file
diff --git a/src/components/CoreTeam.js b/src/components/CoreTeam.js
new file mode 100644
index 000000000..4b1b20179
--- /dev/null
+++ b/src/components/CoreTeam.js
@@ -0,0 +1,13 @@
+import React, { Component } from 'react';
+
+class CoreTeam extends Component {
+    render() {
+        return (
+            <div>
+                This is core team
+            </div>
+        );
+    }
+}
+
+export default CoreTeam;
\ No newline at end of file
diff --git a/src/components/Events.js b/src/components/Events.js
new file mode 100644
index 000000000..11be064c4
--- /dev/null
+++ b/src/components/Events.js
@@ -0,0 +1,13 @@
+import React, { Component } from 'react';
+
+class Events extends Component {
+    render() {
+        return (
+            <div>
+                This is events page
+            </div>
+        );
+    }
+}
+
+export default Events;
\ No newline at end of file
diff --git a/src/components/Home.js b/src/components/Home.js
new file mode 100644
index 000000000..addc9ad0e
--- /dev/null
+++ b/src/components/Home.js
@@ -0,0 +1,13 @@
+import React, { Component } from 'react';
+
+class Home extends Component {
+    render() {
+        return (
+            <div>
+                This is home page
+            </div>
+        );
+    }
+}
+
+export default Home;
\ No newline at end of file
diff --git a/src/components/Navbar.js b/src/components/Navbar.js
new file mode 100644
index 000000000..0c062c04f
--- /dev/null
+++ b/src/components/Navbar.js
@@ -0,0 +1,31 @@
+import Container from 'react-bootstrap/Container';
+import Nav from 'react-bootstrap/Nav';
+import Navbar from 'react-bootstrap/Navbar';
+import { Link } from 'react-router-dom';
+
+
+
+function NavBar() {
+
+    return(
+        <>
+        <Navbar bg="dark" data-bs-theme="dark">
+        <Container>            
+          <Navbar.Brand href="#home">IETE DIEMS ISF</Navbar.Brand>
+          <Navbar.Toggle />
+          <Nav className="m-auto" variant='primary' >
+            <Nav.Link as={Link} to="/">Home</Nav.Link>
+            <Nav.Link as={Link} to="/">About</Nav.Link>
+            <Nav.Link as={Link} to="/events">Events</Nav.Link>
+            <Nav.Link as={Link} to="/coreteam">Core Team</Nav.Link>
+            <Nav.Link as={Link} to="/contact">Contact us</Nav.Link>
+          </Nav>
+        </Container>
+      </Navbar>
+        </>
+    )
+
+
+}
+
+export default NavBar;