DEV Community

Dev Nestio
Dev Nestio

Posted on

I built a browser-only Keyboard Shortcut Reference — VS Code, Chrome & Mac, searchable, 91 tests

Ever find yourself constantly Googling keyboard shortcuts mid-task? I built a free, browser-only Keyboard Shortcut Reference that lets you search across VS Code, Chrome, and Mac shortcuts instantly — no server, no tracking, no install.

Live Tool

👉 https://devnestio.pages.dev/keyboard-shortcut-ref/

What it does

  • Search by keyword — type anything and it filters across all apps and categories in real time
  • Filter by app — VS Code, Chrome, Mac
  • Filter by category — Editor, Navigation, Terminal, etc.
  • Copy shortcut — click any shortcut to copy it to clipboard
  • 100% client-side — no backend, works offline once loaded

Key shortcuts covered

VS Code: Multi-cursor editing, integrated terminal, file navigation, refactoring, debugging

Chrome DevTools: Element inspection, console shortcuts, network panel, source debugging

Mac OS: Spotlight, Mission Control, screenshot tools, text editing, window management

Tech stack

  • Pure Vanilla JS (zero dependencies)
  • Single HTML file, ~400 lines
  • CSS Grid for card layout
  • Hosted on Cloudflare Pages

Testing

Built a Node.js test suite that validates:

  • All shortcut entries have app, category, action, and keys fields
  • Search filtering works correctly across fields
  • App and category filters produce correct subsets
  • Clipboard copy integration
  • SEO meta tags and accessibility attributes

91 tests, all passing ✅

Why browser-only?

Keyboard shortcuts are reference data — static, small, and perfect for a pure frontend tool. No API calls needed, loads instantly, and your queries stay private.

The entire tool is a single HTML file you could download and run locally.


All tools live at devnestio.pages.dev — a growing collection of free browser-only developer utilities.

Feedback welcome in the comments!

Top comments (0)