Skip to content

Functionality

Tim Buchholz edited this page Jan 13, 2020 · 1 revision

Functionality

Overview

Backend

The backend is a web server, which is built with ExpressJS.

The server persists its data in a PostgreSQL database with which it communicates via Sequelize. You could also use another lightweight database, such as MongoDB, but then you would have to exchange Sequelize.

For communication the server offers both a REST API and a socket.

The REST-API is used for all non-time critical requests.

The socket is provided via Socket.io and is used for all tasks that are extremely time critical, such as pausing the timer during a session.

Frontend

The frontend uses React and Grommet as CSS-Library for the general design.

React allows to divide the great complexity of the application into many smaller individual components.

However, this comes with the disadvantage that the communication between individual components is based on their state, which in turn quickly becomes confusing and difficult when a certain number of components are involved.

Redux is used to mitigate this problem. The framework makes it possible to create a global store, which can be accessed by all components, so that the handling of states becomes much clearer.

To enable a multilingual application i18next is used. Simply put, all strings are stored in language-specific JSON files, so that a different JSON file is used as a basis depending on the language selection.

Axios and Socket.io are used for communication between the frontend and backend.

Axios is required for communication via the backend's REST API. You could also use Fetch but Axios is slightly more readable in code.

For all time-critical and bi-directional requests, communication runs over a Socket provided by Socket.io.

Clone this wiki locally