Skip to main content


About 2 min


UI Screenshot


For preparation we need Node and recommend to use node version manageropen in new window nvm to switch between different local Node versions:

# install Node
$ cd webapp
$ nvm install v19.4.0
$ nvm use v19.4.0

Install node dependencies with yarnopen in new window:

# install all dependencies
$ cd webapp
$ yarn install
# or just
$ yarn
# or just later on to use version of ".nvmrc" file
$ nvm use && yarn


# in webapp
cp .env.template .env

Configure the files according to your needs and your local setup.

Build for Development

# serve with hot reload at localhost:3000
$ yarn dev

Build for Production

# build for production and launch server
$ yarn build
$ yarn start

Run tests

We ensure the quality of our frontend code by using

For more information see our frontend testing guide. Use these commands to run the tests:

With Docker

After starting the application following the above guidelines, open new terminal windows for each of these commands:

# run eslint
$ docker-compose exec webapp yarn lint
# run unit tests
$ docker-compose exec webapp yarn test
# start storybook
$ docker-compose exec webapp yarn storybook

You can then visit the Storybook playground on http://localhost:3002

Maintenance Mode

For installing and running the maintenance mode see Maintenance Mode.

Styleguide Migration

We are currently in the process of migrating our styleguide components and design tokens from the Nitro Styleguideopen in new window into the main repositoryopen in new window and refactoring our components in the process. During this migration, our new components will live in a _new/ folder to separate them from the old, yet untouched components.

Folder Structure

The folder structure we are following is prescribed by Nuxt.jsopen in new window:

  • assets contains icons, images and logos in svg format and all shared SCSS files such as tokens
  • components separated into two sub-folders:
    • generic are the generic building blocks of the app – small, reusable and usually not coupled to state
    • features are composed of components but tied to a particular function of the app (e.g. comment or post)
  • layouts can use components to create layout templates for pages
  • pages are the entry points for all routes in the app and are composed of layouts, features and components