ClimWeb Documentation
Development tools¶
Backend¶
PostgreSQL + PostGIS¶
Climweb uses PostgreSQL for persistent storage.
PostGIS is an extension to PostgreSQL that adds support for geographic objects
Django + Wagtail CMS¶
At the core of the system we run the Django framework. A popular framework was chosen to lower the barrier of creating custom modules that extend Climweb. We also looked for a batteries included, simple, and proven framework. Django was the obvious choice.
Wagtail is an open-source content management system (CMS) built on top of Django, a popular Python web framework. It’s designed to be developer-friendly, flexible, and provide a modern, intuitive editing experience for content creators.
The user interface of the Wagtail Admin and the overall editing experience provided by Wagtail made it a good choice for Climweb, as it allows for easy content creation and management.
Django REST framework¶
To quickly create endpoints, handle external authentication, object serialization, validation, and do many more things we use Django REST Framework.
Internationalization¶
For internationalization (i18n), we leverage Django’s built-in support. Django’s internationalization framework allows us to easily translate our web application into multiple languages.
To use Django’s internationalization features, we wrap our text with a special function called gettext or
gettext_lazy.
For more information, refer to
the Django Internationalization and Localization documentation.
Frontend¶
Climweb mostly uses Django templates for the frontend. However, we also use Vue.js for some parts of the frontend that
require more interactivity, such as the home page map component.
We use a custom approach to integrate Vue.js with Django. This approach combines the strengths of Django’s templating system with Vue’s reactive components and is summarized as follows:
Key steps in the integration of Vue into Django/Wagtail:
Vue Project Setup: Use Vite to scaffold a Vue project within the Django project directory, enabling modern JavaScript development with features like hot module replacement.
Django Template Integration: Embed Vue components directly into Django templates by adding a
and including the Vue application’s script via a