Mercure-Hub: How Mercure-hub works

This documentation is part of the Getting started guide. You can view the complete guide here: How to get started with Mercure-hub.

👋 Welcome to the Stackhero documentation!

Stackhero offers a fully managed Mercure-Hub cloud service, designed to simplify and ensure reliable real-time data delivery. You benefit from:

  • Unlimited requests and message sizes for complete flexibility.
  • A custom domain with integrated HTTPS security (for example, https://real-time.your-company.com).
  • One-click updates to keep your hub up to date effortlessly.
  • High performance and enhanced security on a private, dedicated infrastructure.
  • Multiple available regions: 🇪🇺 Europe and 🇺🇸 USA for low-latency delivery.

Get started quickly: it takes just 5 minutes to launch your Mercure-Hub cloud hosting environment and start sending real-time updates to your applications.

Consider a scenario where a customer is viewing a book with the ID 1.

On the front end, you subscribe to the topic /books/1 on Mercure-hub using the Server-Sent Events (SSE) API, a native HTML5 feature. With around 10 lines of JavaScript code and no need for external libraries, this approach remains both straightforward and efficient.

On the back end, when a book is purchased, you send an HTTP request to Mercure-hub to update the stock. For instance, if there are 7 books with the ID 1 and a user buys one, the updated stock becomes 6.

Your back end sends { stockCount: 6 } to the topic /books/1 on Mercure-hub so that every user viewing that book instantly receives the updated stock count. This process requires only an HTTP request from the back end and just a few lines of code on the front end.

This principle can be used to push data from the server to the client, between clients, or even between servers.