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

At a glance

React + Material UI; Google OAuth sign-in; vault state in Context API.
AES-256-CTR encryption before MySQL write; plaintext only returned on explicit decrypt.
JWT in HTTP-only cookies with CSRF validation and rate limiting on sensitive routes.

Client routes

/ (password dashboard)
/login (Google OAuth entry)
/auth/callback (OAuth redirect handler)

Express API

GET /auth/url (Google OAuth authorization URL)
GET /auth/token · GET /auth/logged_in (OAuth callback and session check)
POST /auth/logout (clear JWT cookie)
GET /passwords (list encrypted entries for the current user)
POST /passwords · PUT /passwords/:id (create or update a vault entry)
DELETE /passwords/:id (delete a vault entry)
GET /passwords/decrypt/:id (reveal decrypted secret on demand)

Deploy & data

Separate client and server apps (encrypted credentials in MySQL on Railway; Google OAuth for identity; JWT never exposed to client-side JavaScript).

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 — Express MVC]
    oauth[Google OAuth + JWT cookies]
    api[REST API — password CRUD]
    crypto[AES-256-CTR — Node crypto]
    oauth --> api --> crypto
  end
  mysql[(MySQL — Railway)]
  google[Google OAuth 2.0]
  router -->|Sign in, session| oauth
  ctx -->|Vault CRUD| api
  ui -->|Decrypt on reveal| crypto
  crypto --> mysql
  oauth --> google

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