DEV Community: Mohamed Amine Ben Mallessa

Migration Photopea vers PDF serveur : retour d'expérience sur un pipeline de rendu avec Playwright

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 03:32:20 +0000

📖 Article original : GitHub Gist

Par Mohamed Amine Ben Mallessa — Lead Dev Sollea AI

Le contexte technique

L'application qu'on a livrée permet de générer des affiches personnalisées à partir d'un simple formulaire web. L'utilisateur remplit ses informations, et l'application produit un document prêt à imprimer.

Architecture : Next.js 15 (frontend par Nassim Tarkhani) + FastAPI (backend par Nassim Tarkhani). Une stack moderne, mais le maillon faible était le rendu des documents — c'est là que je suis intervenu.

Le piège des solutions « gratuites »

Quand on a commencé, Photopea semblait être la solution idéale. En pratique, le maintenir en production s'est révélé très coûteux :

Problème n°1 : L'iframe introuvable

Le PSD était hébergé sur un serveur public. Les en-têtes CORS nécessaires n'étaient pas supportés par l'infrastructure du client.

Problème n°2 : Les exports fantômes

Les exports transitaient par un appel API. En cas de latence réseau, les fichiers étaient tronqués sans alerte.

Problème n°3 : Aucun rendu serveur

Le rendu passait obligatoirement par le navigateur du client. Pas de génération automatisée possible.

Problème n°4 : L'effet « boîte noire »

Impossible de diagnostiquer la source des bugs de rendu.

La solution que j'ai développée

Décision 1 : Un template HTML = une affiche

Au lieu d'un PSD fermé, chaque format d'affiche est un fichier HTML ouvert, versionné dans le dépôt.

Décision 2 : Playwright pour le rendu serveur

Chromium headless via Playwright produit un PDF vectoriel parfait et un PNG haute résolution. ~3,5 secondes par affiche.

Décision 3 : La même source de vérité

Le template HTML sert à la fois pour l'aperçu live et le rendu final. Garantie que l'aperçu est identique au document imprimé.

Le résultat

Métrique	Avant (Photopea)	Après (Moteur HTML)
Dépendances externes	2 (Canva, Photopea)	1 (Playwright)
Coût licence	$$$ (Canva Enterprise)	$0
Temps de rendu	30-60s	~3,5s
Rendu serveur	Impossible	PDF + PNG
Fiabilité	Fragile	Robuste

Ce que cette expérience m'a appris

Les solutions « gratuites » qui nécessitent une infrastructure complexe reviennent souvent plus chères qu'une solution simple qu'on maîtrise de bout en bout. Un template HTML n'a pas la puissance d'un PSD, mais il est lisible, versionnable et reproductible — trois avantages décisifs pour la production.

Mohamed Amine Ben Mallessa — Lead Dev chez Sollea AI
🔗 GitHub | LinkedIn

Merci à **Nassim Tarkhani* pour le développement frontend et backend FastAPI.*

playwright #html #pdfgeneration #fastapi #nextjs #retourdexperience #solleaai #opensource

💻 Vous avez un projet similaire ?

Sollea AI — Développement full-stack, automatisation IA, solutions sur mesure.

🔗 Sollea AI · GitHub · LinkedIn

Équipe dirigée par **Mohamed Amine Ben Mallessa* — Lead Dev Sollea AI*

Comment remplacer Canva et Photoshop par un moteur HTML open source avec Playwright

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 03:32:18 +0000

📖 Article original : GitHub Gist

Par Mohamed Amine Ben Mallessa — Lead Dev Sollea AI

Le produit qu'on a construit

Avec mon équipe chez Sollea AI, nous avons développé une plateforme SaaS de génération d'affiches événementielles. L'application complète — développée en Next.js 15 (frontend par Nassim Tarkhani) et FastAPI (backend par Nassim Tarkhani) — permet à des utilisateurs non techniques de remplir un formulaire et d'obtenir instantanément une affiche professionnelle prête à imprimer.

Le mur qu'on a rencontré

Le pipeline de rendu original reposait sur deux briques externes :

Canva Connect / Autofill : nécessitait un plan Enterprise à plusieurs milliers d'euros par an. Bloqué administrativement.

Photopea (alternative gratuite à Photoshop dans le navigateur) : fonctionnait en théorie, mais en pratique c'était un cauchemar technique :

