TL;DR: Tiny SPA to capture and group browser JS errors — filters, charts, demo and server modes. Try the "Create test error" button on the demo: https://kate8382.github.io/error-logger-viewer/
Why I built it
What happens when a small idea turns into a few months of late‑night debugging? I wanted a lightweight tool that helps developers see runtime problems quickly, group similar errors, and track fix progress. The app runs in two modes: demo (localStorage) for quick tests and server (Node.js + Express + LowDB) for persistent storage.
What it does
- Captures global JS errors (window.onerror, onunhandledrejection), resource load errors, and fetch failures.
- Groups and deduplicates errors by message/stack to reduce noise.
- Searchable, sortable error table with status tracking (new / in progress / fixed / ignored) and comments.
- Charts for error dynamics (day/week/month), visual filters and quick actions.
- Supports light/dark themes and i18n (EN/RU).
- Accessibility features: ARIA labels and keyboard navigation.
- Tests: Jest (unit) and Cypress (E2E). CI via GitHub Actions.
Quick architecture
Frontend: vanilla ES6 + Webpack, modular components for table, charts and modals.
Backend (optional): Node/Express + LowDB for a simple REST API. Client switches between demo (localStorage) and server modes via a small adapter.
Demo & source
- Live demo: https://kate8382.github.io/error-logger-viewer/
- Source: https://github.com/kate8382/error-logger-viewer
Screenshots
Dashboard — overview, quick stats and theme example.
Error table — search, sorting, status and actions.
Charts — error dynamics by period (week/month/year).
Lessons learned
- Grouping errors across browsers and minified stacks is tricky — tests and careful matching rules help a lot.
- Small UX details (filters, inline status change) make the tool useful for teams.
- Next steps: add a project registration flow (projectKey + drop‑in client snippet) and a lightweight admin to manage multiple projects.
Feedback welcome — what metrics would you add to a simple error dashboard?
Top comments (5)
This is a great tool for developers who want a lightweight alternative to heavy monitoring services like Sentry. The ability to switch between a localStorage demo mode and a full Node.js backend makes it very flexible for both quick tests and small-scale production use.
Thanks so much, Rahul! Your comment and the compliment to my 'sandbox' couldn't have come at a better time.
Honestly, before this, only one experienced developer saw the potential in this project and offered to contribute by setting up Docker for faster integration. But right after merging the Docker PR, everything else literally fell apart — tests, npm run dev, you name it. 🫣😰
It was one of those desperate moments where you look at the amazing things others are building and wonder, 'Why am I even doing this?'. Instead of learning Docker, I now have to do a massive 'spring cleaning' in my project once I finish a client's music app.
But your comment gave me a second wind and the motivation to keep going. Thank you truly for that! 🥰
It’s a developer’s update or note about improving an error tracking tool, mentioning:
Challenges like grouping errors across browsers and minified stacks.
Useful UX features (filters, inline status change).
Planned next steps (project registration flow, lightweight admin).
Request for feedback on metrics for a simple error dashboard.
Hey James, thanks for checking it out!
It’s a tiny single-page app I built to track JavaScript errors in the browser — kind of like a lightweight error logger and viewer. You can log errors manually or catch them globally, then view and filter them in a simple UI.
Still a work in progress, but I’d love any feedback or ideas!
P.S. This is actually my first post on dev.to — so I just wanted to share the project itself, not write a full-blown article (yet!).
Thanks for checking this out! If you try the demo, please share one small thing you’d change — your feedback will help shape the next improvements. ❤️