The life and death of conventional Content Management Systems – and why django CMS is more sustainable

I was recently asked to compare the django ecosystem with the drupal ecosystem. Drupal is widely known as a huge open source CMS success with a massive community behind. 

However looking at Google Trend to my biggest surprise I realized that this is not true in 2019 anymore. The django ecosystem is bigger and on top of that, growing in a sustainable way.

Django (red) vs Drupal (blue) – Since 2016 django has surpassed Drupal. Shockingly, the decline in the interest in the Drupal CMS ecosystem is sharp.

Google Trends 2019

It is my experience that most CMS come and go across the years. The django ecosystem appears to be much more robust than any CMS ecosystem because it doesnt just cover CMS functionality, as a web application framework it covers a much broader scope, with the django CMS package covering the CMS part.

As you can see here, Django is amongst the top three open source web technology ecosystems and it is on a continuous growth path:

Google Trends 2019

django CMS itself is much leaner than other CMS, as it sits on the shoulder of a giant: django – this makes it more long-living and much more maintainable than other CMS projects.

I hope I could give you some insights into the advantages of django + django CMS. Please let me know if you have any questions.

For more information about the technology stack, I’d also point you to the slightly technical articles I wrote about django and django cms.

Disclaimer: At what.digital django and django CMS is our main backend technology stack.

Would you like to contribute to this article? Please let me know. For example, do you think Google Trends is a good way to look at how future-proof a technology is?

Why we use divio.com for django / django CMS hosting

Divio is the company that originally founded django CMS a couple of years ago and that still contributes to developing it further together with the rest of the django CMS community.

Divio is a professional, modern cloud hosting company specialized in hosting python / django / django CMS projects in a highly secure, performant and efficient way.

Divio relies on data centers in Switzerland as well as other countries via Amazon Web Services (AWS) – its hosting is fully scalable, meaning that we could host websites with Divio that would be used by hundreds of thousands of daily users.

Amongst Divio’s customers are small and middle-sized companies, but also corporates such as ZKB, Salt, Migros, in Switzerland and across the globe.

Divio is headquartered in Zurich, close to Hardbrücke, however employs its staff of ~ 20 around the world, as they need to be able to respond to support requests around the clock (24/7).

At what.digital what we like about divio.com hosting is:

  • simplicity of the divio.com control panel to launch and maintain projects for our clients
  • very competitive pricing
  • simple backup
  • quick responses from their support staff
  • robust developer tools for django and django CMS projects

Why Django – the Web Application Framework for perfectionists with deadlines

Django is a modern web application (backend) framework with lots of support to scaffold web applications.

Django was designed to help developers take applications from concept to completion as quickly as possible.

https://www.djangoproject.com/

The main advantages are:

  • Secure: Django has built-in state-of-the-art security.
  • Efficient: Django has some of the best scaffolding tools to build web applications fast and efficiently (ORM including fully automated database migrations, admin interface, form generation, user authentication, management and permissions, REST API support, and much more). This means that applications can be developed quicker and more cost-efficiently, and the maintenance cost is lower in comparison with other web frameworks.
  • Popular: Django is very popular and has a huge community. Looking at Google Trends, Django emerges as a top-three web framework next to Spring and Laravel. Being so popular, Django has tons of well-maintained modules. These modules are well organized – check it out at https://djangopackages.org/.

By the way: Django also has very good Content Management (CMS) support via projects like Django CMS or wagtail.

Django CMS – A hands-on Introduction

Introduction

Why Django CMS? Django CMS is a good choice for companies that depend on their website to drive business and generate user value.

For Editors and Marketing Managers: Django CMS empowers editors to select from custom-made page templates and content elements without any dependency on developers. Watch the video below:

django CMS is user friendly and has a very intuitive drag and drop interface.
It’s built around the needs of multi-lingual publishing by default, not as an afterthought: all websites, pages and content can exist in multiple language versions

https://www.django-cms.org/en/

Full list of django CMS features:

  • Frontend Editing
  • Modular Content Management. Editors can choose from…
    • content elements (plugins)
    • templates for a whole page
    • templates for just parts of a page (sections)
  • Full Multi-Language Support
  • Simple publishing process (draft / published)
  • Multi-Site Support (manage different sites with different domains in the same project)
  • Support for all aspects of SEO and Social Media cards / integrations
  • Full-fledged admin interface and site settings
  • different levels of permissions for editors
  • Full-text search
  • Undo / Redo / Revert to published version for editors
  • … and more

