Backend / frontend
4ME is a single-page application. First, the browser loads
@4me/frontend code and configuration. This code is then executed by the browser. In this code, we instruct the browser to contact multiple API servers. We only exchange JSON serialized data between the application that runs in the browser (frontend application) and API servers (backend applications).
The main API consumed by the frontend application is our GraphQL server.
Before the introduction of GraphQL in 4ME, application architecture looked like this :
As the number of features increases, 4ME should have been aware of multiple services. GraphQL introduces an abstraction layer between services and consuming applications (
@4me/frontend is one of them).
GraphQL exposes a schema, composed of multiples objects (
CollapsedSector) and connections between objects (a
Flight may have a
CollapsedSector has multiple
GraphQL formalizes a way to request data in this schema (queries), mutate data (mutations) or get events pushed from the server (subscriptions).
Also, GraphQL is strongly typed, meaning a consumer knows what to expect as a response without querying the server, just by looking at the schema.
This just scratches the surface on why GraphQL is a perfect fit in 4ME architecture. Here's a collection of resources about GraphQL.