A comprehensive full-stack web application for managing college events, built with the MERN stack (MongoDB, Express, React, Node.js).
| Feature | Description |
|---|---|
| User Authentication | Secure signup and login using JWT and Bcrypt |
| Event Management | Create, update, and manage events with rich details |
| Registration System | Users can register for events with automatic confirmations |
| QR Code Integration | Generate and scan QR codes for ticketing/check-in |
| PDF Generation | Generate event tickets, certificates, and reports |
| File Uploads | Image handling using Multer and Cloudinary |
| Interactive Dashboard | Data visualization with Chart.js |
| Role-Based Access | Secure permissions for organizers, participants, and admins |
| Email Notifications | Integrated via Nodemailer for confirmations and updates |
| Attendance Tracking | Real-time check-in with QR code scanning |
| Technology | Purpose |
|---|---|
| React 19 | UI framework |
| Vite | Build tool |
| Redux Toolkit | State management |
| Tailwind CSS 4 | Styling |
| Radix UI | Accessible components |
| Framer Motion | Animations |
| React Router DOM | Routing |
| React Hook Form + Zod | Form handling |
| Chart.js | Data visualization |
| Lucide React | Icons |
| Technology | Purpose |
|---|---|
| Node.js 22 | Runtime environment |
| Express.js 5 | Web framework |
| MongoDB 8 | Database |
| Mongoose | ODM |
| JWT | Authentication |
| Cloudinary | File storage |
| Nodemailer | Email service |
| PDFKit / pdf-lib | PDF generation |
| QRCode | QR code generation |
Event-management/
├── client/ # Frontend React application
│ ├── src/
│ │ ├── assets/ # Static assets (images, icons)
│ │ ├── components/ # Reusable UI components
│ │ │ ├── auth/ # Authentication components
│ │ │ ├── dashboard/ # Dashboard widgets
│ │ │ ├── layout/ # Layout components
│ │ │ └── ui/ # Base UI components
│ │ ├── pages/ # Page components
│ │ ├── state/ # Redux store & slices
│ │ ├── lib/ # Utilities & schemas
│ │ ├── constants/ # App constants
│ │ ├── App.jsx # Root component
│ │ └── main.jsx # Entry point
│ ├── index.html # HTML template
│ └── package.json
│
├── server/ # Backend Express application
│ ├── src/
│ │ ├── config/ # Configuration files
│ │ ├── controllers/ # Route handlers
│ │ ├── middlewares/ # Custom middleware
│ │ ├── models/ # Mongoose schemas
│ │ ├── routes/ # API routes
│ │ ├── utils/ # Helper functions
│ │ └── index.js # Entry point
│ └── package.json
│
└── README.md # This file
- Node.js 18+ and npm
- MongoDB (local or Atlas)
- Git
-
Clone the repository
git clone <repository-url> cd Event-management
-
Set up the server
cd server npm install # Create .env file (see Configuration below) npm run dev
-
Set up the client
cd ../client npm install npm run dev -
Access the application
- Frontend: http://localhost:5173
- Backend API: http://localhost:5000
Create a .env file in the server directory:
# Server
PORT=5000
# Database
MONGO_URI=mongodb://localhost:27017/eventmanagement
# Or for MongoDB Atlas:
# MONGO_URI=mongodb+srv://<username>:<password>@cluster.mongodb.net/eventmanagement
# Authentication
JWT_SECRET=your-super-secret-jwt-key
JWT_EXPIRES_IN=7d
# Cloudinary (File uploads)
CLOUDINARY_CLOUD_NAME=your-cloud-name
CLOUDINARY_API_KEY=your-api-key
CLOUDINARY_API_SECRET=your-api-secret
# Email (Nodemailer)
EMAIL_USER=your-email@gmail.com
EMAIL_PASS=your-app-password
# Frontend URL (for CORS)
CLIENT_URL=http://localhost:5173Create a .env file in the client directory:
VITE_API_URL=http://localhost:5000/api
VITE_APP_NAME=EventHubContributions are welcome! Please feel free to submit a Pull Request.
This project is licensed under the ISC License.
Built with ❤️ for college event organizers