Chargement d'un PSD public dans un iframe — contraintes CORS impossibles à contourner proprement
Ré-upload des exports vers le backend — fragilité réseau
Artefacts bizarres dans le payload des tickets
Aucun rendu côté serveur possible
Pas d'injection de photos dans les mockups

Bref : deux impasses techniques, une équipe bloquée, un client qui attend.

La solution que j'ai développée

J'ai remplacé l'ensemble du pipeline par un moteur de « render templates » HTML qui tient dans 3 concepts :

Un template = un dossier backend/templates/<slug>/ avec un template.html + un manifest.json
L'aperçu live = le frontend charge le template dans une iframe et lui envoie les données du formulaire par postMessage
Le rendu final = Playwright (Chromium headless) ouvre le même template, injecte les données et exporte en PDF A4 vectoriel + PNG 300 dpi (~3,5 secondes)

Ajouter un nouveau format d'affiche ? Il suffit de déposer un dossier. Zéro code backend, zéro code frontend.

Ce qu'on a supprimé

132 lignes de code Canva OAuth
243 lignes de renderer Photopea
87 lignes de compositeur canvas
33 lignes de route d'export Photopea

Résultat : ~500 lignes de code supprimées, 0 dépendance externe de design, des affiches générées 10× plus vite.

Pourquoi c'est important

Pas besoin de Canva Enterprise. Pas besoin de Photoshop. Pas besoin de SaaS payant. Un fichier HTML, un manifeste JSON, et Playwright.

L'open source a encore gagné.

Article original publié sur GitHub Gist.

Mohamed Amine Ben Mallessa — Lead Dev chez Sollea AI
🔗 GitHub | LinkedIn

Merci à **Nassim Tarkhani* pour le développement frontend et backend FastAPI.*

opensource #playwright #htmltemplates #fastapi #nextjs #devops #solutions Techniques #innovation

💻 Vous avez un projet similaire ?

Sollea AI — Développement full-stack, automatisation IA, solutions sur mesure.

🔗 Sollea AI · GitHub · LinkedIn

Équipe dirigée par **Mohamed Amine Ben Mallessa* — Lead Dev Sollea AI*

Vector PDF and 300 DPI PNG generated in 3 seconds with Playwright — Complete guide

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 01:18:05 +0000

📖 Original article: GitHub Gist

By Mohamed Amine Ben Mallessa — Lead Dev at Sollea AI

The challenge

Generate customized vector PDF posters and high-res PNG images server-side on the fly. No fat client, no browser UI, no paid SaaS.

The solution? Playwright (headless Chromium) + versioned HTML templates.

How it works

Form → HTML template + postMessage → Playwright headless → A4 vector PDF + 300 DPI PNG

The template: a self-contained HTML file with inline CSS and SVG. No external dependencies, no font loading, no network requests.

The render: Playwright opens the template, injects data via JavaScript, exports as PDF (1 page, vector, A4) and PNG (300 DPI, 2480×3508px).

The speed: ~3.5 seconds per document. Fully reproducible.

Why it beats wkhtmltopdf or Puppeteer

Tool	Reliability	Vector	Size	Ease of use
wkhtmltopdf	⚠️ CSS issues	✅ PDF	✅	❌ Unmaintained
Puppeteer	✅	✅	✅	⚠️ Heavy
Playwright	✅✅	✅✅	✅✅	✅✅

Playwright handles fonts, viewport, headless mode natively, and integrates perfectly with FastAPI.

The trick

One HTML template = live preview in the browser AND final PDF/PNG render. No duplicate code, no preview/production divergence.

postMessage({ type: "setState", state: formData }) → the template updates. Whether inside a frontend iframe or Playwright's headless Chromium.

What we gained

Zero subscription cost (no Canva, no Adobe)
3.5s generation time
Perfect vector PDF (no pixelation)
Print-ready PNG
Templates versioned in Git
New format = one folder

Originally published on GitHub Gist.

Mohamed Amine Ben Mallessa — Lead Dev at Sollea AI
🔗 Sollea AI · GitHub · LinkedIn

playwright #fastapi #pdfgeneration #htmltemplates #opensource #python #webdev

💻 Have a similar project?

Sollea AI — Full-stack development, AI automation, custom solutions.

