The Backpocket web app at backpocket.my is the full-featured experience. Built with Next.js 16 and React 19, it provides the complete set of features including rich note editing, domain management, and keyboard shortcuts.
Tech stack
| Technology | Purpose |
|---|
| Next.js 16 | React framework with App Router |
| React 19 | UI library |
| Tailwind CSS | Styling |
| Convex | Real-time backend |
| Clerk | Authentication |
Dashboard
The dashboard is your home base. It shows:
- All Saves — Your complete library with search and filters
- Favorites — Starred saves for quick access
- Archive — Saves you’ve archived (hidden from main list)
- Collections — Browse by collection
- Tags — Browse by tag
The sidebar provides navigation between these views, and the main area shows the save list with a detail panel.
Keyboard shortcuts
The web app is keyboard-friendly for power users:
| Shortcut | Action |
|---|
N | Open quick add modal (new save) |
/ | Focus search bar |
F | Toggle favorite on selected save |
E | Toggle archive on selected save |
Esc | Close modal or deselect |
? | Show keyboard shortcut reference |
The quick add modal (N) supports paste — just press N, paste a URL, and hit Enter. Your save is created in under 2 seconds.
Quick add modal
The quick add modal is the primary save interface on web:
- Press
N or click + Save
- Paste a URL
- Metadata auto-extracts (title, description, thumbnail)
- Add tags, collection, visibility, and note
- Press Enter or click Save
Features:
- Duplicate detection — Warns if the URL already exists
- Tag autocomplete — Type to search or create tags
- Smart suggestions — Tags suggested based on domain affinity
- Collection selection — Optionally add to a collection (default tags auto-applied)
Rich note editor
The web app includes a full WYSIWYG markdown editor for save notes, built on Novel:
- Slash commands (
/) for blocks (headings, lists, quotes, code)
- Floating toolbar for inline formatting (bold, italic, links, code)
- Live markdown shortcuts (type
## for heading, - for list)
- Full markdown rendering with syntax-highlighted code blocks
Learn more about the note editor →
Domain management
The web app is the only platform where you can manage custom domains:
- Add domains — Connect your own domain to your public space
- DNS configuration — View required DNS records
- Verification — Check domain status
- Set default domain — Choose which domain is primary
Learn more about custom domains →
Settings
The web app provides full access to all settings:
| Section | What you can configure |
|---|
| Profile | Name, bio, avatar, slug |
| Public Space | Visibility, theme, layout, custom domains |
| Appearance | Light/dark/system theme |
| Data Export | Download all your data as JSON |