For Developers: Developers can use the full power of Django, a top-three open-source web framework which is also at the core of Django CMS, to build state-of-the-art applications (such as an online course booking tool) that integrate smoothly with the rest of the website. Moreover, developers can include CMS functionality in their applications, creating a perfect blend between application logic and manageable content.

Demo

Here you can create your own demo web server with Django CMS and a demo theme installed out of the box. No setup required.

The demo theme consists of standard components. It allows you to build your own page templates. Components include image sliders, text and images in one or multiple columns, tabbed content and much more.

First Steps: In Django CMS, all content can be edited right on the website itself. Append ?edit to the current URL and hit enter. Now you should see the admin bar where you can log in with the admin username and password that you received (or if already logged in, just hit the ‘Edit’ button). Then try double-clicking on a text anywhere on the page and an editor window will open.

The Structure Mode

The structure mode allows an editor to insert content elements (a.k.a. plugins) and to change their order on the page. Try it out! Here is how to use the DjangoCMS structure mode.

More Admin Tools

There are some additional admin tools that allow you to publish / unpublish pages, manage multi-language, etc: Read more at http://docs.django-cms.org/en/latest/user/reference/page_admin.html

Here is the link to the full documentation for editors: http://docs.django-cms.org/en/latest/user/index.html

What’s next?

If you have any questions about Django, Django CMS or CMS in general please get in touch with mario@what.digital

Firebase Dynamic Links and Marketing Campaign Attribution

The goal: What the app marketer would like to do: Prepare links with Google Analytics utm parameters that lead the user to the app (either via download & install through the app store or directly to the installed app) and then use these links in online marketing campaign across the board (email marketing, social media marketing, search engine marketing, display advertising, etc.)

The Solution (experimental): Firebase Dynamic Links

Here is how you can create such a Firebase Dynamic Link manually and here is the debug view of an example of a Firebase Dynamic Link: https://example.page.link/?link=https://www.our-client.com&d=1&utm_source=google&utm_medium=cpc&utm_campaign=summer-campaign

According to the official documentation, these links will work on both iOS and Android, whether the app is installed or not. Google Analytics utm_parameters appear to be fully supported.

Dynamic Links work across app installs: if a user opens a Dynamic Link on iOS or Android and doesn’t have your app installed, the user can be prompted to install it; then, after installation, your app starts and can access the link.

When a user opens one of your Dynamic Links, if your app isn’t yet installed, the user is sent to the Play Store or App Store to install your app (unless you specify otherwise), and your app opens. You can then retrieve the link that was passed to your app and handle the deep link as appropriate for your app.

https://firebase.google.com/docs/dynamic-links
This is an example of what a Firebase Dynamic Link is capable of doing in different situations.

Laravel vs Django Web Framework

There are some comparisons out there on the web, but they appear to be shallow. Most of them just cover performance (Django wins), security (Django wins), learning curve (Django wins) and API (django loses, even though there is excellent API support in the form of a well maintained package called Django Rest Framework).

Let’s try to find out the real differences by looking at the different steps needed to build a simple blog application.

Disclaimer: I know Django quite well and Laravel not at all. Which means I am biased. Please collaborate via mario@what.digital to improve the Laravel part of the comparison.

Ecosystem

Django provides a huge community and a very strong open source code base. It is probably safe to say that the underlying programming language Python has everything. There are many Python libraries that are well tested and ready for production.

Pypi is a very strong package manager with very good conflict management and dependency resolving. It is straightforward to use a virtual environment to create local, customized environments for different projects (similar to NPM and node modules) but in a less crazy way.

Django itself has a huge package directory with very useful comparison pages like https://djangopackages.org/grids/g/cms/ – it is simple to see which packages should be chosen for a specific job.

IDEs are readily available for example Pycharm including break point debugging and full inspection out of the box. Django has its own development server that runs as a CLI command out of the box. It’s also hasslefree to dockerize a local dev env (including debugging!)

Laravel has a huge community and a pretty strong open source code base. The underlying programming language goes back to Adam and Eva. There are many libraries. Dependencies are handled in composer. Finding a package appears to be a bit of a hassle as https://packagist.org/ doesn’t have browsable categories or comparison grids.