🔗 Sollea AI · GitHub · LinkedIn

Team led by **Mohamed Amine Ben Mallessa* — Lead Dev at Sollea AI*

PDF vectoriel et PNG 300 dpi générés en 3 secondes avec Playwright — Guide complet

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 01:13:16 +0000

📖 Article original : GitHub Gist

Par Mohamed Amine Ben Mallessa — Lead Dev Sollea AI

Le défi

Nous devions générer des affiches personnalisées au format PDF vectoriel et PNG haute résolution, à la volée, côté serveur. Pas de client lourd, pas de navigateur, pas de SaaS externe.

La solution ? Playwright (Chromium headless) + un template HTML versionné.

Comment ça marche

Formulaire → Template HTML + postMessage → Playwright headless → PDF A4 vectoriel + PNG 300 dpi

Le template : un fichier HTML autonome avec son CSS inline et son SVG. Pas de dépendance externe, pas de polices à charger, pas de requêtes réseau.

Le rendu : Playwright ouvre le template, injecte les données via JavaScript, exporte en PDF (1 page, vectoriel, A4) et en PNG (300 dpi, 2480×3508px).

Le temps : ~3,5 secondes par document. Reproductible à l'identique.

Pourquoi c'est mieux que wkhtmltopdf ou Puppeteer

Solution	Fiabilité	Vectoriel	Taille	Facilité
wkhtmltopdf	⚠️ CSS capricieux	✅ PDF	✅	❌ Obsolète
Puppeteer	✅	✅	✅	⚠️ Lourd
Playwright	✅✅	✅✅	✅✅	✅✅

Playwright gère nativement les polices, le viewport, le mode headless, et s'intègre parfaitement avec FastAPI via un simple subprocess.

L'astuce

Un seul template HTML = aperçu live dans le navigateur + rendu final PDF/PNG. Pas de code en double, pas de divergence preview/production.

postMessage({ type: "setState", state: formData }) → le template se met à jour. Que ce soit dans l'iframe du frontend ou dans Chromium headless.

Ce qu'on a gagné

0 abonnement (ni Canva, ni Adobe)
3,5s de temps de génération
PDF vectoriel parfait (pas de pixelisation)
PNG prêt à imprimer
Templates versionnés dans Git
Ajout d'un nouveau format = 1 dossier

Le client économise des milliers d'euros par an et gagne en autonomie.

Article initialement publié sur GitHub Gist.

Mohamed Amine Ben Mallessa — Lead Dev chez Sollea AI
🔗 Sollea AI · GitHub · LinkedIn

playwright #fastapi #pdfgeneration #htmltemplates #opensource #python #webdev

💻 Vous avez un projet similaire ?

Sollea AI — Développement full-stack, automatisation IA, solutions sur mesure.

🔗 Sollea AI · GitHub · LinkedIn

Équipe dirigée par **Mohamed Amine Ben Mallessa* — Lead Dev Sollea AI*

Génération de documents PDF en 3 secondes avec Playwright et FastAPI — Tutoriel

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 01:11:24 +0000

📖 Article original : GitHub Gist

Par Mohamed Amine Ben Mallessa — Lead Dev Sollea AI

Le défi

Nous devions générer des affiches personnalisées au format PDF vectoriel et PNG haute résolution, à la volée, côté serveur. Pas de client lourd, pas de navigateur, pas de SaaS externe.

La solution ? Playwright (Chromium headless) + un template HTML versionné.

Comment ça marche

Formulaire → Template HTML + postMessage → Playwright headless → PDF A4 vectoriel + PNG 300 dpi

Le template : un fichier HTML autonome avec son CSS inline et son SVG. Pas de dépendance externe, pas de polices à charger, pas de requêtes réseau.

Le rendu : Playwright ouvre le template, injecte les données via JavaScript, exporte en PDF (1 page, vectoriel, A4) et en PNG (300 dpi, 2480×3508px).

Le temps : ~3,5 secondes par document. Reproductible à l'identique.

Pourquoi c'est mieux que wkhtmltopdf ou Puppeteer

Solution	Fiabilité	Vectoriel	Taille	Facilité
wkhtmltopdf	⚠️ CSS capricieux	✅ PDF	✅	❌ Obsolète
Puppeteer	✅	✅	✅	⚠️ Lourd
Playwright	✅✅	✅✅	✅✅	✅✅

