HN Showcase
Back to browse
GitHub Repository

One keyboard shortcut to make your entire app demo-safe.

2 starsTypeScript

React Redact – One keyboard shortcut to make your app demo-safe

by bilater·Mar 2, 2026·1 point·0 comments
Visit ProjectView on HN

AI Analysis

●●SolidSolve My ProblemCozy

One keystroke to blur PII for screenshares; zero dependencies, visual-only helper.

Strengths
  • •Zero dependencies, tree-shakeable, TypeScript-strict — minimal overhead for an optional feature.
  • •Auto-detection of emails, SSNs, credit cards, IPs plus manual <Redact> wrapping covers common PII cases.
  • •Keyboard shortcut + URL param toggle is convenient UX; clearly scoped as demo-only, not security.
Weaknesses
  • •Solves a real but narrow friction point — most teams either refactor data layers or use separate demo accounts.
  • •Visual-only redaction offers false sense of security if DOM inspection reveals real data; explicitly disclaims this.
Target Audience

Frontend developers, SaaS teams doing live demos or product presentations.

Post Description

react-redact is a zero-dependency React “demo-safe mode” you can toggle with a single keyboard shortcut.

Wrap your app in <RedactProvider> and hit Cmd+Shift+X (or Ctrl+Shift+X) to instantly blur, mask, or replace marked (or auto-detected) PII like emails, phone numbers, SSNs, credit cards, and IPs.

It’s a visual-only helper for demos and screenshares (it does not remove data from the DOM), and it’s Next.js and TypeScript friendly.

Similar Projects