[FEATURE] feat: Add maintenance mode during deployment

[ImadSaddik]

Problem description

Currently, the deployment pipeline exposes users to potential errors during two specific windows:

1. The frontend gap: The rsync step uses the --delete flag. If a user browses the site while files are being synced, they may request a JavaScript chunk that has been deleted, resulting in a blank screen or 404 error.
2. The backend gap: The backend code on disk is updated before the service is restarted. During the time it takes to install Python dependencies, the running Gunicorn process (old code) may try to access files or imports that have changed on disk (new code), leading to potential application crashes.

Proposed solution

Implement a "Maintenance mode" at the Nginx level to intercept traffic during critical deployment steps.

Static maintenance page

Create a standalone maintenance.html file in infrastructure/nginx/. This should be a simple HTML/CSS file (no Vue dependencies) that matches the website's space theme.

Nginx configuration

Update imadsaddik.com.conf to check for the existence of a lock file (e.g., /web_app/maintenance.on).

• If the file exists, return an HTTP 503 status code (preserving SEO).
• Serve the maintenance.html page instead of proxying to the backend or serving the Vue app.

CI/CD Workflow (deploy.yml)

Modify the deployment workflow to toggle this mode:

• Start: specific step to touch /web_app/maintenance.on before the build/sync process begins.
• End: specific step to rm /web_app/maintenance.on after the backend restarts.
• Safety: Ensure the cleanup step uses if: always() so the site does not remain stuck in maintenance mode if the deployment fails.

Alternatives considered

• Vue-based Maintenance Route: We considered adding a maintenance view within the Vue application itself. This was rejected because it relies on the frontend build and rsync process being successful. If the deployment fails or the internet connection drops during rsync, the maintenance page itself would be inaccessible.
• Blue/Green Deployment: Configuring a second slot to deploy to and then swapping traffic. This was deemed overkill for the current single-droplet architecture and would add unnecessary infrastructure complexity.

Additional context

Target Files:

• infrastructure/nginx/imadsaddik.com.conf
• .github/workflows/deploy.yml

Snippet for Nginx logic:

if (-f /web_app/maintenance.on) {
    return 503;
}
error_page 503 @maintenance;
location @maintenance {
    root /web_app/infrastructure/nginx;
    rewrite ^(.*)$ /maintenance.html break;
}