├── backend ├── .gitignore ├── model │ ├── feedbackSchema.js │ ├── userSchema.js │ └── eventSchema.js ├── package.json ├── index.js └── controller │ └── eventRoute.js ├── frontend ├── public │ ├── robots.txt │ ├── favicon.ico │ ├── logo192.png │ ├── logo512.png │ ├── logo_circle.jpg │ ├── manifest.json │ └── index.html ├── src │ ├── assets │ │ ├── image.jpg │ │ └── logo_circle.jpg │ ├── components │ │ ├── UserList │ │ │ ├── UserList.css │ │ │ ├── UserList.js │ │ │ └── UserListRow.js │ │ ├── Protected │ │ │ ├── ProtectedRoute.js │ │ │ └── ProtectedRoutedAdmin.js │ │ ├── Login │ │ │ ├── Register.js │ │ │ ├── Login.js │ │ │ ├── register.css │ │ │ └── RegistrationForm.js │ │ ├── Event │ │ │ ├── CreateEvent.js │ │ │ ├── EventList.js │ │ │ ├── BookedEventsList.js │ │ │ ├── Events.css │ │ │ ├── UpdateEvent.js │ │ │ ├── eventform.css │ │ │ ├── eventform.js │ │ │ └── EventCard.js │ │ ├── Footer │ │ │ ├── Footer.css │ │ │ └── Footer.js │ │ ├── UserProfile │ │ │ └── EditProfile.js │ │ ├── Navbar │ │ │ ├── Navbar.css │ │ │ └── Navbar.js │ │ ├── Home │ │ │ ├── Home.js │ │ │ └── Home.css │ │ └── ContactPage │ │ │ ├── ContactPage.css │ │ │ └── ContactPage.js │ ├── setupTests.js │ ├── App.test.js │ ├── App.css │ ├── reportWebVitals.js │ ├── index.css │ ├── index.js │ └── App.js ├── .gitignore ├── package.json ├── events.html └── Register.html ├── package.json └── README.md /backend/.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules -------------------------------------------------------------------------------- /frontend/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /frontend/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SmritiVM/Event-Management-System/HEAD/frontend/public/favicon.ico -------------------------------------------------------------------------------- /frontend/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SmritiVM/Event-Management-System/HEAD/frontend/public/logo192.png -------------------------------------------------------------------------------- /frontend/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SmritiVM/Event-Management-System/HEAD/frontend/public/logo512.png -------------------------------------------------------------------------------- /frontend/src/assets/image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SmritiVM/Event-Management-System/HEAD/frontend/src/assets/image.jpg -------------------------------------------------------------------------------- /frontend/public/logo_circle.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SmritiVM/Event-Management-System/HEAD/frontend/public/logo_circle.jpg -------------------------------------------------------------------------------- /frontend/src/assets/logo_circle.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/SmritiVM/Event-Management-System/HEAD/frontend/src/assets/logo_circle.jpg -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "axios": "^1.6.0", 4 | "bootstrap": "^5.3.2", 5 | "react-router-dom": "^6.18.0" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /frontend/src/components/UserList/UserList.css: -------------------------------------------------------------------------------- 1 | .userDisplayTable th,td{ 2 | color: aliceblue; 3 | } 4 | 5 | .delete-button{ 6 | margin: 5px; 7 | border-radius: 10px; 8 | } -------------------------------------------------------------------------------- /frontend/src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /frontend/src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /frontend/src/App.css: -------------------------------------------------------------------------------- 1 | .App{ 2 | width: 100%; 3 | min-height: 100vh; 4 | background: linear-gradient(to top,rgba(0, 0, 0, 0.5)50%, rgba(0, 0, 0, 0.5)50%), url("./assets/image.jpg"); 5 | background-position: center; 6 | background-size: cover; 7 | background-repeat: "no-repeat"; 8 | background-attachment: fixed; 9 | } 10 | 11 | -------------------------------------------------------------------------------- /frontend/src/components/Protected/ProtectedRoute.js: -------------------------------------------------------------------------------- 1 | import { Navigate } from "react-router-dom"; 2 | 3 | function ProtectedRoute({isLoggedIn,children}){ 4 | if(!isLoggedIn || isLoggedIn === "false"){ 5 | return 6 | 7 | } 8 | return children 9 | 10 | } 11 | export default ProtectedRoute; -------------------------------------------------------------------------------- /frontend/src/components/Protected/ProtectedRoutedAdmin.js: -------------------------------------------------------------------------------- 1 | import { Navigate } from "react-router-dom"; 2 | 3 | function ProtectedRouteAdmin({currentUser,children}){ 4 | if(currentUser != "admin"){ 5 | return 6 | 7 | } 8 | return children 9 | 10 | } 11 | export default ProtectedRouteAdmin; -------------------------------------------------------------------------------- /backend/model/feedbackSchema.js: -------------------------------------------------------------------------------- 1 | const mongoose = require("mongoose"); 2 | const feedbackSchema = new mongoose.Schema({ 3 | "name": {type:String}, 4 | "email" : {type:String}, 5 | "message" : {type:String} 6 | 7 | 8 | }, { 9 | collection: "feedback" 10 | }) 11 | 12 | module.exports = mongoose.model("feedbackSchema", feedbackSchema); -------------------------------------------------------------------------------- /frontend/src/components/Login/Register.js: -------------------------------------------------------------------------------- 1 | import RegistrationForm from "./RegistrationForm"; 2 | 3 | export default function Register(){ 4 | return( 5 | 12 | 13 | ) 14 | } -------------------------------------------------------------------------------- /frontend/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /frontend/src/components/Event/CreateEvent.js: -------------------------------------------------------------------------------- 1 | import EventRegistrationForm from "./eventform"; 2 | 3 | export default function CreateEvent(){ 4 | return( 5 | ) 16 | } -------------------------------------------------------------------------------- /frontend/src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /backend/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "backend", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "nodemon index.js" 8 | }, 9 | "keywords": [], 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "body-parser": "^1.20.2", 14 | "cors": "^2.8.5", 15 | "express": "^4.18.2", 16 | "mongoose": "^6.9.1", 17 | "nodemon": "^3.0.1" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /backend/model/userSchema.js: -------------------------------------------------------------------------------- 1 | const mongoose = require("mongoose"); 2 | const userSchema = new mongoose.Schema({ 3 | "username": {type:String, unique:true}, 4 | "fullName": {type:String}, 5 | "email" : {type:String}, 6 | "phone" : {type:String}, 7 | "password": {type:String}, 8 | "bookedEvents": {type:Array}, 9 | 10 | 11 | }, { 12 | collection: "userrecord" 13 | }) 14 | 15 | module.exports = mongoose.model("userSchema", userSchema); -------------------------------------------------------------------------------- /frontend/src/index.css: -------------------------------------------------------------------------------- 1 | html{ 2 | overscroll-behavior: none; 3 | } 4 | 5 | body { 6 | margin: 0; 7 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 8 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', 9 | sans-serif; 10 | -webkit-font-smoothing: antialiased; 11 | -moz-osx-font-smoothing: grayscale; 12 | background-color: rgb(10,4,22); 13 | } 14 | 15 | code { 16 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', 17 | monospace; 18 | } 19 | -------------------------------------------------------------------------------- /backend/model/eventSchema.js: -------------------------------------------------------------------------------- 1 | const { Int32, Timestamp } = require("mongodb"); 2 | const mongoose = require("mongoose"); 3 | const eventSchema = new mongoose.Schema({ 4 | "name": {type:String, unique:true}, 5 | "date": {type:Date}, 6 | "startTime": {type: String}, 7 | "endTime": {type:String}, 8 | "place": {type:String}, 9 | "club": {type:String}, 10 | "description": {type:String}, 11 | "slots": {type: Number}, 12 | "registeredUsers" : {type:Array}, 13 | 14 | 15 | }, { 16 | collection: "events-record" 17 | }) 18 | 19 | module.exports = mongoose.model("eventSchema", eventSchema); -------------------------------------------------------------------------------- /frontend/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.css'; 4 | import App from './App'; 5 | import reportWebVitals from './reportWebVitals'; 6 | 7 | const root = ReactDOM.createRoot(document.getElementById('root')); 8 | root.render( 9 | 10 | 11 | 12 | ); 13 | 14 | // If you want to start measuring performance in your app, pass a function 15 | // to log results (for example: reportWebVitals(console.log)) 16 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 17 | reportWebVitals(); 18 | -------------------------------------------------------------------------------- /frontend/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /backend/index.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const mongoose = require("mongoose"); 3 | const eventRoute = require("./controller/eventRoute"); 4 | const bodyParser = require("body-parser"); 5 | const cors = require("cors"); 6 | 7 | const app = express(); 8 | 9 | mongoose.set("strictQuery", true); 10 | mongoose.connect("mongodb+srv://jayp_mishra:1234mish@cluster0.7eeb128.mongodb.net/emsdb"); 11 | var db = mongoose.connection; 12 | db.on("open", () => console.log("Connected to DB")); 13 | db.on("error", () => console.log("Error occurred")); 14 | 15 | app.use(bodyParser.json()); 16 | app.use(bodyParser.urlencoded({extended:true})); 17 | app.use(cors()); 18 | 19 | app.use('/eventRoute', eventRoute); 20 | app.listen(4000, () => { 21 | console.log("Server started at 4000"); 22 | }) 23 | -------------------------------------------------------------------------------- /frontend/src/components/Footer/Footer.css: -------------------------------------------------------------------------------- 1 | .footer{ 2 | display: flex; 3 | flex-direction: row; 4 | margin-top: 15%; 5 | position: relative; 6 | background-color: rgb(10,4,22); 7 | bottom: 0 !important; 8 | padding-top: 10px !important; 9 | margin-bottom: 0; 10 | max-height: fit-content; 11 | 12 | } 13 | 14 | .footer-copyright{ 15 | text-align: center !important; 16 | } 17 | 18 | .footer-body{ 19 | margin-left: 70vw; 20 | text-align: center !important; 21 | padding: 10px; 22 | padding-bottom: 0; 23 | } 24 | 25 | 26 | .footer h4 { 27 | font-size: 1em; 28 | color: rgba(255, 255, 255, 0.61) !important; 29 | margin-top: 0.5em !important; 30 | /* margin-bottom: 0.5em !important; */ 31 | padding-left: 10px; 32 | padding-right: 10px; 33 | text-underline-offset: 0; 34 | } 35 | 36 | .footer-icons{ 37 | color: aliceblue; 38 | padding-left: 5px; 39 | } -------------------------------------------------------------------------------- /frontend/src/components/Event/EventList.js: -------------------------------------------------------------------------------- 1 | import { useEffect, useState} from "react"; 2 | import Axios from "axios"; 3 | import EventCard from './EventCard'; 4 | 5 | const EventList = () => { 6 | const [arr, setArr] = useState([]) 7 | 8 | useEffect(() => { 9 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/event-list") 10 | .then((res) => { 11 | if(res.status === 200) 12 | setArr(res.data); 13 | // console.log(arr);} 14 | else 15 | Promise.reject(); 16 | }) 17 | .catch((err) => alert(err)); 18 | }) 19 | 20 | const EventListItems = () => { 21 | return arr.map((val, index) => { 22 | const slotsLeft = "Slots Left: " + `${val.slots}`; 23 | return 24 | }) 25 | } 26 | return ( 27 |
28 |
29 | {EventListItems()} 30 |
31 |
32 | ); 33 | }; 34 | 35 | export default EventList; 36 | -------------------------------------------------------------------------------- /frontend/src/components/Event/BookedEventsList.js: -------------------------------------------------------------------------------- 1 | import { useEffect, useState } from "react"; 2 | import Axios from "axios"; 3 | 4 | import EventCard from "./EventCard"; 5 | 6 | export default function BookedEventsList(){ 7 | const [arr, setArr] = useState([]) 8 | const user = localStorage.getItem("user"); 9 | useEffect(() => { 10 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/check-user/" + user) 11 | .then((res) => { 12 | if(res.status === 200){ 13 | if(res.data != null){ 14 | setArr(res.data.bookedEvents); 15 | } 16 | } 17 | else 18 | Promise.reject(); 19 | }) 20 | }) 21 | 22 | const BookedItems = () => { 23 | return arr.map((val, index) => { 24 | return 25 | }) 26 | } 27 | 28 | return( 29 |
30 |
31 | {BookedItems()} 32 |
33 |
34 | ) 35 | 36 | } -------------------------------------------------------------------------------- /frontend/src/components/Event/Events.css: -------------------------------------------------------------------------------- 1 | .eventCard { 2 | /* background-color: rgb(108, 117, 125); */ 3 | background-image: -moz-linear-gradient( black, gray); 4 | /* border: 2px solid rgb(33, 37, 41); */ 5 | border-radius: 10px; 6 | margin: 10px; 7 | padding: 20px; 8 | color: white; 9 | max-width: 25%; 10 | min-width: 25%; 11 | } 12 | 13 | 14 | .eventCard:hover { 15 | transform: scale(1.05); /* Scale up the card on hover */ 16 | } 17 | 18 | .cardButton{ 19 | margin: 2px; 20 | padding: 10px; 21 | font-size: 1.15vw; 22 | border: 2px solid #dadada; 23 | border-radius: 7px; 24 | font-weight: bold; 25 | cursor: pointer; 26 | 27 | } 28 | 29 | .cardButton:hover{ 30 | outline: none; 31 | border-color: #9ecaed; 32 | box-shadow: 0 0 10px #9ecaed; 33 | } 34 | 35 | 36 | .cardContainer { 37 | display: flex; 38 | flex-direction: row; 39 | flex-wrap: wrap; 40 | margin: 10px; 41 | margin-top: 8%; 42 | justify-content: center; 43 | } 44 | 45 | .userTable { 46 | margin:50px auto; 47 | font-size: small; 48 | } 49 | 50 | .userTable td{ 51 | max-width: 115px; 52 | word-wrap: break-word; 53 | } 54 | -------------------------------------------------------------------------------- /frontend/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "frontend", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@testing-library/jest-dom": "^5.17.0", 7 | "@testing-library/react": "^13.4.0", 8 | "@testing-library/user-event": "^13.5.0", 9 | "axios": "^1.6.1", 10 | "jquery": "^3.7.1", 11 | "react": "^18.2.0", 12 | "react-bootstrap": "^2.9.1", 13 | "react-dom": "^18.2.0", 14 | "react-icons": "^4.11.0", 15 | "react-router-dom": "^6.18.0", 16 | "react-scripts": "5.0.1", 17 | "web-vitals": "^2.1.4" 18 | }, 19 | "scripts": { 20 | "start": "react-scripts start", 21 | "build": "react-scripts build", 22 | "test": "react-scripts test", 23 | "eject": "react-scripts eject" 24 | }, 25 | "eslintConfig": { 26 | "extends": [ 27 | "react-app", 28 | "react-app/jest" 29 | ] 30 | }, 31 | "browserslist": { 32 | "production": [ 33 | ">0.2%", 34 | "not dead", 35 | "not op_mini all" 36 | ], 37 | "development": [ 38 | "last 1 chrome version", 39 | "last 1 firefox version", 40 | "last 1 safari version" 41 | ] 42 | }, 43 | "devDependencies": { 44 | "@types/jquery": "^3.5.26" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /frontend/src/components/Footer/Footer.js: -------------------------------------------------------------------------------- 1 | import {Link} from "react-router-dom"; 2 | import {Container, Row, Col} from "react-bootstrap"; 3 | import {FaLinkedin, FaTwitter, FaInstagram} from "react-icons/fa"; 4 | 5 | import "./Footer.css"; 6 | 7 | export default function Footer(){ 8 | let date = new Date(); 9 | let year = date.getFullYear(); 10 | 11 | return( 12 | 13 | 14 | 15 |

© {year}

16 | 17 | 18 | 19 |

About

20 | 21 | 22 |

Contact Us

23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
31 | 32 | 33 | 34 | ) 35 | } 36 | -------------------------------------------------------------------------------- /frontend/src/components/UserList/UserList.js: -------------------------------------------------------------------------------- 1 | import Axios from "axios"; 2 | import { useEffect, useState } from "react"; 3 | import UserListRow from "./UserListRow"; 4 | 5 | import "./UserList.css"; 6 | 7 | function UserList() 8 | { 9 | const [arr,setArr] = useState([]); 10 | useEffect(()=>{ 11 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/user-list") 12 | .then((res)=>{ 13 | if(res.status === 200) 14 | setArr(res.data); 15 | else 16 | Promise.reject(); 17 | }) 18 | .catch((err)=> alert(err)); 19 | },[]); 20 | 21 | const ListItems = () =>{ 22 | return arr.map((val,ind)=>{ //[{_id, username, fullName, email, phone},{},{},{}] 23 | return 24 | }) 25 | } 26 | return ( 27 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | {ListItems()} 40 | 41 |
UsernameFull NameEmailPhone
42 | ) 43 | } 44 | export default UserList; 45 | -------------------------------------------------------------------------------- /frontend/src/components/UserProfile/EditProfile.js: -------------------------------------------------------------------------------- 1 | import { useState, useEffect } from "react"; 2 | import Axios from "axios"; 3 | import RegistrationForm from "../Login/RegistrationForm"; 4 | 5 | function UserUpdateForm() { 6 | const [formData, setFormData] = useState({ 7 | 8 | usernameValue: '', 9 | fullNameValue: '', 10 | emailValue: '', 11 | phoneValue: '', 12 | passwordValue: '', 13 | 14 | }); 15 | 16 | const [bookedEventsValue, setBookedEventsValue] = useState(); 17 | 18 | useEffect(() => { 19 | 20 | const user = localStorage.getItem('user'); 21 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/check-user/" + user) 22 | .then(response => { 23 | { 24 | setFormData( 25 | { 26 | 27 | usernameValue: `${response.data.username}`, 28 | fullNameValue: `${response.data.fullName}`, 29 | emailValue: `${response.data.email}`, 30 | phoneValue: `${response.data.phone}`, 31 | passwordValue: `${response.data.password}`, 32 | 33 | } 34 | ); 35 | setBookedEventsValue(response.data.bookedEvents); 36 | console.log("From profile page:",formData, bookedEventsValue); 37 | } 38 | }) 39 | .catch(error => { 40 | console.error('Error fetching user details:', error); 41 | }); 42 | }, [formData.usernameValue, formData.fullNameValue, formData.emailValue, formData.phoneValue, formData.passwordValue]); 43 | 44 | 45 | return ( 46 | 56 | ); 57 | }; 58 | export default UserUpdateForm; -------------------------------------------------------------------------------- /frontend/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | 28 | 29 | 30 | 31 | Eventify 32 | 33 | 34 | 35 |
36 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /frontend/src/components/Navbar/Navbar.css: -------------------------------------------------------------------------------- 1 | 2 | .navbar{ 3 | overflow: hidden; 4 | width: 1200px; 5 | height: 80px; 6 | margin: auto; 7 | } 8 | 9 | .navbar-header{ 10 | width: 100%; 11 | } 12 | 13 | .logo{ 14 | scale: 0.7; 15 | float: left; 16 | height: 70px; 17 | filter: saturate(180%); 18 | border-radius: 50px; 19 | } 20 | .menu{ 21 | float: left; 22 | height: 70px; 23 | width: fit-content; 24 | } 25 | 26 | ul{ 27 | float: left; 28 | display: flex; 29 | justify-content: center; 30 | align-items: center; 31 | } 32 | 33 | ul li{ 34 | list-style: none; 35 | margin-left: 62px; 36 | margin-top: 15px; 37 | font-size: 16px; 38 | 39 | 40 | } 41 | 42 | ul li a{ 43 | text-decoration: none; 44 | color: #fff; 45 | font-family: 'Nunito'; 46 | font-weight: bold; 47 | transition: 0.4s ease-in-out; 48 | 49 | } 50 | 51 | ul li a:hover{ 52 | color: #ff7200; 53 | } 54 | 55 | .usericon{ 56 | margin-top: 25px; 57 | scale: 2; 58 | padding-right: 10px; 59 | 60 | } 61 | 62 | .admin{ 63 | margin-left: 400px; 64 | } 65 | 66 | .user{ 67 | margin-left: 600px; 68 | } 69 | 70 | .dropdown { 71 | overflow: hidden; 72 | } 73 | 74 | .dropdown .dropbtn { 75 | font-size: 16px; 76 | border: none; 77 | outline: none; 78 | color: white; 79 | padding-bottom: 10px; 80 | background-color: inherit; 81 | font-family: 'Nunito'; 82 | font-weight: bold; 83 | } 84 | 85 | .dropdown-content { 86 | display: none; 87 | position: absolute; 88 | background-color: #292626; 89 | min-width: 100px; 90 | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); 91 | z-index: 1; 92 | } 93 | 94 | .dropdown-content a { 95 | float: none; 96 | color: white; 97 | padding: 12px 16px; 98 | text-decoration: none; 99 | display: block; 100 | text-align: left; 101 | } 102 | 103 | /* Add a grey background color to dropdown links on hover */ 104 | .dropdown-content a:hover { 105 | color: #ff7200; 106 | } 107 | 108 | /* Show the dropdown menu on hover */ 109 | .dropdown:hover .dropdown-content { 110 | display: block; 111 | } -------------------------------------------------------------------------------- /frontend/src/components/Home/Home.js: -------------------------------------------------------------------------------- 1 | import { useState, useEffect } from "react"; 2 | 3 | import Login from "../Login/Login"; 4 | import './Home.css'; 5 | 6 | export default function Home(props){ 7 | // localStorage.clear(); 8 | const [isLoggedIn, setLoggedIn] = useState("false"); 9 | 10 | useEffect(() => { 11 | setInterval(() => { 12 | const loginStatus = localStorage.getItem("loginStatus"); 13 | setLoggedIn(loginStatus); 14 | }, []) 15 | }, 5000) 16 | 17 | if (!isLoggedIn || isLoggedIn === "false"){ 18 | return( 19 |
20 |
21 |

Eventify

22 |

23 | ‘ Simplify ’ your Events 24 |

25 |

26 | Explore the magic of our application 'EVENTIFY'. 27 | A go-to solution for managing amazing events effortlessly. From easy sign-ups to registering and managing event schedules, our user-friendly platform has everything you need for a flawless experience. 28 | With powerful features, trust our system to handle the details, and let's bring your event vision to life!!! 29 |

30 |
31 | 32 | 33 |
34 | ) 35 | 36 | } 37 | 38 | else{ 39 | return( 40 |
41 |
42 |

Eventify

43 |

44 | ‘ Simplify ’ your Events 45 |

46 |

47 | Explore the magic of our application 'EVENTIFY'. 48 | A go-to solution for managing amazing events effortlessly. From easy sign-ups to registering and managing event schedules, our user-friendly platform has everything you need for a flawless experience. 49 | With powerful features, trust our system to handle the details, and let's bring your event vision to life!!! 50 |

51 |
52 |
53 | 54 | ) 55 | } 56 | 57 | } -------------------------------------------------------------------------------- /frontend/src/components/ContactPage/ContactPage.css: -------------------------------------------------------------------------------- 1 | .contact-container { 2 | max-width: 600px; 3 | margin: 0 auto; 4 | padding: 20px; 5 | color: #fff; 6 | } 7 | 8 | .contact-form{ 9 | max-width: 600px; 10 | margin-top: auto; 11 | margin-bottom: 50px; 12 | padding: 25px; 13 | border: 1px solid #ddd; 14 | border-radius: 8px; 15 | background: linear-gradient(to top, rgba(0,0,0,0.5)50%,rgba(0,0,0,0.5)50%); 16 | transform: translate(0%,25px); 17 | position: center; 18 | } 19 | .contact-container h1, h2{ 20 | text-align: center; 21 | font-family: sans-serif; 22 | background-color: #fff; 23 | color: #ff7200; 24 | font-size: 22px; 25 | border-radius: 10px; 26 | margin-bottom: 30px; 27 | padding: 8px; 28 | } 29 | 30 | .formGroup { 31 | margin-bottom: 20px; 32 | } 33 | 34 | .contact-label { 35 | font-weight: bold; 36 | color: #fff; 37 | font-size: 15px; 38 | letter-spacing: 1px; 39 | font-family: sans-serif; 40 | margin-bottom: 10px; 41 | } 42 | 43 | .contact-input { 44 | width: 90%; 45 | padding: 10px; 46 | margin: 5px 0; 47 | background: transparent; 48 | border-bottom: 1px solid #ff7200; 49 | border-top: 1px solid #ff7200; 50 | border-right: 1px solid #ff7200; 51 | border-left: 1px solid #ff7200; 52 | color: #fff; 53 | font-size: 15px; 54 | letter-spacing: 1px; 55 | margin-top: 5px; 56 | font-family: sans-serif; 57 | } 58 | 59 | .contact-input:focus{ 60 | outline: none; 61 | } 62 | 63 | .contact-button { 64 | min-height: 55px; 65 | width: 100%; 66 | background-color: #ff7200;; 67 | color: black; 68 | font-weight: bold; 69 | font-size: 20px; 70 | letter-spacing: 1px; 71 | font-family: sans-serif; 72 | padding: 10px; 73 | border: none; 74 | border-radius: 4px; 75 | cursor: pointer; 76 | margin-top: 30px; 77 | border: none; 78 | cursor: pointer; 79 | transition: all 0.2s ease; 80 | } 81 | 82 | .contact-button:hover { 83 | background-color: #ff7200;; 84 | } 85 | 86 | .contact-error { 87 | color:#ff7200; 88 | margin-top: 5px; 89 | } 90 | 91 | .feedbackList { 92 | list-style: none; 93 | padding: 0; 94 | } 95 | 96 | .feedbackItem { 97 | margin-bottom: 20px; 98 | border: 1px solid #ddd; 99 | padding: 10px; 100 | border-radius: 4px; 101 | } 102 | -------------------------------------------------------------------------------- /frontend/src/components/Login/Login.js: -------------------------------------------------------------------------------- 1 | import { useState } from "react"; 2 | import Axios from "axios"; 3 | import { Link } from "react-router-dom"; 4 | 5 | export default function Login(){ 6 | const [name, setName] = useState(""); 7 | const [password, setPassword] = useState(""); 8 | 9 | 10 | const handleClick = () => { 11 | if (!password){ 12 | alert("Password cannot be empty"); 13 | return; 14 | } 15 | 16 | if (name === "admin" && password === "123"){ 17 | localStorage.setItem("loginStatus", true); 18 | localStorage.setItem("user", name); 19 | alert("Welcome admin"); 20 | } 21 | 22 | else{ 23 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/check-user/" + name) 24 | .then((res) => { 25 | if(res.status === 200) 26 | { 27 | if(res.data != null) 28 | { 29 | if(res.data.password === password){ 30 | localStorage.setItem("loginStatus", true); 31 | localStorage.setItem("user", name); 32 | localStorage.setItem("userID", res.data._id); 33 | console.log(localStorage.getItem("userID")); 34 | 35 | } 36 | else 37 | alert("Incorrect username or password"); 38 | 39 | } 40 | else 41 | alert("Incorrect username or password"); 42 | } 43 | else 44 | Promise.reject(); 45 | }) 46 | .catch((err) => alert(err)); 47 | 48 | } 49 | } 50 | 51 | return( 52 |
53 |

Login

54 | setName(event.target.value)} type="text" name="uname" placeholder="Enter Username Here"/> 55 | setPassword(event.target.value)} type="password" name="" placeholder="Enter Password Here"/> 56 | 57 | 58 |

Don't have an account?
59 | Sign up here

60 | 61 | 62 |
63 | ) 64 | } -------------------------------------------------------------------------------- /frontend/src/components/UserList/UserListRow.js: -------------------------------------------------------------------------------- 1 | import Axios from "axios"; 2 | import { Link } from "react-router-dom"; 3 | 4 | function UserListRow(props) { 5 | const { _id, username, fullName, email, phone, password, bookedEvents} = props.obj; //Object destruction 6 | 7 | const handleClick = () => { 8 | Axios.all([ 9 | Axios.delete("https://eventhub-t514.onrender.com/eventRoute/delete-user/" + _id) 10 | .then((res) => { 11 | if (res.status === 200) { 12 | alert("Record deleted successfully"); 13 | window.location.reload(); 14 | } 15 | else 16 | Promise.reject(); 17 | }) 18 | .catch((err) => alert(err)), 19 | 20 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/event-list") 21 | .then((eventResponse) => { 22 | if(eventResponse.status === 200){ 23 | //Finding events where current user is registered 24 | const collectedEvents = eventResponse.data; 25 | for(let i = 0; i < collectedEvents.length; i++){ 26 | let eventData = collectedEvents[i]; 27 | eventData.registeredUsers = eventData.registeredUsers.filter((user) => user.username !== username); 28 | 29 | Axios.put("https://eventhub-t514.onrender.com/eventRoute/update-event/" + collectedEvents[i]._id, eventData) 30 | .then((updateResponse) => { 31 | if(updateResponse.status === 200) 32 | console.log("Event details updated") 33 | 34 | else 35 | Promise.reject(); 36 | }) 37 | .catch((updateError) => alert(updateError)) 38 | } 39 | } 40 | }) 41 | 42 | ]) 43 | 44 | } 45 | 46 | return ( 47 | 48 | {username} 49 | {fullName} 50 | {email} 51 | {phone} 52 | 53 | 54 | 57 | 58 | 59 | ) 60 | } 61 | export default UserListRow; 62 | -------------------------------------------------------------------------------- /frontend/src/components/Event/UpdateEvent.js: -------------------------------------------------------------------------------- 1 | import { useState, useEffect } from "react"; 2 | import Axios from "axios"; 3 | import EventRegistrationForm from "./eventform"; 4 | 5 | function UpdateEvent() { 6 | const [formData, setFormData] = useState({ 7 | nameValue: "", 8 | startValue: "", 9 | endTimeValue: "", 10 | dateValue: "", 11 | placeValue: "", 12 | descriptionValue: "", 13 | clubValue: "", 14 | slotsValue: "", 15 | }); 16 | 17 | const [registeredUsersValue, setRegisteredUsersValue] = useState(); 18 | 19 | useEffect(() => { 20 | const eventID = localStorage.getItem("eventID"); 21 | Axios.get("https://eventhub-t514.onrender.com/eventRoute/check-event/" + eventID) 22 | .then(response => { 23 | { 24 | // console.log(response.data); 25 | setFormData( 26 | { 27 | 28 | nameValue: `${response.data.name}`, 29 | startTimeValue: `${response.data.startTime}`, 30 | endTimeValue: `${response.data.endTime}`, 31 | dateValue: `${response.data.date}`, 32 | placeValue: `${response.data.place}`, 33 | descriptionValue: `${response.data.description}`, 34 | clubValue: `${response.data.club}`, 35 | slotsValue: `${response.data.slots}`, 36 | 37 | 38 | } 39 | ); 40 | setRegisteredUsersValue(response.data.registeredUsers); 41 | console.log("From event page:",formData, registeredUsersValue); 42 | } 43 | }) 44 | .catch(error => { 45 | console.error('Error fetching event details:', error); 46 | }); 47 | }, [formData.nameValue, formData.startTimeValue, formData.endTimeValue, 48 | formData.dateValue, formData.placeValue, formData.descriptionValue, 49 | formData.clubValue, formData.slotsValue]); 50 | 51 | 52 | return( 53 | 66 | ) 67 | }; 68 | export default UpdateEvent; -------------------------------------------------------------------------------- /frontend/src/components/Login/register.css: -------------------------------------------------------------------------------- 1 | .registration-container { 2 | width: 400px; /* Adjust the width as needed */ 3 | margin: 0 auto; 4 | padding: 20px; 5 | border: 1px solid #ccc; 6 | border-radius: 5px; 7 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 8 | text-align: center; 9 | } 10 | 11 | .registration-container h1 { 12 | text-align: center; 13 | font-family: sans-serif; 14 | background-color: #fff; 15 | color: #ff7200; 16 | font-size: 22px; 17 | border-radius: 10px; 18 | margin-bottom: 30px; 19 | padding: 8px; 20 | } 21 | 22 | .registration-container { 23 | display: flex; 24 | flex-direction: column; 25 | } 26 | /* div { 27 | margin-bottom: 15px; 28 | } */ 29 | .registration-container label { 30 | font-weight: bold; 31 | color: #fff; 32 | font-size: 15px; 33 | letter-spacing: 1px; 34 | font-family: sans-serif; 35 | margin-bottom: 10px; 36 | } 37 | 38 | .registration-container input{ 39 | width: 90%; 40 | padding: 10px; 41 | margin: 5px 0; 42 | background: transparent; 43 | border-bottom: 1px solid #ff7200; 44 | border-top: 1px solid #ff7200; 45 | border-right: 1px solid #ff7200; 46 | border-left: 1px solid #ff7200; 47 | color: #fff; 48 | font-size: 15px; 49 | letter-spacing: 1px; 50 | margin-top: 5px; 51 | font-family: sans-serif; 52 | 53 | } 54 | 55 | .registration-container input:focus{ 56 | outline: none; 57 | } 58 | .registration-container .link{ 59 | font-family: Arial, Helvetica, sans-serif; 60 | font-size: 17px; 61 | padding-top: 20px; 62 | text-align: center; 63 | } 64 | .registration-container .link a{ 65 | text-decoration: none; 66 | color: #ff7200; 67 | } 68 | 69 | .register-error{ 70 | color:#ff7200; 71 | margin-top: 5px; 72 | } 73 | 74 | .registration-container button { 75 | min-height: 55px; 76 | width: 100%; 77 | background-color: #ff7200;; 78 | color: black; 79 | font-weight: bold; 80 | font-size: 20px; 81 | letter-spacing: 1px; 82 | font-family: sans-serif; 83 | padding: 10px; 84 | border: none; 85 | border-radius: 4px; 86 | cursor: pointer; 87 | margin-top: 30px; 88 | border: none; 89 | cursor: pointer; 90 | transition: all 0.2s ease; 91 | } 92 | 93 | .registration-container button:hover { 94 | background-color: #ff7200;; 95 | } 96 | .icons a{ 97 | text-decoration: none; 98 | color: #fff; 99 | } 100 | .icons ion-icon{ 101 | color: #fff; 102 | font-size: 30px; 103 | padding-left: 14px; 104 | padding-top: 5px; 105 | transition: 0.3s ease; 106 | } 107 | .icons ion-icon:hover{ 108 | color: #ff7200; 109 | } 110 | 111 | .button:hover{ 112 | background: #fff; 113 | color: #f4f2f0; 114 | } 115 | 116 | 117 | /* Add any other styling as needed */ 118 | 119 | 120 | 121 | -------------------------------------------------------------------------------- /frontend/src/components/Event/eventform.css: -------------------------------------------------------------------------------- 1 | .eventForm { 2 | max-width: 600px; 3 | margin: 0 auto; 4 | padding: 25px; 5 | border: 1px solid #ddd; 6 | border-radius: 8px; 7 | background: linear-gradient(to top, rgba(0,0,0,0.5)50%,rgba(0,0,0,0.5)50%); 8 | transform: translate(0%,25px); 9 | position: center; 10 | } 11 | .eventForm h1 { 12 | text-align: center; 13 | font-family: sans-serif; 14 | background-color: #fff; 15 | color: #ff7200; 16 | font-size: 22px; 17 | border-radius: 10px; 18 | margin-bottom: 30px; 19 | padding: 8px; 20 | } 21 | .eventForm { 22 | display: flex; 23 | flex-direction: column; 24 | } 25 | div { 26 | margin-bottom: 15px; 27 | } 28 | .eventForm label { 29 | font-weight: bold; 30 | color: #fff; 31 | font-size: 15px; 32 | letter-spacing: 1px; 33 | font-family: sans-serif; 34 | margin-bottom: 10px; 35 | } 36 | .eventForm input{ 37 | width: 90%; 38 | padding: 10px; 39 | margin: 5px 0; 40 | background: transparent; 41 | border-bottom: 1px solid #ff7200; 42 | border-top: 1px solid #ff7200; 43 | border-right: 1px solid #ff7200; 44 | border-left: 1px solid #ff7200; 45 | color: #fff; 46 | font-size: 15px; 47 | letter-spacing: 1px; 48 | margin-top: 5px; 49 | font-family: sans-serif; 50 | 51 | } 52 | 53 | .eventForm input:focus{ 54 | outline: none; 55 | } 56 | .eventForm .link{ 57 | font-family: Arial, Helvetica, sans-serif; 58 | font-size: 17px; 59 | padding-top: 20px; 60 | text-align: center; 61 | } 62 | .eventForm .link a{ 63 | text-decoration: none; 64 | color: #ff7200; 65 | } 66 | select{ 67 | width: 100%; 68 | padding: 8px; 69 | margin-top: 5px; 70 | box-sizing: border-box; 71 | border: 1px solid #ccc; 72 | border-radius: 4px; 73 | } 74 | .error{ 75 | color:#ff7200; 76 | margin-top: 5px; 77 | } 78 | .eventForm textarea { 79 | width: 95%; 80 | padding: 10px; 81 | margin: 5px 0; 82 | background: transparent; 83 | box-sizing: border-box; 84 | border: 1px solid ; 85 | border-radius: 4px; 86 | color: #fff; 87 | font-family: sans-serif; 88 | border-bottom: 1px solid #ff7200; 89 | border-top: 1px solid #ff7200; 90 | border-right: 1px solid #ff7200; 91 | border-left: 1px solid #ff7200; 92 | resize: vertical; 93 | } 94 | .eventForm button { 95 | min-height: 55px; 96 | width: 100%; 97 | background-color: #ff7200;; 98 | color: black; 99 | font-weight: bold; 100 | font-size: 20px; 101 | letter-spacing: 1px; 102 | font-family: sans-serif; 103 | padding: 10px; 104 | border: none; 105 | border-radius: 4px; 106 | cursor: pointer; 107 | margin-top: 30px; 108 | border: none; 109 | cursor: pointer; 110 | transition: all 0.2s ease; 111 | } 112 | 113 | .eventForm button:hover { 114 | background-color: #ff7200;; 115 | } 116 | .icons a{ 117 | text-decoration: none; 118 | color: #fff; 119 | } 120 | .icons ion-icon{ 121 | color: #fff; 122 | font-size: 30px; 123 | padding-left: 14px; 124 | padding-top: 5px; 125 | transition: 0.3s ease; 126 | } 127 | .icons ion-icon:hover{ 128 | color: #ff7200; 129 | } 130 | .button:hover{ 131 | background: #fff; 132 | color: #f4f2f0; 133 | } -------------------------------------------------------------------------------- /frontend/src/App.js: -------------------------------------------------------------------------------- 1 | import { HashRouter, Routes, Route } from 'react-router-dom'; 2 | import { useState, useEffect } from 'react'; 3 | import ProtectedRoute from './components/Protected/ProtectedRoute'; 4 | import ProtectedRouteAdmin from './components/Protected/ProtectedRoutedAdmin'; 5 | 6 | import Navbar from './components/Navbar/Navbar'; 7 | import Footer from "./components/Footer/Footer"; 8 | import Home from './components/Home/Home'; 9 | import ContactPage from './components/ContactPage/ContactPage'; 10 | 11 | import Register from './components/Login/Register'; 12 | import UserUpdateForm from './components/UserProfile/EditProfile'; 13 | import UserList from './components/UserList/UserList'; 14 | 15 | import CreateEvent from './components/Event/CreateEvent'; 16 | import EventList from './components/Event/EventList'; 17 | import UpdateEvent from './components/Event/UpdateEvent'; 18 | import BookedEventsList from './components/Event/BookedEventsList'; 19 | 20 | import './App.css'; 21 | 22 | 23 | 24 | function App() { 25 | const [isLoggedIn, setLoggedIn] = useState("false"); 26 | const [user, setUser] = useState(); 27 | 28 | useEffect(() => { 29 | setInterval(() => { 30 | const loginStatus = localStorage.getItem("loginStatus"); 31 | const user = localStorage.getItem("user"); 32 | setLoggedIn(loginStatus); 33 | setUser(user); 34 | }, []) 35 | }, 5000) 36 | 37 | return ( 38 |
39 | 40 | 41 | 42 | {/* General paths */} 43 | }/> 44 | }/> 45 | 46 | {/* User paths */} 47 | }/> 48 | 51 | 52 | 53 | } 54 | 55 | /> 56 | 58 | 59 | } 60 | /> 61 | 62 | 63 | {/* Event Paths */} 64 | 67 | 68 | } 69 | /> 70 | 71 | 74 | 75 | } 76 | /> 77 | 78 | 81 | 82 | 83 | } 84 | /> 85 | 86 | 89 | 90 | } 91 | /> 92 | 93 | 94 |
95 | 96 |
97 | ); 98 | } 99 | 100 | export default App; 101 | -------------------------------------------------------------------------------- /frontend/src/components/Navbar/Navbar.js: -------------------------------------------------------------------------------- 1 | import { useState, useEffect } from "react"; 2 | import {Link} from "react-router-dom"; 3 | 4 | import {BiSolidUserCircle} from "react-icons/bi"; 5 | import Logo from "../../assets/logo_circle.jpg"; 6 | 7 | import "./Navbar.css"; 8 | 9 | export default function Navbar(props){ 10 | const [user, setUser] = useState(); 11 | 12 | useEffect(() => { 13 | setInterval(() => { 14 | const user = localStorage.getItem("user"); 15 | setUser(user); 16 | }, []) 17 | }, 5000) 18 | 19 | const logout = () => { 20 | localStorage.setItem("loginStatus", false); 21 | return localStorage.removeItem("user"); 22 | } 23 | 24 | if (user === "admin"){ 25 | return( 26 | 49 | ) 50 | } 51 | 52 | else if(user){ 53 | return( 54 | 78 | ) 79 | } 80 | else{ 81 | return( 82 | 93 | ) 94 | } 95 | 96 | 97 | 98 | 99 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Event Management System 2 | 3 | The objective of this project is to develop an Event Management System web application that specifically caters towards colleges and club events. The project aims to test our skills in Web Development and become proficient with the MERN techstack. 4 | 5 | # Getting Started with Create React App 6 | 7 | This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). 8 | 9 | ## Available Scripts 10 | 11 | In the project directory, you can run: 12 | 13 | ### `npm start` 14 | 15 | Runs the app in the development mode.\ 16 | Open [http://localhost:3000](http://localhost:3000) to view it in your browser. 17 | 18 | The page will reload when you make changes.\ 19 | You may also see any lint errors in the console. 20 | 21 | ### `npm test` 22 | 23 | Launches the test runner in the interactive watch mode.\ 24 | See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. 25 | 26 | ### `npm run build` 27 | 28 | Builds the app for production to the `build` folder.\ 29 | It correctly bundles React in production mode and optimizes the build for the best performance. 30 | 31 | The build is minified and the filenames include the hashes.\ 32 | Your app is ready to be deployed! 33 | 34 | See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. 35 | 36 | ### `npm run eject` 37 | 38 | **Note: this is a one-way operation. Once you `eject`, you can't go back!** 39 | 40 | If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project. 41 | 42 | Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own. 43 | 44 | You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it. 45 | 46 | ## Learn More 47 | 48 | You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). 49 | 50 | To learn React, check out the [React documentation](https://reactjs.org/). 51 | 52 | ### Code Splitting 53 | 54 | This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting) 55 | 56 | ### Analyzing the Bundle Size 57 | 58 | This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size) 59 | 60 | ### Making a Progressive Web App 61 | 62 | This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app) 63 | 64 | ### Advanced Configuration 65 | 66 | This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration) 67 | 68 | ### Deployment 69 | 70 | This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment) 71 | 72 | ### `npm run build` fails to minify 73 | 74 | This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify) 75 | -------------------------------------------------------------------------------- /backend/controller/eventRoute.js: -------------------------------------------------------------------------------- 1 | const express = require("express"); 2 | const userSchema = require("../model/userSchema"); 3 | const eventSchema = require("../model/eventSchema"); 4 | const feedbackSchema = require("../model/feedbackSchema"); 5 | const eventRoute = express.Router(); 6 | const mongoose = require("mongoose"); 7 | 8 | // -------------------------------------------------------------------------------- 9 | // User 10 | eventRoute.get("/user-list", (req,res) => { 11 | userSchema.find((err, data) => { 12 | if(err) 13 | return err; 14 | else 15 | res.json(data); 16 | }) 17 | }) 18 | eventRoute.post("/create-user", (req,res) => { 19 | userSchema.create(req.body, (err,data) => { 20 | if(err) 21 | return err; 22 | else 23 | res.json(data); 24 | }) 25 | }) 26 | eventRoute.route("/check-user/:uname") 27 | .get((req, res) => { 28 | userSchema.findOne({username: req.params.uname}, (err,data) => { 29 | if(err) 30 | return err; 31 | else 32 | res.json(data); 33 | 34 | }) 35 | }) 36 | 37 | eventRoute.route("/update-user/:id") 38 | .get((req, res) => { 39 | userSchema.findById(mongoose.Types.ObjectId(req.params.id), (err,data) => { 40 | if(err) 41 | return err; 42 | else 43 | res.json(data); 44 | }) 45 | }).put((req, res) => { 46 | userSchema.findByIdAndUpdate(mongoose.Types.ObjectId(req.params.id), 47 | {$set:req.body}, 48 | (err,data) => { 49 | if(err) 50 | return err; 51 | else 52 | res.json(data); 53 | }) 54 | }) 55 | eventRoute.delete("/delete-user/:id",(req,res)=>{ 56 | userSchema.findByIdAndRemove(mongoose.Types.ObjectId(req.params.id), 57 | (err,data)=>{ 58 | if(err) 59 | return err; 60 | else 61 | res.json(data); 62 | }) 63 | }) 64 | 65 | 66 | // ----------------------------------------------------------------------------------------- 67 | // Events 68 | eventRoute.get("/event-list", (req,res) => { 69 | eventSchema.find((err, data) => { 70 | if(err) 71 | return err; 72 | else 73 | res.json(data); 74 | }) 75 | }) 76 | 77 | eventRoute.route("/check-event/:id") 78 | .get((req, res) => { 79 | eventSchema.findById(mongoose.Types.ObjectId(req.params.id), (err,data) => { 80 | if(err) 81 | return err; 82 | else 83 | res.json(data); 84 | }) 85 | }) 86 | 87 | eventRoute.post("/create-event", (req,res) => { 88 | eventSchema.create(req.body, (err,data) => { 89 | if(err) 90 | return err; 91 | else 92 | res.json(data); 93 | }) 94 | }) 95 | 96 | eventRoute.route("/update-event/:id") 97 | .get((req, res) => { 98 | eventSchema.findById(mongoose.Types.ObjectId(req.params.id), (err,data) => { 99 | if(err) 100 | return err; 101 | else 102 | res.json(data); 103 | }) 104 | }).put((req, res) => { 105 | eventSchema.findByIdAndUpdate(mongoose.Types.ObjectId(req.params.id), 106 | {$set:req.body}, 107 | (err,data) => { 108 | if(err) 109 | return err; 110 | else 111 | res.json(data); 112 | }) 113 | }) 114 | eventRoute.delete("/delete-event/:id",(req,res)=>{ 115 | eventSchema.findByIdAndRemove(mongoose.Types.ObjectId(req.params.id), 116 | (err,data)=>{ 117 | if(err) 118 | return err; 119 | else 120 | res.json(data); 121 | }) 122 | }) 123 | 124 | 125 | 126 | // Feedback 127 | eventRoute.post("/post-feedback", (req,res) => { 128 | feedbackSchema.create(req.body, (err,data) => { 129 | if(err) 130 | return err; 131 | else 132 | res.json(data); 133 | }) 134 | }) 135 | 136 | module.exports = eventRoute; -------------------------------------------------------------------------------- /frontend/src/components/Home/Home.css: -------------------------------------------------------------------------------- 1 | /* *{ 2 | margin: 0; 3 | padding: 0; 4 | 5 | } */ 6 | 7 | 8 | 9 | .search{ 10 | width: 330px; 11 | float: left; 12 | margin-left: 270px; 13 | } 14 | 15 | .srch{ 16 | font-family: 'Times New Roman'; 17 | width: 200px; 18 | height: 40px; 19 | background: transparent; 20 | border: 1px solid #ff7200; 21 | margin-top: 13px; 22 | color: #fff; 23 | border-right: none; 24 | font-size: 16px; 25 | float: left; 26 | padding: 10px; 27 | border-bottom-left-radius: 5px; 28 | border-top-left-radius: 5px; 29 | } 30 | 31 | .btn{ 32 | width: 100px; 33 | height: 40px; 34 | background: #ff7200; 35 | border: 2px solid #ff7200; 36 | margin-top: 13px; 37 | color: #fff; 38 | font-size: 15px; 39 | border-bottom-right-radius: 5px; 40 | border-bottom-right-radius: 5px; 41 | transition: 0.2s ease; 42 | cursor: pointer; 43 | } 44 | .btn:hover{ 45 | color: #000; 46 | } 47 | 48 | .btn:focus{ 49 | outline: none; 50 | } 51 | 52 | .srch:focus{ 53 | outline: none; 54 | } 55 | 56 | .content{ 57 | width: 1200px; 58 | height: auto; 59 | margin: auto; 60 | color: #fff; 61 | position: relative; 62 | } 63 | 64 | .content .par{ 65 | padding-left: 20px; 66 | padding-bottom: 25px; 67 | font-family: Arial; 68 | letter-spacing: 1.2px; 69 | line-height: 30px; 70 | } 71 | 72 | .content h1{ 73 | font-family: 'Roboto Slab'; 74 | font-size: 50px; 75 | padding-left: 20px; 76 | margin-top: 8%; 77 | letter-spacing: 2px; 78 | color: #ff7200; 79 | } 80 | 81 | .tagline{ 82 | font-size: 22px; 83 | padding-left: 20px; 84 | color: rgb(243, 243, 114); 85 | } 86 | 87 | .about{ 88 | font-family: 'Nunito'; 89 | font-size: 20px; 90 | padding-left: 20px; 91 | letter-spacing: 2px; 92 | padding-bottom: 25px; 93 | margin-right: 35%; 94 | line-height: 30px; 95 | color: #fff; 96 | } 97 | 98 | .content span{ 99 | color: #ff7200; 100 | font-size: 65px 101 | } 102 | 103 | .form{ 104 | width: 250px; 105 | height: 380px; 106 | background: linear-gradient(to top, rgba(0,0,0,0.8)50%,rgba(0,0,0,0.8)50%); 107 | position: absolute; 108 | top: -20px; 109 | left: 870px; 110 | transform: translate(0%,-5%); 111 | border-radius: 10px; 112 | padding: 25px; 113 | } 114 | 115 | .form h2{ 116 | width: 220px; 117 | font-family: sans-serif; 118 | text-align: center; 119 | color: #ff7200; 120 | font-size: 22px; 121 | background-color: #fff; 122 | border-radius: 10px; 123 | margin: 2px; 124 | padding: 8px; 125 | } 126 | 127 | .form input{ 128 | width: 240px; 129 | height: 35px; 130 | background: transparent; 131 | border-bottom: 1px solid #ff7200; 132 | border-top: none; 133 | border-right: none; 134 | border-left: none; 135 | color: #fff; 136 | font-size: 15px; 137 | letter-spacing: 1px; 138 | margin-top: 30px; 139 | font-family: sans-serif; 140 | } 141 | 142 | .form input:focus{ 143 | outline: none; 144 | } 145 | 146 | ::placeholder{ 147 | color: #fff; 148 | font-family: Arial; 149 | } 150 | 151 | .btnn{ 152 | width: 240px; 153 | height: 40px; 154 | background: #ff7200; 155 | border: none; 156 | margin-top: 30px; 157 | font-size: 18px; 158 | border-radius: 10px; 159 | cursor: pointer; 160 | color: #fff; 161 | transition: 0.4s ease; 162 | } 163 | .btnn:hover{ 164 | background: #fff; 165 | color: #ff7200; 166 | } 167 | .btnn a{ 168 | text-decoration: none; 169 | color: #000; 170 | font-weight: bold; 171 | } 172 | .form .link{ 173 | font-family: Arial, Helvetica, sans-serif; 174 | font-size: 17px; 175 | padding-top: 20px; 176 | text-align: center; 177 | } 178 | .form .link a{ 179 | text-decoration: none; 180 | color: #ff7200; 181 | } 182 | .liw{ 183 | padding-top: 15px; 184 | padding-bottom: 10px; 185 | text-align: center; 186 | } 187 | .icons a{ 188 | text-decoration: none; 189 | color: #fff; 190 | } 191 | .icons ion-icon{ 192 | color: #fff; 193 | font-size: 30px; 194 | padding-left: 14px; 195 | padding-top: 5px; 196 | transition: 0.3s ease; 197 | } 198 | .icons ion-icon:hover{ 199 | color: #ff7200; 200 | } 201 | -------------------------------------------------------------------------------- /frontend/events.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Task 4 8 | 9 | 10 | 41 | 42 | 43 | 44 |
45 |

Events list

46 |
47 | 48 |
49 | Image 1 50 |
51 | 52 |

Event Name

53 |

event details:.....

54 | 55 |

view event

56 |
57 |
58 |
59 | Image 1 60 |
61 | 62 |

Event Name

63 |

event details:.....

64 | 65 |

view event

66 |
67 |
68 |
69 | Image 1 70 |
71 | 72 |

Event Name

73 |

event details:.....

74 | 75 |

view event

76 |
77 |
78 |
79 | Image 1 80 |
81 | 82 |

Event Name

83 |

event details:.....

84 | 85 |

view event

86 |
87 |
88 |
89 | Image 1 90 |
91 | 92 |

Event Name

93 |

event details:.....

94 | 95 |

view event

96 |
97 |
98 | 99 | 100 |
101 | 102 |
103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /frontend/src/components/ContactPage/ContactPage.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import Axios from "axios"; 3 | 4 | import './ContactPage.css'; 5 | 6 | class ContactPage extends Component { 7 | constructor(props) { 8 | super(props); 9 | this.state = { 10 | name: '', 11 | email: '', 12 | message: '', 13 | feedback: [], 14 | errors: {}, 15 | }; 16 | } 17 | handleInputChange = (e) => { 18 | const { name, value } = e.target; 19 | this.setState({ 20 | [name]: value, 21 | }); 22 | }; 23 | handleSubmit = (e) => { 24 | e.preventDefault(); 25 | const errors = {}; 26 | if (!this.state.name.trim()) { 27 | errors.name = 'Name is required'; 28 | } 29 | if (!this.state.email.trim()) { 30 | errors.email = 'Email is required'; 31 | } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(this.state.email)) { 32 | errors.email = 'Invalid email format'; 33 | } 34 | if (!this.state.message.trim()) { 35 | errors.message = 'Message is required'; 36 | } 37 | 38 | if (Object.keys(errors).length === 0) { 39 | const newFeedback = { 40 | name: this.state.name, 41 | email: this.state.email, 42 | message: this.state.message, 43 | }; 44 | 45 | Axios.post("https://eventhub-t514.onrender.com/eventRoute/post-feedback", newFeedback) 46 | .then((res) => { 47 | if(res.status === 200) 48 | alert("Thank you for your feedback!"); 49 | else 50 | Promise.reject(); 51 | }) 52 | .catch((err) => alert(err)); 53 | 54 | this.setState((prevState) => ({ 55 | feedback: [...prevState.feedback, newFeedback], 56 | errors: {}, 57 | })); 58 | 59 | 60 | this.setState({ 61 | name: '', 62 | email: '', 63 | message: '', 64 | }); 65 | } else { 66 | 67 | this.setState({ 68 | errors, 69 | }); 70 | } 71 | }; 72 | 73 | render() { 74 | return ( 75 |
76 |

Contact Us

77 |
78 | {/* Contact form */} 79 |
80 | 83 | 91 | {this.state.errors && this.state.errors.name && ( 92 | {this.state.errors.name} 93 | )} 94 |
95 |
96 | 99 | 107 | {this.state.errors && this.state.errors.email && ( 108 | {this.state.errors.email} 109 | )} 110 |
111 |
112 | 115 |