The frontend code is located in the assets folder.
It's a mixture of old jQuery code and newer React code.
The code is built with webpack and transpiled using Babel.

Some static files are still stored in files/static, but should be moved to assets and included using webpack.

Python 3 with Django is used as a backend and is mostly located in the apps folder.
Django templates are in templates folder.
The API uses Django REST framework

$ git config --global core.autocrlf false
$ git config --global user.name "<your github username>"
$ git config --global user.email your.github@email.com
$ git clone git@github.com:dotkom/onlineweb4.git
$ cd onlineweb4

The easiest way to get started with development is to use the provided Docker images.
On the other hand on slower machines Docker might be noticeable slower in which case a local installation using virtualenv can be preferred.

To fire up the dev environment, you should use Docker. Following that, you will need docker-compose, which can be installed following this guide.

There is a Makefile located in the root directory. This can be used to manage the application without direct interaction with docker, docker-compose, et al.

Simply run make to build and start onlineweb4, and run make stop to stop it.

To view output from onlineweb4, run make logs. To view output from a specific service (e.g. django), prepend the make command with OW4_MAKE_TARGET=django.

If you can't use make, you can fire up the dev environment by issuing docker-compose up -d.

If the site doesn't load properly the first time you are running the project, you might need to restart Docker once by running docker-compose restart.

Remember to run make migrate your first time, and after migrations have been made.

A few packages are required to build our Python depedencies:

• libjpeg-dev
• ghostscript

If these aren't already installed pip will likely fail to build the packages.

If you are oldschool and like using python virtual envs, just activate your env, run pip install -r requirements.txt, then python manage.py migrate, before starting the dev server with python manage.py runserver.

Next, you need to fire up the front-end stuff, by running npm install followed by npm start.

The project should now be available at http://localhost:8000

Pushes made to the develop branch will trigger a redeployment of the application on dev.online.ntnu.no.

Pull requests trigger containerized builds that perform code style checks and tests. You can view the details of these tests by clicking the "detail" link in the pull request checks status area.

Builds will fail if our requirements for code style is not met. To ensure that you adhere to our code guidelines, we recommend you run linting tools locally before pushing your code. Running make test will run our tests and linters all at once. Look to our Makefile for more specific commands.

Running make test frequently can be quite inefficient, which is why we recommend using editors that support linting your code as you go. For JavaScript, we use ESLint, with editor plugins available here. Correspondingly, we use stylelint for our stylesheets, with editor plugins available here. For Python, we use isort and Flake8.

In dotkom, we find that PyCharm is a great IDE that is well suited for contributing to onlineweb4. It'll come with support for ESLint, stylelint, and PEP 8 out of the box, and can be set up to run isort and Flake8 with some ease. We recommend it to our beginners who don't want to spend a lot of time setting up the plugins or extensions mentioned above, or don't have any preferences of their own yet. You can apply for a free student license here.