Structure

This is the testing stage of the complete system.

A brief introduction on the C4-Model

The C4-Architecture-Model is not a standard but a model that helps designing software on different levels. You can compare the view-model to any map-provider, where you start on a very far overview of the model and are able to zoom into the map.
C4 defines 4 zoom levels as default: System Context diagram, Container Context diagram, Component diagram, Code diagram.
In the early design-phase of this project we are going to focus on System Context and Container context. You will find deeper information on the idea behind C4 on their website c4model.com

System Landscape Overview

To have a compact overview over all systems involved in our design, we can have a look at the System Context:

The systems involved communicate with each other using apis or message queues. They authenticate with each other using the openid provider and client of the system.

Broadcaster System

The website PSI has to be integrated with.

PSI System

The main PSI system that can be integrated into several sites.

OpenIDC-Provider, can also be a container of the Broadcaster system (in our case it is Keycloak).

Container Context PSI

The PSI-system consists of the following containers:

These containers are responsible for the local storage of user preferences (e.g. profile picture, common name, settings, etc), hosted Keycloak instance in Google Kubernetes Engine.

PSI Frontend

React native frontend which provides the UI for the different features, hosted in Firebase App Hosting.

PSI Backend

Node backend deeply integrated with Google Firebase. It does all CRUD-operations from the frontend and acts as a central api-gateway, hosted in a Firebase Cloud Function.