Mercure-Hub: How Mercure-hub works
This documentation is part of the Getting started guide. View the full guide here: How to get started with Mercure-hub.
👋 Welcome to the Stackhero documentation!
Stackhero offers a ready-to-use Mercure-Hub cloud solution that provides a host of benefits, including:
- Unlimited requests and message sizes.
- Customizable domain name secured with HTTPS (for example, https://real-time.your-company.com).
- Effortless updates with just a click.
- Optimal performance and robust security powered by a private and dedicated VM.
- Available in 🇪🇺 Europe and 🇺🇸 USA.
Save time and simplify your life: it only takes 5 minutes to try Stackhero's Mercure-Hub cloud hosting solution!
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.