Thursday, 13 April 2017

How to build a UI frontend from multiple Microservice ReactJS components

My current design is to have clients connect to my Web API Gateway using a browser, the Web API Gateway will call each microservice to get their (ReactJS) UI component and it will then combine these components before returning the full view to the client.

How do I aggregate multiple microservice ui components on the Web API Gateway using ReactJS or other framework/library and then serve this to the client?

Client browser

     ▼ (Request Dashboard View)

Web API Gateway

     ▼ (Request UI Components)

Microservice A ReactJS UI Component
Microservice B ReactJS UI Component
Microservice C ReactJS UI Component
Microservice D ReactJS UI Component

     ▼ (Return UI Components)

Web API Gateway

     ▼ (Aggregate UI Components and return to Client)

Client browser

Some more specific questions.

  • Does the microservice serve a pre-rendered component in JSON to the gateway?
  • Are there known ways to return components as JSON and rebuild them at the gateway?
  • How can the JSON be converted to a ReactJS component and aggregated?


via mortond

No comments:

Post a Comment