IDEs are readily available including breakpoint debugging for example PhpStorm. For debugging Xdebug needs to be installed and configured and the official PhpStorm docs even mention installing a browser extension. This appears to be quite a hassle. For dockerizing a local dev env, there appears to be a working cookbook.

Laravel can be run in development mode locally via CLI command php artisan serve out of the box.

Models

Django lets you define a model with different fields. Then it provides a CLI command to create migrations automatically. ./manage migrate will then apply the new model or any subsequent changes to the database. Upon changing the model, i.e. altering the properties of a model field, Django will detect this change and generate a corresponding migration.

Laravel allows you to create a migration file but its empty. You have to fill it with things you want to migrate yourself. Laravel does not support creating database migrations from the modal automatically. This means that your model code lives in two places (1. migrations, 2. model) and they have to be kept in sync manually.

ORM

Django ORM is taking care of all SQL things for the programmer. Query building is chainable like Animal.models.filter(color='black').filter(legs=4).filter(owner__email="mario@what.digital").distinct(). Its Q class allows to build sophisticated encapsulated queries without touching SQL. Also note the ease with which the query can span foreign relations (owner__email points to the email field of the foreign relation of the owner field, for example a User model)

Laravel has a sophisticated ORM which allows custom queries and managers.

TBD: I was not able to quickly find a simple straightforward solution on how to filter via a foreign key relation’s property like in Django.

Admin Interface

An often overlooked feature, Django provides an admin interface out of the box. It has support for translation via 3rd party apps.

It requires zero configuration as it inspects the model definitions. It supports CRUD permissions out of the box per model and has mobile optimized widgets for all fields, including dates, searchable many-to-many relations, searchable auto completion for foreign keys. The django admin package is built on top of Django’s templating system, so its look and feel is extendable, allowing for example DjangoCMS to build its entire customly styled admin interface on top of it, without changing core functionality. Django Admin is configured by extending the package’s classes with properties such as list_display = ('first_name', 'last_name') in the module’s admin.py file, by default, no files are generated into your project.

Laravel has Laravel Nova as the official admin panel, it looks great. It has support for translation via 3rd party apps.

There are also some 3rd party admin packages that offer a lot of functionality, for example https://backpackforlaravel.com/. For example, it is nice to have an image upload widget that allows cropping.

Generally, in Laravel such packages require generating scaffolding code which then lives in your project. Changing admin behaviour requires the programmer to write PHP code, inside the scaffolded code.

Templating

Django has its own template language or Jinja2 can be used, both are hierarchical and use the extension strategy. Both are pretty mutch self explanatory. Some programmers dont like the django template language because it is limited (it only supports custom template tags and filters). But in my experience Django Template’s support for include together with with (context) solves it all. Jinja2 has support for components (called macros) and is said to be more powerful, so feel free to switch to jinja2 via some simple configuration in settings.py.

Laravel uses hierarchical Blade templates with the extension strategy. Blade has components which allows to quickly create custom blocks.

Frontend Support

Django has no special tools to handle CSS / SASS or JS / TS. In my opinion, that’s a plus, because it forces programmers to use state of the art frontend tools like webpack and keep backend and frontend strictly separated.

Laravel has Laravel Mix which appears to be a laravel-flavoured frontend setup. It’s probably not suitable for professional use (correct me if I am wrong). It doesnt appear to support any built-in chunking though. Vuejs has its own tooling and it’s probably simpler to just use the plain vanilla react or vuejs setup strictly separated from laravel.

Static Files Support

Django has first-class support for static files and media files. Django’s collectstatic command allows to keep static files inside static/ folders within the single modules and apps (possibly inside 3rd party modules) and still be able to serve them from one single static file directory (or S3 bucket). That’s very smart because 3rd party modules dont have to be part of the code base of the project and can still contribute their static files in a fully automated way.

Django does have one more trick up its sleeve: ManifestStaticFilesStorage is a storage driver that automatically hashes all static files. This means, that it is very easy to have webpack build the app.js (and app.css bundle, or also multiple bundles) without hashes and then have them hashed by ManifestStaticFilesStorage so you can have a perfect caching solution with far-future headers enabled on the web server for the static file directory, including all server-rendered images.

From what I see there are no special tools for handling static files in Laravel.

i18n and localisation support

Django has extreme localisation and i18n support out of the box. django admin offers a translation interface for models right out of the box with well tested and widely compatible django-parler support. Also it has number formatting localisation support.

