Skip to content

Repository files navigation

WireMate

WireMate — Web UI for WireMock

A web UI, dashboard, and management GUI for WireMock.
Design, persist, and publish WireMock stubs from a clean UI. No hand-crafted JSON required.

Java Spring Boot Vue TypeScript PostgreSQL WireMock Docker

WireMate walkthrough

What is WireMate?

WireMate is the web UI and admin dashboard that teams keep wishing WireMock shipped with — a GUI, a persistence layer, and a management API on top of your WireMock mock server. Instead of editing JSON stub files by hand, engineers and QA testers work inside a single web app where every mock has a name and a description, while a Spring Boot backend stores every stub in PostgreSQL and keeps the running WireMock server in sync.

Every stub is persisted to PostgreSQL and grouped into projects, so a "Payment Gateway" mock set and an "Order Service" mock set never collide. From the same dashboard, you can browse live WireMock stubs and search the logs with analytics charts.

The goal is simple: give WireMock a GUI that the whole team can use to manage a mock server and spin up reliable test environments in seconds.

Who it's for

  • Backend engineers who want to stop maintaining stub JSON in a shared Postman collection.
  • QA and integration testers who need to fake downstream services on demand.

What makes it different

  • Everything is persisted. Unlike a bare WireMock server.
  • Projects, not folders. Organise stubs the way you think about them by service, by feature, by team.
  • Sync awareness. A background task continuously diffs your database against the live WireMock server and surfaces drift in the notifications panel.
  • One place for everything. Mocks, active stubs, logs, near misses, and server health all live in the same UI.

Features

  • Visual Mock Builder — Create request/response mappings through an intuitive form: methods, URLs, headers, JSON bodies, delays, and descriptions.
  • Project Management — Organise mocks into projects with search and filtering across your entire workspace.
  • WireMock Stubs Viewer — Browse all active stub mappings on your WireMock server. Filter by method, search by URL, and preview responses in real time.
  • Logs with Analytics — Inspect every request WireMock receives (matched and unmatched) with live charts for method distribution, status codes, and request volume over time.
  • State Control — Monitor server health and perform admin operations from a single dashboard.
  • Clone & Move — Duplicate any mock in one click, or transfer mocks between projects as your needs evolve.
  • Postman Import / JSON Export — Bring existing collections in and export any project for versioning or sharing.
  • Sync Delta Notifications — A background task detects differences between the database and WireMock and surfaces them in-app.
  • One-Click Publish — Push stubs directly to any WireMock server. Go from draft to live mock in seconds.
  • Dark & Light Theme — Switch between dark and light modes; every view adapts seamlessly.
  • Persistent Storage — All mappings are persisted to PostgreSQL. Never lose a stub.
  • Docker-Ready — Spin up the entire stack with Docker Compose in one command.

Screenshots

Projects list
Projects — everything is scoped to a project you own.
Project detail
Project detail — all mocks in one place, with per-mock logs, clone, and move.
Mock editor
Mock editor — guided form for request matching, response, headers, and delays.
WireMock Stubs Viewer
Stubs viewer — live mirror of what's actually running on the WireMock server.
Logs with analytics
Logs — matched vs unmatched, method + status breakdowns, volume over time.
State control and settings
State control — global delays, server health, and admin operations.

How It Works

  1. Create a project — Group your stubs by project. Stay organised from day one.
  2. Build your stubs — Use the UI to define requests, responses, delays, and headers.
  3. Publish to WireMock — Publish instantly. All stubs are persisted in the database.
  4. Monitor & debug — Search through the logs to inspect incoming requests and debug your stubs.

Tech Stack

Backend — Java 25, Spring Boot 4.1.0, Spring Data JPA, PostgreSQL 17, Maven

Frontend — Vue 3.5, TypeScript 6.0, Vite 8, Tailwind CSS 4

Infrastructure — Docker & Docker Compose, Nginx, WireMock 3.13.2

Getting Started

Prerequisites

  • Docker

Run with Docker Compose

The compose file pulls the backend and UI images, so you don't need to build anything locally.

git clone https://github.com/mixaverros88/WireMate.git
cd WireMate
docker compose up -d

This starts

UI at http://localhost:9002/

WireMate at http://localhost:9001/

WireMock at http://localhost:9000/

PostgreSQL at localhost:5432

Project Structure

WireMate/
├── service/                              # Spring Boot backend
├── UI/                                   # Vue 3 frontend
├── .github/workflows/                    # CI / CD (docker-publish.yml)
├── docs/                                 # Logo, demo GIF, screenshots
├── docker-compose.yml

License

This project is licensed under the MIT License.

Upcoming features

  • Scenarios
  • Traffic Recording
  • Response Transformers

About

Web UI for WireMock - design stubs visually, group them into projects, persist to PostgreSQL, browse live stubs and logs, and publish in one click.

Topics

Resources

Stars

11 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages