Québec, Canada

403-1381 1re Avenue

+1 581.849.27.96

bdgouthiere@gmail.com

Le Blog de la Veille Tech - be4web.be

be4web.be est un blog technique développé avec Django et le CMS Wagtail, stylisé avec Tailwind CSS, et déployé via uWSGI et Caddy pour offrir une plateforme de partage performante et moderne autour des technologies web.

Fiche technique

Date de début du projet : 28 octobre 2024

Technologies utilisées : Python , Django , Wagtail

Phase 1 : La préparation

Création du dépôt sur GitLab

La première étape du projet consiste à créer un dépôt sur GitLab pour héberger le code source. Le dépôt est initialisé avec un README.md générique, que je modifierai par la suite.

Configuration de l'environnement de développement sur Google IDX en créant le lien vers le GitLab du projet.

La configuration de l'environnement de développement débute avec Google IDX, une solution cloud moderne permettant de coder directement dans le navigateur. L'IDE est configuré pour se connecter au dépôt GitLab. Les extensions Python et Django sont activées pour optimiser le développement, tandis que l'intégration avec GitLab permet une gestion fluide du versioning.
L'environnement virtuel Python est initialisé directement dans IDX, garantissant une isolation des dépendances du projet.
Nous commençons par installer les dépendances Python via pip, essentielles au fonctionnement du projet. Ensuite, nous initialisons un nouveau site avec Wagtail sous le nom "website". Pour finir, nous lançons la preview du serveur de développement.

Le fichier dev.nix dans le dossier .idx (c'est une première version pour initier le projet, il sera complété par la suite) :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
{ pkgs, ... }: {

  # Which nixpkgs channel to use.
  channel = "stable-24.05"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.python3
    pkgs.python311Packages.pip
  ];

  # Sets environment variables in the workspace
  env = {};

  # Enable previews and customize configuration
  idx = {
        extensions = [
            "ms-python.python"
            "vscodevim.vim"
        ];

        workspace = {
            onCreate = {
            };
            onStart = {
                setup-environment = ''
                    touch .setup_running
                    if [ ! -d .venv ]; then
                        echo "📦 Creating virtual environment..."
                        python3 -m venv .venv
                    fi

                    echo "🔄 Activating virtual environment..."
                    source .venv/bin/activate
                    echo "✅ Virtual environment activated"
                    
                    # Installation des dépendances si nécessaire
                    if [ -f "requirements.txt" ]; then
                        echo "🔍 Checking dependencies..."
                        if ! pip freeze | diff - requirements.txt >/dev/null 2>&1; then
                            echo "⬇️ Installing/Updating dependencies from requirements.txt..."
                            pip install -r requirements.txt
                        else
                            echo "✅ Dependencies are up to date"
                        fi
                    else
                        echo "⚠️  No requirements.txt found"
                    fi

                    if [ ! -d "website" ]; then
                        echo "🌟 Creating new Wagtail Website ..."
                        wagtail start website

                        echo "⚙️ Configuration Django - First migrate"
                        cd website
                        python manage.py migrate
                        cd ..
                    fi

                    # Afficher l'environnement actif
                    echo "🐍 Using Python: $(python --version)"
                    echo "🎯 Environment ready!"
                    rm -f .setup_running
                '';
            };
        };

        previews = {
        enable = true;
        previews = {
            web = {
                command = ["./devserver.sh"];
                manager = "web";
                env = {
                    PORT = "$PORT";
                };
            };
        };
    };
  };
}

Le fichier requirements.txt (pour initier le projet avec wagtail)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
anyascii==0.3.2
asgiref==3.8.1
beautifulsoup4==4.12.3
certifi==2024.8.30
charset-normalizer==3.4.0
defusedxml==0.7.1
Django==5.1.2
django-filter==24.3
django-modelcluster==6.3
django-permissionedforms==0.1
django-taggit==5.0.1
django-treebeard==4.7.1
djangorestframework==3.15.2
draftjs-exporter==5.0.0
et_xmlfile==2.0.0
filetype==1.2.0
idna==3.10
l18n==2021.3
laces==0.1.1
openpyxl==3.1.5
pillow==10.4.0
pillow_heif==0.20.0
python-dotenv==1.0.1
pytz==2024.2
requests==2.32.3
six==1.16.0
soupsieve==2.6
sqlparse==0.5.1
telepath==0.3.1
urllib3==2.2.3
wagtail==6.2.2
Willow==1.9.0

Le script devserver.sh pour démarrer la preview

1
2
3
4
5
6
7
8
#!/bin/sh
while [ -f .setup_running ]; do
    sleep 2
done
echo "🚀 Lancement de la preview"

source .venv/bin/activate
python website/manage.py runserver $PORT

Premiers ajustements de la partie settings du projet

La structure des paramètres (settings) a été réorganisée :

Les paramètres ont été restructurés pour gérer à la fois les environnements de développement et de production via des variables d'environnement. La configuration est divisée en trois fichiers :

  • 'base.py' : Contient les paramètres communs partagés entre tous les environnements
  • 'dev.py' : Paramètres spécifiques au développement, étendant la configuration de base
  • 'production.py' : Paramètres spécifiques à la production avec des fonctionnalités de sécurité renforcées

Les variables d'environnement sont désormais gérées via des fichiers '.env', permettant une configuration flexible sans exposer les données sensibles. La structure des paramètres suit les bonnes pratiques Django pour la séparation des environnements.

Note : Des ajustements supplémentaires spécifiques à l'environnement seront implémentés ultérieurement, notamment :

  • Renforcement de la sécurité en production
  • Configuration des emails
  • Gestion des fichiers statiques/médias
  • Paramètres de cache
  • Optimisation de la base de données

Cette structure assure une séparation claire des responsabilités et rend le projet prêt pour le déploiement tout en maintenant la facilité de développement.

Voici le fichier d'environnement '.env' qu'il faudra adapter aux besoins :

(c'est la version pour le dev)

1
2
3
4
5
6
7
8
9
SECRET_KEY='ma-secret-key...'
DEBUG=True
ALLOWED_HOSTS= ["127.0.0.1", "localhost"]
ADMINS = [["John", "john@example.com"], ["Mary", "mary@example.com"]]
MANAGERS = [["John", "john@example.com"], ["Mary", "mary@example.com"]]
LANGUAGE_CODE = "fr-FR"
TIME_ZONE = "America/Toronto"
WAGTAIL_SITE_NAME = "Blog BE4WEB.BE"
WAGTAILADMIN_BASE_URL = ""

Création de l'App SEO dans le projet

La première étape consiste à ajouter une app SEO avec Django

1
python manage.py startapp seo