Hey folks 👋
I’ve been using this little tool privately for about a year and finally shipped it: FireScope — a Chrome DevTools panel for Firestore.
It watches your app’s Firestore traffic in real time, shows queries/params at a glance, and lets you export code (Angular/Node/Flutter/JSON). No setup — install it and open DevTools → FireScope.
- Chrome Web Store: https://chromewebstore.google.com/detail/firescope/dpjiajgeckamnpncihnhldkehaghaffd
- GitHub (open-source): https://github.com/omar-dulaimi/firescope
TL;DR
- ✅ Live capture of Firestore requests (reads/writes/queries)
- ✅ Clear details: method, path, params, body
- ✅ One-click export to Angular / Node / Flutter / JSON
- ✅ Collections view for quick navigation
- ✅ Lives in Chrome DevTools → FireScope
- 🧩 Open-source — feedback & PRs welcome
This fills a gap I kept hitting as a Firestore/Firebase dev: I want to see exactly what my app sends and quickly prototype the same call in code.
Who is it for?
- You debug Firestore a lot and want a focused view (not the noisy Network tab).
- You share reproducible snippets with teammates.
- You like pasting a ready export and tweaking it.
Screenshots
Quick Start
- Install from the Chrome Web Store.
- Open your app and press F12 for DevTools.
- Switch to the “FireScope” panel.
- Interact with your app (reads/writes/queries).
- Click any request for details or Export.
Not seeing anything? Trigger a Firestore action (load a page that reads data or press a button that writes).
What you can export
- Angular (service-friendly snippets)
- Node (server-side helpers)
- Flutter (Dart snippets)
- JSON (raw shape you can keep in docs/tests)
Exports are a starting point you paste and tweak.
Privacy
FireScope runs fully in your browser. It inspects your tab’s Firestore network activity via DevTools — no servers, no tracking.
Troubleshooting
- FireScope panel missing? Close/reopen DevTools, then reload the page.
- Empty list? Perform an action that hits Firestore (read/write/query).
- Still stuck? Open an issue on GitHub with a short repro.
Roadmap / Ideas
- More export targets (React, Svelte, Next.js server actions, etc.)
- Filters & search, pin a session
- “Copy as test” templates
- Shortcuts and better empty states
Have an idea? Drop an issue on GitHub.
Links & Feedback
- Install: https://chromewebstore.google.com/detail/firescope/dpjiajgeckamnpncihnhldkehaghaffd
- Source: https://github.com/omar-dulaimi/firescope
I’d love your thoughts. Try it on a real project, tell me what’s missing, and if you hit any rough edges, please open an issue. PRs are super welcome 🙏
Thanks for reading!
Top comments (0)