{"id":31696620,"url":"https://github.com/ananta2545/password-generator","last_synced_at":"2026-05-10T07:54:13.187Z","repository":{"id":318533584,"uuid":"1071060091","full_name":"Ananta2545/password-generator","owner":"Ananta2545","description":"A modern, privacy-first password generator and vault application with client-side AES-256 encryption, built with Next.js 15, TypeScript, and MongoDB.","archived":false,"fork":false,"pushed_at":"2025-10-07T18:50:36.000Z","size":260,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-10-07T19:41:19.236Z","etag":null,"topics":["aes-256","mongodb","nextjs","qrcode","speakeasyapi","typescript"],"latest_commit_sha":null,"homepage":"https://password-generator-rho-seven-58.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Ananta2545.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-10-06T20:09:32.000Z","updated_at":"2025-10-07T18:50:48.000Z","dependencies_parsed_at":"2025-10-07T19:41:24.576Z","dependency_job_id":null,"html_url":"https://github.com/Ananta2545/password-generator","commit_stats":null,"previous_names":["ananta2545/password-generator"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/Ananta2545/password-generator","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ananta2545%2Fpassword-generator","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ananta2545%2Fpassword-generator/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ananta2545%2Fpassword-generator/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ananta2545%2Fpassword-generator/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ananta2545","download_url":"https://codeload.github.com/Ananta2545/password-generator/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ananta2545%2Fpassword-generator/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278981518,"owners_count":26079640,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-08T02:00:06.501Z","response_time":56,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["aes-256","mongodb","nextjs","qrcode","speakeasyapi","typescript"],"created_at":"2025-10-08T17:09:53.772Z","updated_at":"2025-10-08T17:09:56.771Z","avatar_url":"https://github.com/Ananta2545.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# 🔐 Secure Password Manager \u0026 Vault\n\n\u003e A modern, privacy-first password generator and vault application with client-side AES-256 encryption, built with Next.js 15, TypeScript, and MongoDB.\n\n[![Next.js](https://img.shields.io/badge/Next.js-15.5.4-black?logo=next.js)](https://nextjs.org/)\n[![TypeScript](https://img.shields.io/badge/TypeScript-5.0-blue?logo=typescript)](https://www.typescriptlang.org/)\n[![MongoDB](https://img.shields.io/badge/MongoDB-Atlas-green?logo=mongodb)](https://www.mongodb.com/)\n\n---\n\n## 📺 Demo Video\n\n# with 2FA: \n\nhttps://github.com/user-attachments/assets/07cc6982-84be-4fc0-9d09-9d4e4e263bd8\n\n# Without 2FA: \n\n\n\nhttps://github.com/user-attachments/assets/5257cb7e-71aa-453a-9564-c2fc8988ea84\n\n---\n\n## 📸 Screenshots\n\n### Landing Page\n\u003cimg width=\"1919\" height=\"967\" alt=\"image\" src=\"https://github.com/user-attachments/assets/2de0a0ad-1876-4d22-b3db-c2dbcb45fc58\" /\u003e\n\n### Dashboard page\n\u003cimg width=\"1903\" height=\"970\" alt=\"image\" src=\"https://github.com/user-attachments/assets/b1513f37-a16d-4d36-895a-471180f7e412\" /\u003e\n\n\n### Password Generator\n\u003cimg width=\"1902\" height=\"969\" alt=\"image\" src=\"https://github.com/user-attachments/assets/83192c26-3aeb-4cd8-97f6-b98fd2457087\" /\u003e\n\n\n### Secure Vault\n\u003cimg width=\"1919\" height=\"971\" alt=\"image\" src=\"https://github.com/user-attachments/assets/81674db1-a3a5-40f7-9929-184992e3b5f5\" /\u003e\n\n\n### 2FA Authentication\n\u003cimg width=\"1919\" height=\"971\" alt=\"image\" src=\"https://github.com/user-attachments/assets/90b231f3-91c3-41aa-bff5-a306b9dc89f4\" /\u003e\n\n\n### Dark/Light Theme\n\u003cimg width=\"1919\" height=\"969\" alt=\"image\" src=\"https://github.com/user-attachments/assets/d78f8357-9d11-45ca-8338-d3092ddabba3\" /\u003e\n\n\n### Mobile Responsive\n\u003cimg width=\"469\" height=\"791\" alt=\"image\" src=\"https://github.com/user-attachments/assets/10e6d997-24ed-4603-8fec-4a602373ded2\" /\u003e\n\u003cimg width=\"449\" height=\"764\" alt=\"image\" src=\"https://github.com/user-attachments/assets/aa751a86-fbfb-45f0-b671-bce5ca00b90a\" /\u003e\n\n---\n\n## 🌟 Features\n\n### 🎲 Password Generator\n- **Customizable Length:** 4-64 characters with slider control\n- **Character Types:** Uppercase, lowercase, numbers, symbols\n- **Exclude Ambiguous:** Option to exclude 0/O, 1/l/I characters\n- **Real-time Strength:** Visual password strength indicator (Weak/Medium/Strong)\n- **One-Click Copy:** Copy to clipboard with visual feedback\n- **Auto-Clear:** Clipboard automatically clears after 15 seconds for security\n- **Quick Save:** Direct \"Save to Vault\" button\n\n### 🔒 Secure Vault\n- **Client-Side Encryption:** AES-256-CBC encryption before data leaves browser\n- **Zero-Knowledge:** Server never sees plaintext passwords\n- **Full CRUD:** Create, Read, Update, Delete vault items\n- **Rich Fields:** Title, username, password, URL, notes\n- **Tags System:** Organize items with multiple tags\n- **Search \u0026 Filter:** Real-time search across all fields\n- **Show/Hide Passwords:** Toggle password visibility\n- **Copy Protection:** Auto-clear clipboard after 15 seconds\n- **Encryption Key Validation:** Verifies correct key before decryption\n\n### 🔐 Authentication \u0026 Security\n- **Email/Password Auth:** Secure user registration and login\n- **Password Hashing:** bcrypt with salt rounds for password storage\n- **JWT Tokens:** httpOnly cookies with secure token management\n- **2FA (TOTP):** Time-based One-Time Password with QR code\n- **Vault Access Control:** Requires password + 2FA verification to access vault\n- **Session Management:** Encryption key stored only in memory (cleared on logout)\n- **Protection:** CSRF protection, XSS prevention, secure headers\n\n### 🎨 Modern UI/UX\n- **Theme Toggle:** Beautiful dark/light mode with smooth transitions\n- **Animations:** Framer Motion for smooth, professional animations\n- **Responsive Design:** Mobile-first, works on all screen sizes\n- **Loading States:** Skeleton loaders and spinners\n- **Error Handling:** User-friendly error messages\n- **Accessibility:** ARIA labels, keyboard navigation\n- **Custom Modals:** Beautiful confirmation dialogs for delete/2FA\n\n---\n\n## 🏗️ Project Structure\n\n```\npassword-generator/\n├── app/\n│   ├── api/                          # API Routes\n│   │   ├── auth/                     # Authentication endpoints\n│   │   │   ├── signin/route.ts       # User login\n│   │   │   ├── signup/route.ts       # User registration\n│   │   │   ├── logout/route.ts       # User logout\n│   │   │   ├── enable-2fa/route.ts   # Generate 2FA secret\n│   │   │   ├── verify-enable-2fa/    # Verify and enable 2FA\n│   │   │   ├── disable-2fa/route.ts  # Disable 2FA\n│   │   │   └── verify-2fa/route.ts   # Verify 2FA token\n│   │   ├── generator/route.ts        # Password generation API\n│   │   ├── vault/                    # Vault CRUD operations\n│   │   │   ├── route.ts              # GET (all items), POST (create)\n│   │   │   ├── [id]/route.ts         # GET, PUT, DELETE by ID\n│   │   │   ├── count/route.ts        # Get item count\n│   │   │   └── verify-access/route.ts # Verify vault access\n│   │   └── TestAPI/                  # Development test endpoints\n│   │       ├── JwtTest/route.ts      # Test JWT verification\n│   │       └── MongoTest/route.ts    # Test MongoDB connection\n│   │\n│   ├── auth/                         # Authentication pages\n│   │   ├── signin/page.tsx           # Login page with 2FA\n│   │   └── signup/page.tsx           # Registration with optional 2FA\n│   │\n│   ├── components/                   # Reusable components\n│   │   ├── Header.tsx                # Navigation with user menu\n│   │   ├── TwoFactorEnableModal.tsx  # 2FA setup modal\n│   │   ├── TwoFactorDisableModal.tsx # 2FA disable modal\n│   │   └── VaultAccessModal.tsx      # Vault password/2FA verification\n│   │\n│   ├── contexts/                     # React Context providers\n│   │   ├── UserContext.tsx           # User authentication state\n│   │   ├── VaultContext.tsx          # Vault items \u0026 encryption key\n│   │   └── GeneratorContext.tsx      # Generated password state\n│   │\n│   ├── dashboard/page.tsx            # Dashboard with stats\n│   ├── generator/page.tsx            # Password generator page\n│   ├── vault/page.tsx                # Vault management page\n│   ├── profile/page.tsx              # User profile \u0026 2FA settings\n│   │\n│   ├── lib/                          # Utility libraries\n│   │   ├── mongodb.ts                # MongoDB connection\n│   │   ├── jwt.ts                    # JWT token generation/verification\n│   │   ├── encryption.ts             # AES-256 encryption/decryption\n│   │   ├── passwordGenerator.ts      # Password generation logic\n│   │   └── twoFactorAuth.ts          # 2FA (TOTP) utilities\n│   │\n│   ├── models/                       # MongoDB schemas\n│   │   ├── user.ts                   # User model with 2FA support\n│   │   └── vaultItem.ts              # Vault item model (encrypted)\n│   │\n│   ├── types/                        # TypeScript types\n│   │   └── auth.ts                   # Authentication types\n│   │\n│   ├── layout.tsx                    # Root layout with providers\n│   ├── page.tsx                      # Landing page\n│   ├── globals.css                   # Global styles with CSS variables\n│   └── favicon.ico                   # App favicon\n│\n├── public/                           # Static assets\n│   ├── file.svg\n│   ├── globe.svg\n│   ├── next.svg\n│   ├── vercel.svg\n│   └── window.svg\n│\n├── .env.local                        # Environment variables (not in repo)\n├── .env.example                      # Environment template\n├── .gitignore                        # Git ignore rules\n├── eslint.config.mjs                 # ESLint configuration\n├── next.config.ts                    # Next.js configuration\n├── package.json                      # Dependencies\n├── postcss.config.mjs                # PostCSS configuration\n├── tsconfig.json                     # TypeScript configuration\n└── README.md                         # This file\n```\n\n---\n\n## 🔒 Encryption \u0026 Security Deep Dive\n\n### Client-Side AES-256-CBC Encryption\n\nThis application implements **true zero-knowledge architecture** using AES-256-CBC encryption via `crypto-js`.\n\n#### Why AES-256-CBC?\n\n| Feature | Description |\n|---------|-------------|\n| **Industry Standard** | NSA-approved for classified information up to TOP SECRET |\n| **Symmetric Encryption** | Same key encrypts and decrypts (fast, efficient) |\n| **256-bit Key** | 2^256 possible keys = computationally infeasible to brute force |\n| **Browser Compatible** | Pure JavaScript implementation, no native crypto needed |\n| **Battle-Tested** | Used by millions of applications worldwide |\n\n#### Why crypto-js?\n\n- **Lightweight:** ~80KB minified, perfect for browser environments\n- **No Dependencies:** Works without Node.js crypto module\n- **Wide Adoption:** 8M+ weekly downloads on npm\n- **Regular Updates:** Active maintenance and security patches\n- **PBKDF2 Support:** Built-in key derivation (10,000 iterations)\n\n#### Security Flow\n\n```\n┌─────────────────────────────────────────────────────────────┐\n│                    USER AUTHENTICATION                       │\n│  1. User logs in → JWT token issued                         │\n│  2. User navigates to Vault → Password/2FA verification     │\n└─────────────────────────────────────────────────────────────┘\n                            ↓\n┌─────────────────────────────────────────────────────────────┐\n│                   ENCRYPTION KEY SETUP                       │\n│  3. User provides encryption key (never sent to server)     │\n│  4. Key stored ONLY in React Context (memory)               │\n│  5. Key validated against existing encrypted data           │\n└─────────────────────────────────────────────────────────────┘\n                            ↓\n┌─────────────────────────────────────────────────────────────┐\n│                   SAVING TO VAULT                            │\n│  6. User enters password data in browser                    │\n│  7. Client-side: AES.encrypt(data, key) → Base64 blob      │\n│  8. Send encrypted blob to server via HTTPS                 │\n│  9. Server stores encrypted blob in MongoDB                 │\n└─────────────────────────────────────────────────────────────┘\n                            ↓\n┌─────────────────────────────────────────────────────────────┐\n│                  RETRIEVING FROM VAULT                       │\n│  10. Server sends encrypted blobs to client                 │\n│  11. Client-side: AES.decrypt(blob, key) → plaintext       │\n│  12. Display decrypted data in browser                      │\n│  13. On logout: Clear encryption key from memory            │\n└─────────────────────────────────────────────────────────────┘\n```\n\n#### What Server Can See vs. Cannot See\n\n| Server CAN See | Server CANNOT See |\n|----------------|-------------------|\n| ✅ User email (for login) | ❌ User password (bcrypt hash only) |\n| ✅ Encrypted blobs (Base64) | ❌ Plaintext passwords |\n| ✅ Tags (for filtering) | ❌ Titles, usernames, URLs, notes |\n| ✅ Timestamps | ❌ Encryption key (never transmitted) |\n| ✅ Item count | ❌ Actual vault content |\n\n---\n\n## 🛠️ Tech Stack\n\n### Frontend\n| Technology | Version | Purpose |\n|------------|---------|---------|\n| **Next.js** | 15.5.4 | React framework with App Router |\n| **React** | 18.3.1 | UI library |\n| **TypeScript** | 5.7.2 | Type safety |\n| **Tailwind CSS** | 4.0 | Utility-first styling |\n| **Framer Motion** | 11.15.0 | Animations |\n| **Lucide React** | 0.468.0 | Icon library |\n| **next-themes** | 0.4.4 | Theme management |\n\n### Backend\n| Technology | Version | Purpose |\n|------------|---------|---------|\n| **Next.js API Routes** | 15.5.4 | RESTful API |\n| **MongoDB** | Latest | NoSQL database |\n| **Mongoose** | 8.9.4 | MongoDB ODM |\n| **JWT** | 9.0.2 | Authentication tokens |\n| **bcryptjs** | 2.4.3 | Password hashing |\n\n### Security\n| Technology | Version | Purpose |\n|------------|---------|---------|\n| **crypto-js** | 4.2.0 | AES-256 encryption |\n| **Speakeasy** | 2.0.0 | TOTP 2FA |\n| **qrcode** | 1.5.4 | QR code generation |\n\n---\n\n## 🚀 Getting Started\n\n## Local setup: \n\n### Prerequisites\n\nBefore you begin, ensure you have the following installed:\n\n- **Node.js:** v18.0.0 or higher\n- **npm/yarn/pnpm:** Latest version\n- **MongoDB:** Local installation or MongoDB Atlas account\n- **Git:** For cloning the repository\n\n### Installation\n\n#### 1. Clone the Repository\n\n```bash\ngit clone https://github.com/Ananta2545/password-generator.git\ncd password-generator\n```\n\n#### 2. Install Dependencies\n\n```bash\nnpm install\n# or\nyarn install\n# or\npnpm install\n```\n\n#### 3. Set Up Environment Variables\n\nCreate a `.env.local` file in the root directory (or rename `.env.example`):\n\n```env\n# MongoDB Connection String\nMONGODB_URI=mongodb://localhost:27017/password-vault\n\n# For MongoDB Atlas (recommended for production):\n# MONGODB_URI=mongodb+srv://username:password@cluster.mongodb.net/password-vault?retryWrites=true\u0026w=majority\n\n# JWT Secret Key (generate a strong random string)\n# Generate using: node -e \"console.log(require('crypto').randomBytes(32).toString('hex'))\"\nJWT_SECRET=your-super-secret-jwt-key-min-32-characters-long\n\n# Application URL (optional, defaults to localhost:3000)\nNEXT_PUBLIC_APP_URL=http://localhost:3000\n```\n\n\n#### 4. Set Up MongoDB\n\n**MongoDB Atlas (Cloud)**\n1. Create account at [mongodb.com/cloud/atlas](https://www.mongodb.com/cloud/atlas)\n2. Create a free cluster\n3. Get connection string from \"Connect\" → \"Connect your application\"\n4. Add connection string to `.env.local`\n\n#### 5. Run Development Server\n\n```bash\nnpm run dev\n# or\nyarn dev\n# or\npnpm dev\n```\n\n#### 6. Open in Browser\n\nNavigate to [http://localhost:3000](http://localhost:3000)\n\n---\n\n## 📖 Usage Guide\n\n### 1️⃣ First-Time Setup\n\n1. **Sign Up**\n   - Navigate to `/auth/signup`\n   - Enter email and password (min 8 characters)\n   - Optionally enable 2FA during registration\n   - Scan QR code with authenticator app (Google Authenticator, Authy, etc.)\n\n2. **Dashboard**\n   - View total vault items\n   - Quick access to Generator and Vault\n   - See account statistics\n\n3. **Generate Strong Password**\n   - Go to `/generator`\n   - Customize length (4-64 characters)\n   - Select character types (uppercase, lowercase, numbers, symbols)\n   - Click \"Generate New\" until satisfied\n   - Copy to clipboard (auto-clears after 15 seconds)\n\n4. **Save to Vault**\n   - Click \"Save to Vault\" button\n   - Verify identity with password (and 2FA if enabled)\n   - Enter encryption key (remember this!)\n   - Fill in item details (title, username, URL, notes)\n   - Add tags for organization\n   - Click \"Save Item\"\n\n5. **Manage Vault**\n   - Search items by title, username, or tags\n   - Toggle password visibility with eye icon\n   - Copy passwords with auto-clear protection\n   - Edit items with pencil icon\n   - Delete items with custom confirmation modal\n\n---\n\n## 🛡️ Securing Your Vault: 2FA vs No 2FA\n\nChoose your security level based on your needs:\n\n### 🔒 **Option 1: Standard Security (Without 2FA)**\n\n**Best for:** Personal use, less sensitive data, quick access needs\n\n**Setup Steps:**\n1. ✅ Create account (email + password)\n2. ✅ Start using vault immediately\n3. ✅ Access requires: **Password only**\n\n**Vault Access Flow:**\n```\nClick \"Vault\" → Enter Password → Enter Encryption Key → ✅ Access Granted\n```\n\n**Security Level:** 🔒 **Medium**\n- Protected by account password\n- Encrypted with your personal encryption key\n- Faster access (1 verification step)\n\n**When to use:**\n- ✅ You want quick access to your vault\n- ✅ You're the only one using your device\n- ✅ Your passwords are not highly sensitive\n- ✅ You prefer convenience over maximum security\n\n---\n\n### 🔒🔒 **Option 2: Maximum Security (With 2FA)**\n\n**Best for:** Sensitive data, shared devices, maximum protection\n\n**Setup Steps:**\n1. ✅ Create account (email + password)\n2. ✅ Go to **Profile** → Click \"Enable Two-Factor Authentication\"\n3. ✅ Scan QR code with authenticator app (Google Authenticator, Authy, etc.)\n4. ✅ Enter 6-digit code to confirm\n5. ✅ 2FA is now active! 🎉\n\n**Vault Access Flow:**\n```\nClick \"Vault\" → Enter Password + 2FA Code → Enter Encryption Key → ✅ Access Granted\n```\n\n**Security Level:** 🔒🔒 **High**\n- Protected by account password + time-based code\n- Even if password is stolen, attacker needs your phone\n- Encrypted with your personal encryption key\n- Industry-standard TOTP authentication\n\n**When to use:**\n- ✅ You store highly sensitive passwords\n- ✅ You use shared or public computers\n- ✅ You want maximum protection\n- ✅ You have an authenticator app on your phone\n\n**Supported Authenticator Apps:**\n- Google Authenticator (iOS/Android)\n- Microsoft Authenticator (iOS/Android)\n- Authy (iOS/Android/Desktop)\n- 1Password (iOS/Android/Desktop)\n- Any TOTP-compatible app\n\n---\n\n### 📊 **Quick Comparison**\n\n| Feature | Without 2FA 🔒 | With 2FA 🔒🔒 |\n|---------|----------------|---------------|\n| **Setup Time** | Instant | 2 minutes |\n| **Vault Access** | Password only | Password + 6-digit code |\n| **Access Speed** | ~10 seconds | ~15 seconds |\n| **Protection** | Password breach vulnerable | Protected even if password stolen |\n| **Best For** | Quick access, personal use | Maximum security, sensitive data |\n| **Required** | Account password | Account password + phone with authenticator |\n\n---\n\n### 🔄 **Switching Between Security Levels**\n\n**Enable 2FA Later (Upgrade Security):**\n1. Go to **Profile** page\n2. Click **\"Enable Two-Factor Authentication\"**\n3. Scan QR code with authenticator app\n4. Enter verification code\n5. ✅ 2FA now protects your vault\n\n**Disable 2FA (Downgrade Security):**\n1. Go to **Profile** page\n2. Click **\"Disable Two-Factor Authentication\"**\n3. Enter your password + current 2FA code\n4. ✅ 2FA removed, back to password-only\n\n**💡 Pro Tip:** You can enable/disable 2FA anytime without losing your vault data!\n\n---\n\n### 2️⃣ Enabling 2FA (Optional but Recommended)\n\n1. Go to **Profile** (`/profile`)\n2. Click **\"Enable Two-Factor Authentication\"**\n3. Scan QR code with authenticator app:\n   - Google Authenticator (iOS/Android)\n   - Authy (iOS/Android/Desktop)\n   - Microsoft Authenticator\n   - 1Password\n4. Enter 6-digit verification code\n5. ✅ 2FA now active - required for vault access\n\n### 3️⃣ Disabling 2FA\n\n1. Go to **Profile**\n2. Click **\"Disable Two-Factor Authentication\"**\n3. Enter password and current 2FA code\n4. ✅ 2FA removed from account\n\n### 4️⃣ Accessing Vault: Detailed Workflows\n\nThe vault has a **two-layer security system**: Identity Verification + Encryption Key.\n\n#### 🔐 **Scenario A: Accessing Vault WITHOUT 2FA**\n\n```\nStep 1: Navigate to Vault\n┌──────────────────────────────────────────┐\n│  User clicks \"Vault\" in navigation       │\n└──────────────────────────────────────────┘\n                  ↓\nStep 2: Vault Access Verification Modal Appears\n┌──────────────────────────────────────────┐\n│  Modal Title: \"Verify Your Identity\"    │\n│                                          │\n│  [Password Input Field]                  │\n│  ● Enter your account password           │\n│                                          │\n│  [Verify Access Button]                  │\n└──────────────────────────────────────────┘\n                  ↓\nStep 3: Password Verification\n┌──────────────────────────────────────────┐\n│  System checks:                          │\n│  ✓ Password matches bcrypt hash          │\n│  ✓ User is authenticated                 │\n└──────────────────────────────────────────┘\n                  ↓\nStep 4: Encryption Key Prompt Appears\n┌──────────────────────────────────────────┐\n│  Modal Title: \"Enter Encryption Key\"    │\n│                                          │\n│  \"Your encryption key is required to     │\n│   decrypt your vault items. This key     │\n│   is never sent to the server.\"          │\n│                                          │\n│  [Encryption Key Input Field]            │\n│  ● Enter the key you used when saving    │\n│                                          │\n│  [Unlock Vault Button]                   │\n└──────────────────────────────────────────┘\n                  ↓\nStep 5: Key Validation (Client-Side)\n┌──────────────────────────────────────────┐\n│  System validates key by:                │\n│  1. Fetching encrypted items from server │\n│  2. Attempting to decrypt first item     │\n│  3. If successful → Key is correct ✓     │\n│  4. If fails → \"Invalid key\" error ✗     │\n└──────────────────────────────────────────┘\n                  ↓\nStep 6: Vault Unlocked! 🎉\n┌──────────────────────────────────────────┐\n│  ✓ All items decrypted client-side      │\n│  ✓ View, edit, delete, search enabled   │\n│  ✓ Encryption key stored in memory      │\n│  ✓ Key cleared when leaving vault       │\n└──────────────────────────────────────────┘\n```\n\n**User Experience:**\n1. Click \"Vault\" → Enter password → Enter encryption key → Access granted\n2. **Total steps: 2 prompts** (password, then encryption key)\n3. **Time: ~10 seconds**\n\n---\n\n#### 🔐🔐 **Scenario B: Accessing Vault WITH 2FA Enabled**\n\n```\nStep 1: Navigate to Vault\n┌──────────────────────────────────────────┐\n│  User clicks \"Vault\" in navigation       │\n└──────────────────────────────────────────┘\n                  ↓\nStep 2: Vault Access Verification Modal Appears (with 2FA)\n┌──────────────────────────────────────────┐\n│  Modal Title: \"Verify Your Identity\"    │\n│                                          │\n│  [Password Input Field]                  │\n│  ● Enter your account password           │\n│                                          │\n│  [2FA Code Input Field]                  │\n│  ● Enter 6-digit code from your          │\n│    authenticator app (Google Auth,       │\n│    Authy, etc.)                          │\n│                                          │\n│  ⏱️ Code expires every 30 seconds        │\n│                                          │\n│  [Verify Access Button]                  │\n└──────────────────────────────────────────┘\n                  ↓\nStep 3: Password + 2FA Verification\n┌──────────────────────────────────────────┐\n│  System checks:                          │\n│  ✓ Password matches bcrypt hash          │\n│  ✓ 2FA token is valid (TOTP)            │\n│  ✓ Token is within 30-sec window        │\n│  ✓ User is authenticated                 │\n└──────────────────────────────────────────┘\n                  ↓\nStep 4: Encryption Key Prompt Appears\n┌──────────────────────────────────────────┐\n│  Modal Title: \"Enter Encryption Key\"    │\n│                                          │\n│  \"Your encryption key is required to     │\n│   decrypt your vault items. This key     │\n│   is never sent to the server.\"          │\n│                                          │\n│  [Encryption Key Input Field]            │\n│  ● Enter the key you used when saving    │\n│                                          │\n│  [Unlock Vault Button]                   │\n└──────────────────────────────────────────┘\n                  ↓\nStep 5: Key Validation (Client-Side)\n┌──────────────────────────────────────────┐\n│  System validates key by:                │\n│  1. Fetching encrypted items from server │\n│  2. Attempting to decrypt first item     │\n│  3. If successful → Key is correct ✓     │\n│  4. If fails → \"Invalid key\" error ✗     │\n└──────────────────────────────────────────┘\n                  ↓\nStep 6: Vault Unlocked! 🎉\n┌──────────────────────────────────────────┐\n│  ✓ All items decrypted client-side      │\n│  ✓ View, edit, delete, search enabled   │\n│  ✓ Encryption key stored in memory      │\n│  ✓ Key cleared when leaving vault       │\n└──────────────────────────────────────────┘\n```\n\n**User Experience:**\n1. Click \"Vault\" → Enter password + 2FA code → Enter encryption key → Access granted\n2. **Total steps: 2 prompts** (password+2FA, then encryption key)\n3. **Time: ~15 seconds**\n\n---\n\n### 5️⃣ Theme Toggle\n\n- Click moon/sun icon in header\n- Dark mode reduces eye strain\n- Preference saved in browser\n\n---\n\n## 📊 Database Schema\n\n### User Collection\n\n```typescript\n{\n  _id: ObjectId,\n  email: string,              // Unique user email\n  password: string,           // bcrypt hash (not plaintext)\n  twoFactorSecret?: string,   // Encrypted TOTP secret (optional)\n  twoFactorEnabled: boolean,  // 2FA status\n  createdAt: Date,\n  lastLogin?: Date\n}\n```\n\n### VaultItem Collection\n\n```typescript\n{\n  _id: ObjectId,\n  userId: ObjectId,           // Reference to User\n  encryptedData: string,      // Base64 AES-256 encrypted blob containing:\n                              // { title, username, password, url, notes }\n  tags: string[],             // Searchable tags (not encrypted)\n  createdAt: Date,\n  lastModified: Date\n}\n```\n\n---\n\n## 🔧 Development\n\n### Available Scripts\n\n| Command | Description |\n|---------|-------------|\n| `npm run dev` | Start development server (localhost:3000) |\n| `npm run build` | Build production bundle |\n| `npm run start` | Start production server |\n| `npm run lint` | Run ESLint |\n| `npm run type-check` | Run TypeScript compiler check |\n\n### Code Quality\n\n```bash\n# Run linter\nnpm run lint\n\n# Type checking\nnpx tsc --noEmit\n\n# Format code (if Prettier configured)\nnpx prettier --write .\n```\n\n### Environment Variables\n\n| Variable | Required | Description |\n|----------|----------|-------------|\n| `MONGODB_URI` | ✅ Yes | MongoDB connection string |\n| `JWT_SECRET` | ✅ Yes | Secret key for JWT tokens (32+ chars) |\n| `NEXT_PUBLIC_APP_URL` | ❌ No | App URL (defaults to localhost:3000) |\n\n---\n\n## 👨‍💻 Author \u0026 Credits\n\n**Ananta Chatterjee**\n- 🌐 GitHub: [@Anata2545](https://github.com/Ananta2545)\n- 📧 Email: chatterjeeanata091@gmail.com\n- 💼 LinkedIn: [Ananta Chattapadhyay]([https://www.linkedin.com/in/ananta-chatterjee](https://www.linkedin.com/in/ananta-chatterjee-896219245/))\n\n### Built For\n\n**Madquick Digital Agency**\n- 🏢 Company: [Web Development Company Top](https://in.linkedin.com/company/web-development-company-top)\n- 👔 Founder: [Setu Agrawal](https://in.linkedin.com/in/setu-agrawal-1032681aa)\n---\n\n### ⭐ Star this repo if you found it helpful!\n\n**Built with ❤️ by [Ananta](https://github.com/Ananta2545)**\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fananta2545%2Fpassword-generator","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fananta2545%2Fpassword-generator","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fananta2545%2Fpassword-generator/lists"}