Currently Django and Vue are somewhat coupled in that the project
intermixes templating constructs from both eco-systems.
Examples of this in `projects.html` include:
- Checking if the user is a superuser to modify the Vue template.
- Using Django filters to inject the capitalized username.
This makes it somewhat hard to follow the Vue code and also makes it
more difficult to modularize the Vue components and re-use them.
As such, this change improves the separation of concerns by having the
Django template only scafold the root element for Vue and serialize any
variables that are required from the Django context to Javascript so
that Vue can access them. The rest of the templating is then moved into
a Vue single file component. This will make it easier for the developer
to understand the Vue components and make it very clear what is rendered
by Django and what is rendered by Vue.
Clemens Wolff
Hironsan