Co-Creation Space


Please contact Thomas Röggla for more information about this tool.


All code and documentation is licensed by the original authors and contributors under the BSD-2-Clause license.


The Co-Creation Space is a web-based platform which acts as a media repository and collaborative tool for upload, visualisation and communication around media objects. This video contains an introduction to the Co-Creation Space:

User Documentation

Tutorial 1

This video presents instructions for signing up, editing profiles (e-mail, password, language, groups and topics of interest), searching and filtering content, creating, reacting, commenting and liking posts, and finally, viewing notifications.

Tutorial 2

This video presents instructions for adding posts to the favourites list, following other users, creating media collections, drafting posts, highlighting videos/images and drawing on images signing up, editing colour themes and group permissions.



The app uses the yarn version 1 (, so make sure to install it before you get going. Moreover, make sure to install Docker and docker-compose (usually comes packaged with Docker) for running the system on your local machine


The application makes use of Amazon SNS (Simple Notification Service) to be notified about asynchronous events (such as status updates about video processing). In order to receive messages, the application needs to subscribe to the SNS channel using a public names where it is reachable.

The best way to achieve this so far is to create a account with NGrok (, download their command line tool, start a tunnel and put the name of the tunnel into your .env file under SNS_ENDPOINT.


Before launching the application for the first time, make sure to rename the file .env-sample to .env and fill in the required config values inside the file. Also make sure that this new file is not committed to version control. Further, in order to make use of AWS, make sure to place a JSON file named aws.json containing your AWS access credentials into the root folder. This file should also not be committed to version control.

The application is separated into a frontend and a backend portion. Both have their own build files and separate dependencies. Before the first launch, you should run the following command to install all required dependencies. This needs to be done in both, the root folder and in the folder public/:

yarn install

This will fetch and install all packages. In order to compile and bundle the application, run the following command. Again, this needs to be done in the root folder as well as the folder public/

yarn build

This command needs to be re-run every time you change any of the code. You can also attach the flag -w to the command to make sure the command keeps watching the directory for changes and recompiles the bundle automatically using incremental compilation.

The application as well as the database run as Docker containers and can be launched easily using the following command:

docker-compose up

During first launch, all required images will be fetched and the containers will be assembled. This will take some time, but subsequent launches will be faster as only updated parts of the images need to be reassembled.

Note: If you are not planning on doing any development and simply want to run the application locally, make sure to remove the following lines from the file docker-compose.yml (alternatively create a copy of the file with the lines removed):

  - .:/code

Removing these lines will prevent the host directory from being mounted inside the container and compiled bundles being overridden.


To run the unit tests, make sure you have yarn installed as well as all development packages are installed by running yarn install. Following this, you can run the unit tests and generate a coverage report by invoking the following command in the root folder:

yarn test

This will run all unit tests and generate a test report. Extended coverage analysis can be found in the folder coverage/.

Data Model Migrations

Migrations allows to keep track of changes to the database schema. To each action that we are going to do with database schema (update a table, delete a table or create a new one), we must create a new migration file. This files are located in migrations/ folder.

If we do a change in the database schema, we must do the next steps:

  1. We must create another migration file where we set the logic that we must do:
    npx sequelize migration:generate --name action_name

This will generate a new file XXXXXX-action_name.js in migrations/ folder. To run this action, we must write the next command:

    npx sequelize db:migrate

If we want to undo this actions, we can write the next command:

    npx sequelize db:migration:undo
  1. We have to update the respective model in models/ folder. For example, if we want to add a new column in users Table, we must update models/users.ts. This folder is used by the backend in order to connect with the database and work with it.