Update consumer groups example (#352)

ThreeDotsLabs · Mar 6, 2023 · 71d6cf0 · 71d6cf0
1 parent 0c5009a
commit 71d6cf0
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 2 deletions.
diff --git a/_examples/real-world-examples/consumer-groups/README.md b/_examples/real-world-examples/consumer-groups/README.md
@@ -1,9 +1,35 @@
-# Consumer Groups Example
+# Interactive Consumer Groups Example (Routing Events)
+
+This example shows how Customer Groups work, i.e. how to decide which handlers receive which events.
+
+Consumer Group is a concept used in Apache Kafka®, but many other Pub/Subs use a similar mechanism.
+
+The example uses Watermill and Redis Streams Pub/Sub, but the same idea applies to other Pub/Subs as well.
+
+## Live video
+
+This example was showcased on the Watermill v1.2 Launch Event. You can see the [recording on YouTube](https://www.youtube.com/live/wjnd0Hj6CaM?t=1020) (starts at 17:00).
+
+[![Live Recording](https://img.youtube.com/vi/wjnd0Hj6CaM/0.jpg)](https://www.youtube.com/live/wjnd0Hj6CaM?t=1020)
 
 ## Running
 
 ```
 docker-compose up
 ```
 
-Then visit [localhost:8080](http://localhost:8080).
+Then visit [localhost:8080](http://localhost:8080) and check the examples in each tab.
+
+## Screenshots
+
+![](docs/screen2.png)
+
+![](docs/screen1.png)
+
+## Code
+
+See [crm-service](crm-service) and [newsletter-service](newsletter-service) for the Watermill handlers setup.
+
+## How does it work?
+
+This example uses SSE for pushing events to the frontend UI. See the [other example on SEE](../server-sent-events) for more details.
diff --git a/_examples/real-world-examples/consumer-groups/api/public/index.html b/_examples/real-world-examples/consumer-groups/api/public/index.html
@@ -35,6 +35,7 @@
                 <p>Consumer groups let you decide which handler receives a message.</p>
                 <p>They are related to subscribers.</p>
                 <p>Some Pub/Sub take a different approach, but the idea stays the same.</p>
+                <p>Follow the tabs above to see all examples in order.</p>
                 `,
                 services: [],
                 code: [],
@@ -49,6 +50,7 @@
                     It's adds the user to the newsletter list.
                     </p>
 
+                    <p>Flip the switch below to start sending messages and see what happens.</p>
                 `,
                 topic: "UserSignedUp-1",
                 services: [

diff --git a/_examples/real-world-examples/consumer-groups/docs/screen1.png b/_examples/real-world-examples/consumer-groups/docs/screen1.png
diff --git a/_examples/real-world-examples/consumer-groups/docs/screen2.png b/_examples/real-world-examples/consumer-groups/docs/screen2.png