Django has its own wrapper around gettext / .po files (CLI commands makemessages and compilemessages. It allows to translate strings anywhere in Python code or in templates.

Laravel has simple i18n support and no gettext / .po support out of the box. I suspect that i18n might not be very performant.

Laravel has to fall back to third party tools like https://carbon.nesbot.com/ for format localisation. Are there disadvantages? For example how is a date formatted in a template? Does this require additional code in the template?

TBD: How can a model be translated in a laravel admin out of the box?

Documentation

Django documentation and tutorials are huge. It allows to quickly get going, even for a complete beginner. At the same time it has all the details for the pros to quickly look up some detail.

I find Laravel’s documentation a bit on the minimalistic side. It’s hard to get detailled information about specific configuration properties. A lot is left open to the developer. This doesnt incentivize the developer to follow best practise coding approaches and standards. I dare to say that it’s much easier to write bad code in Laravel than it is in Django.

Other Things

Django supports mailing, events and caching quite well.

Laravel supports mailing, events and caching quite well.

Task Queues and Scheduling

Django has asyncronous task support via a 3rd party library (Celery). It’s not so easy to set up and requires some ground work and configuration, especially for deployment and monitoring. Monitoring is mostly done via Flower, but it’s a bit outdated and sometimes a bit useless.

Laravel has built in asyncronous task processing built in via its Queues. This looks like a robust, performant and lean solution. The monitoring solution appears to be awesome: https://laravel.com/docs/5.8/horizon

Authentication and oAuth

Django supports oauth (also in combination with the REST API via Django Rest Framework) quite well.

Laravel has Socialite and Passport and appears to support oauth (also in combination with the REST API) quite well and out of the box. This looks like a robust, performant solution.

Search

Django has good support for quick and easy implementation of a full-text search via django-haystack it can connect to powerful search engines like SolrElasticsearchWhooshXapian but also has a simple database driven backend.

Laravel has Scout which appears to support full-text search quite well, quickly and easily and out of the box. This looks like a performant, robust solution.

Browser Automation / Integration Testing

Django has a very good testing framework out of the box which supports selenium quite well.

Laravel has Laravel Dusk which installs via PHP composer and appears to have a quite lean setup via ChromeDriver. This looks like a performant, robust and easy solution.

Django Signals & django-fieldsignals

__init__.py:

default_app_config = 'app.apps.MyApp'

apps.py:

# -*- coding: utf-8 -*-
from django.apps import AppConfig

class MyApp(AppConfig):
    name = 'my_app'
    verbose_name = 'MyApp'

    def ready(self):
        from . import signals

receivers.py:

@receiver(post_save_changed, sender=models.WorkEntry, fields=[
    'issue',
    'hours',
], dispatch_uid="update_gitlab_time_spent_updated")
def update_time_spent_on_changed_issue(sender, instance, changed_fields, **kwargs):
     for field, (old, new) in changed_fields.items():
         if field.name == 'issue':
             # do something

A simple and solid approach at deferring javascript execution

In most cases javascript code should be deferred so it doesnt block the page loading process.

Javascript files can be deferred simply like this, the execution order of deferred scripts will be strictly kept by browsers in the order of appearance in the HTML file:

<script defer="defer" src="vendor.js"></script>
<script defer="defer" src="app.js"></script>

However projects might require inline js code. That code will execute before the deferred scripts – which might throw errors if the inline js code depends on libraries loaded via deferred script tags. Inline js code can be deferred like described on stackoverflow:

<script>
    window.addEventListener('DOMContentLoaded', function() {
        (function($) {
            //
        })(jQuery);
    });
</script>

defer was introduced before async. Its execution starts after parsing is completely finished, but before the DOMContentLoaded event. It guarantees scripts will be executed in the order they appear in the HTML and will not block the parser.

https://hacks.mozilla.org/2017/09/building-the-dom-faster-speculative-parsing-async-defer-and-preload/

Once all of your js is either triggered by DOMContentLoaded or has the `defer tag it is easy to manage and maintain control of the execution order.

Vuejs + Google Spreadsheets as (simple) Backend

This is a proof of concept to get data from a google spreadsheet via frontend only and display it in a vuejs app, deployed via gitlab pages: https://what-digital.gitlab.io/vuejs-gsheet-query-api-search-demo

The purpose is to use Google Spreadsheet as a “cheap” data source for a widget on a website.

The project source is public: https://gitlab.com/what-digital/vuejs-gsheet-query-api-search-demo