← Back to projects

Lockit

Password manager with Google OAuth, AES-256 encryption at rest, and a Material UI vault.

  • #AES256Encryption
  • #OAuthLogin
  • #CredentialVault
  • #PasswordStrengthScoring
  • #SearchAndFilter

Project overview

Lockit is a full-stack password manager that encrypts credentials before they reach MySQL, authenticates users with Google OAuth, and exposes a Material UI dashboard for organizing, searching, and copying passwords—with real-time strength feedback and category filters.

Engineering challenges

  • Encrypting credentials with AES-256-CTR before MySQL writes while only decrypting on demand via GET /passwords/decrypt/:id—so list, search, and filter work on metadata without loading every secret into the browser at once.
  • Combining Google OAuth (/auth/url, /auth/token) with JWTs in HTTP-only cookies, CSRF checks, and rate limiting on sensitive routes—keeping sessions secure without blocking normal dashboard use.
  • Structuring the Express MVC API with pooled MySQL connections and input validation so password CRUD stays user-scoped, while React Context and Axios keep auth state aligned across protected routes.

Features

  • AES-256-CTR encryption before storage; decrypt endpoint for revealing individual entries
  • Google OAuth 2.0 with JWT sessions in HTTP-only cookies
  • CSRF protection and rate limiting on API routes
  • Password strength validation with real-time feedback
  • Categories (Social, Finance, Work, Personal), search, filter, and copy-to-clipboard
  • Dark-theme Material UI dashboard, responsive across devices

Architecture

flowchart TB
  subgraph fe [1. Frontend — React]
    router[React Router — protected routes]
    ctx[Context API — auth and vault state]
    ui[Material UI — dashboard and forms]
    router --> ctx --> ui
  end
  subgraph be [2. Backend — Node.js + Express MVC]
    oauth[Google OAuth + JWT cookies]
    api[REST API — password CRUD]
    crypto[AES-256-CTR — Node crypto]
    oauth --> api --> crypto
  end
  subgraph data [3. Data and auth]
    mysql[(MySQL — Railway)]
    google[Google OAuth]
  end
  ui -->|Login, logout, session check| oauth
  ui -->|List, create, update, delete| api
  ui -->|Reveal decrypted secret| crypto
  crypto --> mysql
  oauth --> google

Separate client and server apps. Passwords are encrypted on the server before MySQL storage; the browser never stores plaintext vault data. Database hosted on Railway.

Technologies used

Frontend

React 18, Material UI, Context API, React Router, Axios

Backend

Node.js, Express (MVC), JWT, Google OAuth, CSRF, rate limiting

Data & security

MySQL (Railway), AES-256-CTR, HTTP-only cookies