A comprehensive volunteer management platform built with React, TypeScript, and modern web technologies. This application connects volunteers with charitable organizations, manages events, and tracks volunteer activities.
- Secure account registration and login
- Discover and filter events by category, location, and date
- Register for events with real-time confirmations
- Web Push notifications for updates
- Social features: posts, comments, and likes on event channels
- Personal dashboard with activity tracking
- Profile management
- Create, edit, and delete events with comprehensive validation
- Approve or reject volunteer registrations
- Mark participants as completed
- Export participant lists (CSV)
- Dashboard with event analytics
- Manage event discussion channels
- Profile management
- Approve or reject new events
- Lock/unlock user accounts
- Export system data (CSV)
- System-wide dashboard overview
- Full access to all features
- Node.js 18.0.0 or higher
- npm 9.0.0 or higher
- Modern browser (Chrome, Edge, Firefox)
# Clone the repository
git clone https://github.com/yourusername/volunteerhub.git
cd volunteerhub
# Install dependencies
npm install
# Start development server
npm run devOpen your browser to http://localhost:3001
npm run build
npm run previewAll demo accounts use the password: demo123
| Role | Name | |
|---|---|---|
| Admin | [email protected] | Admin User |
| Manager | [email protected] | Sarah Manager |
| Manager | [email protected] | Mike Thompson |
| Volunteer | [email protected] | Alex Volunteer |
Plus 100 additional volunteer accounts with emails like [email protected]
- Frontend: React 18 + TypeScript
- Styling: Tailwind CSS
- State Management: React Context API
- Routing: React Router v6
- Validation: Yup
- Build Tool: Vite
- Database: IndexedDB (client-side)
- Security: SHA-256 password hashing, JWT tokens
- Architecture Guide - System design patterns
- Grading Checklist - Implementation compliance
- Security Implementation - Security features
- Demo Presentation Plan - Presentation guide
✅ SHA-256 password hashing with salt ✅ JWT authentication ✅ XSS protection ✅ CSRF tokens ✅ Role-based access control ✅ HTTPS enforcement
- Bundle size: 310 KB (97 KB gzipped)
- 15 lazy-loaded components
- Real-time updates every 10-15s
- Code splitting with Vite
Clear database for fresh start:
// Open browser console (F12)
localStorage.clear();
indexedDB.deleteDatabase('VolunteerHubDB');
location.reload();Academic project for Web Application Development course.
Built with ❤️ using React + TypeScript Making a difference, together 🤝