Playwright gère nativement les polices, le viewport, le mode headless, et s'intègre parfaitement avec FastAPI via un simple subprocess.

L'astuce

Un seul template HTML = aperçu live dans le navigateur + rendu final PDF/PNG. Pas de code en double, pas de divergence preview/production.

postMessage({ type: "setState", state: formData }) → le template se met à jour. Que ce soit dans l'iframe du frontend ou dans Chromium headless.

Ce qu'on a gagné

0 abonnement (ni Canva, ni Adobe)
3,5s de temps de génération
PDF vectoriel parfait (pas de pixelisation)
PNG prêt à imprimer
Templates versionnés dans Git
Ajout d'un nouveau format = 1 dossier

Le client économise des milliers d'euros par an et gagne en autonomie.

Article initialement publié sur GitHub Gist.

Mohamed Amine Ben Mallessa — Lead Dev chez Sollea AI
🔗 Sollea AI · GitHub · LinkedIn

playwright #fastapi #pdfgeneration #htmltemplates #opensource #python #webdev

💻 Vous avez un projet similaire ?

Sollea AI — Développement full-stack, automatisation IA, solutions sur mesure.

🔗 Sollea AI · GitHub · LinkedIn

Équipe dirigée par **Mohamed Amine Ben Mallessa* — Lead Dev Sollea AI*

From fragile iframes to server-side PDFs: a rendering migration story with Playwright

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 01:07:09 +0000

By Mohamed Amine Ben Mallessa — Lead Dev at Sollea AI

The technical context

The application we shipped generates customized posters from a simple web form. Users fill in their event details (dates, venue, times) and the app produces a print-ready document.

Tech stack: Next.js 15 (App Router, TypeScript, TanStack Query) + FastAPI (SQLAlchemy 2, PostgreSQL). Modern stack — but document rendering was the weak link.

The trap of "free" solutions

When we started, Photopea looked ideal: a free Photoshop clone, scriptable via JavaScript. In production, it turned into a maintenance sink:

Issue #1: The elusive iframe

PSD files had to be publicly hosted with Access-Control-Allow-Origin: *. A CORS requirement that the client's infrastructure couldn't meet.

Issue #2: Ghost exports

Exports traveled through a backend API route (/photopea/exports). Network latency or timeouts could silently truncate exports.

Issue #3: No server-side rendering

Everything went through the client's browser. No automated generation, no CI/CD pipeline.

Issue #4: The black box effect

When a poster had rendering issues, nobody could tell if the problem was Photopea, the network, the PSD, or the code.

The fix in 3 decisions

Decision 1: HTML template = poster

Instead of a closed PSD, each poster format is an open HTML file versioned in the repo. Full control of layout, CSS, SVG.

Decision 2: Playwright for server-side render

Headless Chromium via Playwright produces a perfect vector PDF and high-res PNG. Average time: 3.5 seconds per poster. Fully reproducible.

Decision 3: Single source of truth

The same HTML template serves both the live iframe preview AND the Playwright final render. Zero difference between preview and printed document.

The numbers

Metric	Before (Photopea)	After (HTML Engine)
External dependencies	2 (Canva, Photopea)	1 (Playwright)
License cost	$$$$ (Canva Enterprise)	$0
Render time	30-60s (network dependent)	~3.5s
Server-side render	Impossible	PDF + PNG
Reliability	Fragile	Robust
Adding a template	Complex config	One folder + manifest

What I learned

"Free" solutions with complex infrastructure often end up costing more than a simple solution you fully control.

An HTML template isn't as powerful as a PSD — but it has three decisive advantages: it's readable, versionable, and reproducible.

Thanks to Nassim Tarkhani for pushing this direction. This idea saved the project.

Mohamed Amine Ben Mallessa — Lead Dev at Sollea AI
🔗 GitHub | LinkedIn

Need help with your technical stack? Sollea AI specializes in custom automation and AI solutions.

playwright #html #pdfgeneration #fastapi #nextjs #engineering #webdev #architecture

💻 Have a similar project?

Sollea AI — Full-stack development, AI automation, custom solutions.

🔗 Sollea AI · GitHub · LinkedIn

