Visual Studio Code

The development of this project was mainly done using Visual Studio Code (VS Code). It is not that surprising, then, that we recommend you use it.

Extensions

When you first open the repository in Visual Studio Code it will ask you to install all recommended extensions, which you should do. We used a few extensions to help with the development of this project.

The Python and Pylance extensions help with linting Python code, auto imports, syntax highlighting and much more.

Prettier is an extension used to format JavaScript and TypeScript. ESLint is used to lint JavaScript and TypeScript code.

Live Share is an extension that is used to write code together at the same time, much like a Google Docs document. There were however a few issues with the Python extension that made Live Share hard to work with.

Tasks

A task in VS Code is a simple action that can be run by pressing ctrl+shift+p, searching for and selecting Tasks: Run Task. These tasks are configured in the .vscode/tasks.json file. Tasks that are marked as build tasks (starting and testing tasks as well as populate) can also be run with ctrl+shift+b. A few such tasks has been setup in this project and will be described below.

The Start server task will start the server.

The Start client task will start the client.

The Start client and server task will start both the client and the server.

The Populate database task will populate the database with a few competitions, teams, users and such. Look in the populate.py to see exactly what it adds. Remember to always run this after changing the structure of the database.

The Test server task will run the server tests located in the server/tests/ folder.

The Open server coverage task can only be run after running the server tests (Test server task) and will open the coverage report generated by those tests in a web browser.

The Unit tests task will run the unit tests for the client.

The Run e2e tests task will run the end-to-end tests.

The Open client coverage task can only be run after running the client tests (Unit tests task) and will open the coverage report generated by those tests in a web browser.

The Generate documentation task will generate the project documentation, i.e. this document, in the docs/build/html/ folder.

The Open documentation task can only be run after generating the documentation and will open it in a web browser.