MERN Case Study

Nexus Mission Control

A cyberpunk-styled order-operations dashboard uploaded into the repo as a full client and server build. It combines a Vite + React interface with an Express + MongoDB API for order visibility, reporting, and admin control.

ReactViteNode.jsExpressMongoDBSSE

Start a Project See More Work

Operations UI

Dashboard layout built around order flow, metrics, filters, and operator speed.

Live Sync

Server-sent events keep the interface aware of new activity and latest order changes.

Role Control

Admin and viewer roles gate write access while still supporting read-only monitoring.

MongoDB Model

Order data, summaries, and search filters are backed by MongoDB through Mongoose.

Frontend

What ships in the client

Sidebar navigation with dashboard sections for operations, analytics, customers, and settings.
Metrics cards and summary reporting for revenue, order volume, repeat rate, and active orders.
Order table, filters, pagination, and order composer flow for fast operational edits.
Optional login flow with admin and viewer roles stored through token-based auth.

Backend

What ships in the API

Express API with health, login, logout, orders, order summary, and settings endpoints.
MongoDB persistence through Mongoose for orders and operational reporting.
Server-sent events stream at `/api/orders/stream` for live sync status updates.
Protected mutations via role checks so create and update actions stay admin-only.

API Surface

API surface captured from the uploaded project

GET    /api/health
POST   /api/login
POST   /api/logout
GET    /api/orders
POST   /api/orders
PATCH  /api/orders/:id
GET    /api/orders/summary
GET    /api/orders/stream
GET    /api/settings
PATCH  /api/settings/auth

The uploaded Express server boots with MongoDB, exposes auth-aware routes, and can also serve the built client from the same server when `SERVE_CLIENT=true`.

Delivery

Delivery notes

Client stack: React 18 + Vite
API stack: Node.js + Express
Database: MongoDB + Mongoose
Deployment mode supported: single-server serve-client flow or split frontend/API setup

This project is now represented in the website as a real portfolio case study. I did not wire it as a public live demo inside this Next.js app because the uploaded folder is a separate React client plus Express server, not a static site bundle.