Team led by **Mohamed Amine Ben Mallessa* — Lead Dev at Sollea AI*

Migration Photopea vers PDF serveur : retour d'expérience sur un pipeline de rendu avec Playwright

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 01:05:56 +0000

CONTENT_PLACEHOLDER

How to replace Canva and Photopea with an open-source HTML render engine using Playwright

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 00:59:59 +0000

📖 Article original : GitHub Gist

By Mohamed Amine Ben Mallessa — Lead Dev at Sollea AI

The product we built

My team at Sollea AI developed a SaaS platform for generating event posters. The full-stack application — built with Next.js 15 (frontend) and FastAPI (backend) — lets non-technical users fill a form and instantly get a print-ready professional poster.

The wall we hit

The original rendering pipeline depended on two external services:

Canva Connect / Autofill : required an Enterprise plan costing thousands per year. Blocked by procurement.

Photopea (free browser-based Photoshop alternative): worked in theory but was a technical nightmare:

Loading a public PSD in an iframe → impossible CORS issues
Re-uploading exports to the backend → network fragility
Ghost _photopea_preview_url values appearing in the ticket payload
No server-side rendering possible (everything went through the client's browser)
No photo injection into mockups

Two dead ends. A blocked team. A waiting client.

Nassim's insight

It was Nassim Tarkhani who had the intuition: what if we replaced all this with a simple versioned HTML template, rendered by Playwright?

A self-contained HTML file served statically from the backend, controlled via postMessage. The same file drives both the live iframe preview AND the server-side PDF/PNG rendering.

This sounds obvious in hindsight. That's usually the hallmark of the best solutions.

The solution

The render template engine fits in 3 concepts:

A template = a backend/templates/<slug>/ folder with template.html + manifest.json
The live preview = the frontend loads the template in an iframe and sends form data via postMessage
The final render = Playwright (headless Chromium) opens the same template, injects the data and exports vector A4 PDF + 300 DPI PNG (~3.5 seconds)

Adding a new poster format? Just drop a folder. Zero backend code. Zero frontend code.

What we deleted

132 lines of Canva OAuth code (connect, callback, refresh)
243 lines of Photopea renderer (iframe, script injection, error handling)
87 lines of canvas compositor (working around Photopea's limitations)
33 lines of Photopea export route

Result: ~500 lines deleted, 0 external design dependencies, posters generated 10× faster.

Why this matters

No Canva Enterprise. No Photoshop. No paid SaaS. An HTML file, a JSON manifest, and Playwright.

Open source wins again.

Originally published on GitHub Gist.

Mohamed Amine Ben Mallessa — Lead Dev at Sollea AI
🔗 GitHub | LinkedIn

Special thanks to **Nassim Tarkhani* for the idea and the code review.*

opensource #playwright #htmltemplates #fastapi #nextjs #devops #pdfgeneration #innovation

💻 Have a similar project?

Sollea AI — Full-stack development, AI automation, custom solutions.

🔗 Sollea AI · GitHub · LinkedIn

Team led by **Mohamed Amine Ben Mallessa* — Lead Dev at Sollea AI*

Comment remplacer Canva et Photoshop par un moteur HTML open source avec Playwright

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 00:59:53 +0000

📖 Article original : GitHub Gist

Par Mohamed Amine Ben Mallessa — Lead Dev Sollea AI

Le produit qu'on a construit

Avec mon équipe chez Sollea AI, nous avons développé une plateforme SaaS de génération d'affiches événementielles pour un client du secteur de la formation. L'application complète — développée en Next.js 15 (frontend) et FastAPI (backend) — permet à des utilisateurs non techniques de remplir un formulaire et d'obtenir instantanément une affiche professionnelle prête à imprimer.

Le mur qu'on a rencontré

Le pipeline de rendu original reposait sur deux briques externes :

Canva Connect / Autofill : nécessitait un plan Enterprise à plusieurs milliers d'euros par an. Bloqué administrativement.

Photopea (alternative gratuite à Photoshop dans le navigateur) : fonctionnait en théorie, mais en pratique c'était un cauchemar technique :

Chargement d'un PSD public dans un iframe — contraintes CORS impossibles à contourner proprement
Ré-upload des exports vers le backend — fragilité réseau
Artefacts bizarres dans le payload des tickets (valeurs _photopea_preview_url qui s'invitaient sans prévenir)
Aucun rendu côté serveur possible (tout passait par le navigateur du client)
Pas d'injection de photos dans les mockups

Bref : deux impasses techniques, une équipe bloquée, un client qui attend.

L'idée de Nassim

C'est Nassim Tarkhani qui a eu l'intuition : et si on remplaçait ça par un simple template HTML versionné, rendu par Playwright ?

Un template HTML qu'on sert statiquement depuis le backend et qu'on pilote par postMessage. Le même fichier sert pour l'aperçu live dans le navigateur ET pour le rendu final PDF/PNG sur le serveur.

Cette idée paraît simple a posteriori. Mais c'est souvent le signe des meilleures solutions.

La solution

Le résultat, c'est un moteur de « render templates » qui tient dans 3 concepts :

Un template = un dossier backend/templates/<slug>/ avec un template.html + un manifest.json
L'aperçu live = le frontend charge le template dans une iframe et lui envoie les données du formulaire par postMessage
Le rendu final = Playwright (Chromium headless) ouvre le même template, injecte les données et exporte en PDF A4 vectoriel + PNG 300 dpi (~3,5 secondes)

Ajouter un nouveau format d'affiche ? Il suffit de déposer un dossier. Zéro code backend, zéro code frontend.

Ce qu'on a supprimé

132 lignes de code Canva OAuth (connexion, callback, refresh token)
243 lignes de renderer Photopea (iframe, script injection, gestion d'erreurs)
87 lignes de compositeur canvas (compensation des limitations Photopea)
33 lignes de route d'export Photopea

Résultat : ~500 lignes de code supprimées, 0 dépendance externe de design, des affiches générées 10× plus vite.

Pourquoi c'est important

Pas besoin de Canva Enterprise. Pas besoin de Photoshop. Pas besoin de SaaS payant. Un fichier HTML, un manifeste JSON, et Playwright.

L'open source a encore gagné.

Article original publié sur GitHub Gist.

Mohamed Amine Ben Mallessa — Lead Dev chez Sollea AI
🔗 GitHub | LinkedIn

Remerciements à **Nassim Tarkhani* pour l'idée et la review.*

opensource #playwright #htmltemplates #fastapi #nextjs #devops #solutions Techniques #innovation

💻 Vous avez un projet similaire ?

Sollea AI — Développement full-stack, automatisation IA, solutions sur mesure.

🔗 Sollea AI · GitHub · LinkedIn

Équipe dirigée par **Mohamed Amine Ben Mallessa* — Lead Dev Sollea AI*

Convertir des images en lot (HEIC, WebP, JPG) gratuitement — Guide pratique

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 00:46:57 +0000

📖 Article original : GitHub Gist

Un guide technique par Mohamed ben mallessa

Le problème

Recevoir un dossier de 500 fichiers HEIC à convertir en WebP pour un site web est une situation courante pour tout développeur. Les solutions traditionnelles ont leurs limites : ImageMagick nécessite des codecs spécifiques, les convertisseurs en ligne sont limités en taille, et le traitement manuel est exclu à cette échelle.

La solution

Photopea (Photoshop gratuit dans le navigateur) supporte nativement tous les formats d'image courants. En l'utilisant comme moteur de conversion piloté par script, on obtient un pipeline batch rapide et fiable.

Formats supportés

Entrée	Sorties possibles
HEIC / HEIF	JPG, PNG, WebP
JPEG	WebP, PNG, PSD
PNG	JPG, WebP
WebP	PNG, JPG
PSD	PNG, JPG, WebP
SVG	PNG, JPG
TIFF	PNG, JPG, WebP

Pipeline

Dossier source (500 HEIC) → Photopea → Dossier sortie (500 WebP)

Le script préserve la structure des sous-dossiers, applique le redimensionnement et la qualité configurés, et livre les fichiers organisés.

Paramètres typiques

--format webp    # Format de sortie
--quality 80     # Qualité (1-100)
--resize 1920    # Redimensionnement (côté long)
--output ./web/  # Dossier de destination

Avantages

Un seul outil pour tous les formats d'entrée
Aucun codec à installer (Photopea gère tout nativement)
Gratuit et sans abonnement
Local — les fichiers ne quittent pas votre machine
Structure préservée — l'arborescence est conservée

Mohamed ben mallessa — Full-stack developer & solutions B2B
🔗 GitHub · LinkedIn

opensource #webp #python #tutorial

💻 Vous avez un projet technique ?

Développement full-stack, automatisation IA, solutions B2B sur mesure.

🔗 GitHub
💼 LinkedIn
🎨 Behance

Article initialement publié sur GitHub Gist

Générer des mockups produits en lot

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 00:46:38 +0000

📖 Article original : GitHub Gist

Un guide technique par Mohamed ben mallessa

Le besoin

Un template PSD, 50 variantes produit, un seul résultat attendu : 50 mockups finis. La méthode manuelle (ouvrir → glisser → exporter → répéter) prend des heures. L'alternative : un batch automatisé piloté par script.

Le fonctionnement

Un template PSD contenant un smart object nommé (ex: "MOCKUP_PLACEHOLDER")
Un fichier CSV listant les produits et leurs chemins d'images
Un script qui itère sur le CSV, remplace le smart object et exporte chaque variante
Les fichiers PNG sont livrés dans le dossier de sortie

Cas d'usage

E-commerce : générer les visuels de tout un catalogue
Print-on-demand : produire les mockups t-shirts/mugs/posters
Agency : décliner un template pour plusieurs clients

Prérequis

Un template PSD avec un smart object dédié
Photopea (gratuit, navigateur) — aucune licence nécessaire
Python 3.8+
Node.js (pour le serveur MCP)

Pipeline type

CSV (produits) → Photopea → PNG (mockups finis)

Chaque ligne du CSV est traitée automatiquement : le smart object est remplacé par l'image correspondante, le document est exporté, et le script passe au suivant.

Avantages

Temps réduit : 50 mockups en quelques minutes
Cohérence : tous les visuels suivent exactement le même template
Gratuit : pas d'abonnement Photoshop, pas de SaaS payant

Mohamed ben mallessa — Full-stack developer & solutions B2B
🔗 GitHub · LinkedIn

opensource #mockups #python #ecommerce

💻 Vous avez un projet technique ?

Développement full-stack, automatisation IA, solutions B2B sur mesure.

🔗 GitHub
💼 LinkedIn
🎨 Behance

Article initialement publié sur GitHub Gist

Générer des posts réseaux sociaux en une commande — Guide pratique

Mohamed Amine Ben Mallessa — Sat, 04 Jul 2026 00:41:38 +0000

📖 Article original : GitHub Gist

Un guide technique par Mohamed ben mallessa

Le contexte

Publier régulièrement sur Instagram et LinkedIn demande des visuels adaptés à chaque format : carré pour le fil, story pour les alertes, bannière pour les articles. Produire ces variantes une par une est chronophage.

L'approche

Un script unique qui génère les trois formats à partir des mêmes paramètres. Le moteur de rendu est Photopea (Photoshop gratuit dans le navigateur) ou un rendu SVG direct pour plus de rapidité.

Formats supportés

Format	Dimensions	Usage
Square	1080×1080	Fil Instagram, Facebook, LinkedIn
Story	1080×1920	Stories Instagram, Facebook
Banner	1200×630	Open Graph, Twitter Cards

Styles disponibles

7 thèmes visuels prêts à l'emploi :

modern — Bleu nuit, accents dorés
gold — Noir et or, luxe
bold — Rouge, urgence
minimal — Blanc épuré
tech — Bleu/cyan, startup
nature — Vert forêt
sunset — Violet/orangé

Utilisation

python post_factory.py square "TITRE" "Sous-titre" "Accroche" "CTA" "@handle" output.png

Le fichier social_post_svg.py génère des posts sans navigateur, en pur SVG, pour une exécution encore plus rapide.

Pourquoi c'est utile

Un seul brief pour tous les formats
Cohérence visuelle garantie
Génération en quelques secondes
Pas d'abonnement à un outil de design

Mohamed ben mallessa — Full-stack developer & solutions B2B
🔗 GitHub · LinkedIn

opensource #socialmedia #python #tutorial

💻 Vous avez un projet technique ?

Développement full-stack, automatisation IA, solutions B2B sur mesure.

🔗 GitHub
💼 LinkedIn
🎨 Behance

Article initialement publié sur GitHub Gist