A bookmark workspace with search, custom tags, and a command palette. Next.js and Supabase handle account-based storage; optimistic updates keep editing responsive.
Click to zoom- Role
- Full-stack developer
- Timeline
- Active Development
- Team
- Solo
- Status
- In development
Built with
- Next.js
- TypeScript
- Tailwind CSS
- Supabase
- cmdk
The brief
Saved links lose their value when finding one takes longer than searching the web again. Bookmrk gives bookmarks a searchable workspace with custom tags and keyboard commands.
The work spans the dashboard, bookmark and tag APIs, authentication, and the client-side data layer that keeps the interface in sync with saved data.
Implementation notes
Optimistic editing
Adds, edits, and deletes update the interface before the request finishes. Failed requests restore the previous state and show an error, so responsiveness does not hide a failed save.
Account-aware storage
Supabase authentication and per-request database clients connect browser sessions to server routes. Row-level security scopes bookmark and tag queries to the signed-in user.
Keyboard access
A Cmd-K palette exposes actions such as adding a bookmark, focusing search, and clearing filters. A shared data hook keeps these controls separate from persistence logic.
Current result
A web workspace with bookmark CRUD, custom tags, search, and keyboard actions. The current implementation persists bookmarks through a signed-in account.
A workflow for finding things again
Save a URL with a title and tags, then narrow the collection through search and tag filters. Editing and deletion stay within the same workspace. The command palette makes common actions available without moving between menus.
Where the engineering sits
The useBookmarks hook owns the bookmark list and mutation helpers. API routes handle requests, while the database access functions work with the user's Supabase session. This separates interface state, HTTP handling, and storage instead of placing all three inside the page.
The useful detail is the rollback path. An optimistic interface needs to recover from a rejected request as carefully as it handles a successful one. The hook replaces temporary entries with saved records and removes them if creation fails.
"You have a right to perform your prescribed duty, but you are not entitled to the fruits of actions."
Design by SahilCodex
© 2026. Built with hands.