React Domain Events

Learn how to load data from an API in a React application, update the component state, and display a progress indicator while waiting for the API response.

We'll cover the following

What are we dealing with?

There are two Domain Events that our React front-end needs to deal with:

  • The first is an incoming event where we are notified that a user has logged in to the application. This event provides us with the username of the logged-in user, which we will need when we broadcast a Domain Event.

  • The second Domain Event is one that we will need to broadcast when a user clicks the “Add to Cart” button in the DetailView component. This event will include the username, the productId that was selected, as well as the amount of switches the user has entered.

In order to test that our React application can consume and produce these Domain Events in a test environment, we will need to copy the MicroEventBus.js file from our micro-event-bus/dist directory into the product-list/public directory. We will also need to update our product-list/public/index.html file as follows:

Get hands-on with 1200+ tech skills courses.