A secure, responsive, and modern full-stack web application designed for managing user profiles and generating professional digital identity cards.
- π Secure Authentication: User login and registration powered by Firebase Auth.
- π₯οΈ Admin Dashboard: Role-based access to manage user data and view registrations.
-
πͺͺ Digital ID Generation: Real-time ID card generation with precise dimensions (
$2.125" \times 3.375"$ ). - π PDF Export: Seamlessly download the generated ID cards as high-quality PDFs.
- π¨ Glassmorphic UI: A beautiful, dark-themed interface with modern CSS effects.
- π± Fully Responsive: Optimized for mobile, tablet, and desktop views.
- Frontend: HTML5, CSS3 (Flexbox/Grid), JavaScript (ES6+)
- Backend/Database: Firebase (Authentication & Firestore)
- Libraries: html2pdf.js for PDF generation.
- Google Fonts (Segoe UI / Inter).
βββ admin.html # Admin Panel interface βββ admin.js # Logic for admin operations & Firebase rules βββ auth.js # Authentication logic (Login/Signup) βββ index.html # Landing/Auth page βββ portfolio.html # Main User Profile & ID Card view βββ portfolio.js # ID Card generation & PDF logic βββ style.css # Global styles & Glassmorphism UI
1. Clone the Repository:
git clone
https://github.com/mdrajatech03/User-Management-System.git
2. Firebase Setup:
β’ Create a Firebase project at console.firebase.google.com. β’ Enable Authentication and Firestore Database. β’ Copy your Firebase Config and update it in auth.js and admin.js.
3. Deploy:
β’ This project is ready for GitHub Pages or Netlify Drop. Simply drag and drop the folder.
Login Page
ID Card Preview
Admin Panel
Contributions are welcome! Feel free to open an Issue or submit a Pull Request.
This project is licensed under the MIT License. Developed with β€οΈ by Md Raja


