A modern, automated gate and garage access management system for organizations. GateGuard streamlines vehicle and user registration, approval, and monitoring with real-time analytics and robust security. The project consists of a robust backend (Node.js, Express, MongoDB) and a fast, beautiful frontend (React, Vite, Tailwind CSS).
- Automated Registration & Approval: Employees and vehicle owners register; admins review and approve access.
- Live Stream Monitoring: Real-time video feeds from garage gates and cameras.
- Access Logs: Searchable, filterable, and paginated logs of all entries and exits.
- Role-Based Management: Admin and user management with invitation flows.
- Dashboard Analytics: Visualize entries, trends, and car counts with interactive charts.
- Gate Control: Open/close the garage gate directly from the dashboard.
- Profile & Settings: Manage personal and garage information.
- Dark Mode: Seamless light/dark theme support.
- Responsive UI: Works beautifully on all devices.
- Secure REST API: Authentication, authorization, and data validation.
- Email Notifications: For invitations and approvals.
git clone https://github.com/your-username/gateguard.git
cd gateguardcd Back-End
cp config.env.example config.env # Edit config.env with your MongoDB URI and secrets
npm install
npm start- The backend will start on the port specified in your
config.env(default: 5000).
Open a new terminal:
cd Front-end
npm install
npm run dev- The frontend will start on http://localhost:5173.
- Framework: React (with Vite)
- Styling: Tailwind CSS
- Routing: react-router-dom
- State/Data: @tanstack/react-query
- Form Handling: react-hook-form
- Charts: Recharts
- UI/UX: Framer Motion, PrimeReact, Lucide React Icons
- Notifications: react-hot-toast
- Runtime: Node.js
- Framework: Express.js
- Database: MongoDB (with Mongoose)
- Authentication: JWT, bcryptjs
- Email: Nodemailer
- Security: Helmet, CORS, express-rate-limit, xss-clean, express-mongo-sanitize, hpp
- WebSockets: ws (for live features)
- Video Processing: fluent-ffmpeg
- Validation: validator
/
├── Back-End/ # Backend API and server
├── Front-end/ # Frontend React app
├── LICENSE
└── README.md
Back-End/
│
├── src/
│ ├── config/ # Configuration files
│ ├── controllers/ # Route controllers (business logic)
│ ├── interfaces/ # TypeScript interfaces
│ ├── models/ # Mongoose models (data schemas)
│ ├── routes/ # Express route definitions
│ ├── types/ # Custom TypeScript types
│ ├── utils/ # Utility functions (error handling, email, file upload, etc.)
│ ├── app.ts # Express app setup
│ ├── server.ts # Server entry point
│ └── wsServer.ts # WebSocket server
├── config.env # Environment variables
├── package.json
└── tsconfig.json
Front-end/
│
├── src/
│ ├── assets/ # Images, videos, SVGs, etc.
│ ├── components/ # Reusable UI components
│ ├── context/ # React context providers
│ ├── features/ # Feature-based modules (domain logic/UI)
│ ├── pages/ # Top-level routed pages
│ ├── services/ # API and service logic
│ ├── ui/ # Layout and UI primitives
│ ├── utils/ # Utility functions and constants
│ ├── main.jsx # App entry point
│ └── main.css # Global styles
├── index.html
├── package.json
└── vite.config.js
This project is licensed under the MIT License. See the LICENSE file for details.
Frontend:
-
Salah Swefy – salahm.swefy@gmail.com – GitHub: SalahMSwefy
-
Saad Samir – saadsamir7177@gmail.com – GitHub: SaadSamir7
Backend:
- Youssef Megahed – youssefmegahed99n@gmail.com – GitHub: YoussefMegahed
Ai:
- Youssef Elzedy – youssefelzedy90@gmail.com – GitHub: youssefelzedy
_GateGuard – Secure, automate, and monitor your garage access with ease.