I built a real-time dev panel for Express.js - plug it in with one line of code

The Problem

Every Express developer knows this pain:

• Scatter console.log everywhere just to see what's happening
• No idea which routes are actually registered
• Zero visibility into incoming requests
• Checking CPU/memory by opening a separate tool

I got tired of it. So I built express-dev-panel.

---

What is express-dev-panel?

A lightweight, plug-and-play developer panel for Express.js apps. One line of code gives you a full real-time dashboard in your browser.

import { createPanel } from 'express-dev-panel';

app.use(createPanel(app));

That's it. No config. No boilerplate.

---

What you get

✅ All registered routes in one view
See every GET/POST/PUT/DELETE route your app has without digging through files.

✅ Real-time request logs
Every incoming request with method, path, status code and response time live.

✅ System metrics
CPU usage, memory, uptime at a glance.

✅ Open file directly in your Editor
Click any route and jump straight to the source file in your editor.

---

Installation

npm install express-dev-panel

import express from 'express';
import { createPanel } from 'express-dev-panel';

const app = express();

app.use(createPanel(app));

app.listen(3000, () => {
  console.log('Server running on http://localhost:3000');
});

Panel opens automatically at:

http://localhost:3000/_panel

---

Who is this for?

• Express developers who want faster debugging
• Backend developers tired of blind development
• Anyone building REST APIs with Node.js

---

What's next?

Currently in testing phase. Planning to add:

• Request body inspector
• Error tracking
• Environment variables viewer
• Auth route protection for staging use

---

Feedback welcome!

I'd love to hear from the Dev.to community:

• What feature would make this a must-have for you?
• Would you use this in development only, or staging too?
• What's missing?

Drop a comment below 👇 every piece of feedback shapes the next release!

---