Créer avec les meilleurs : mon expérience à The AI Showdown sur Lovable.dev

Lors du week-end des 14 et 15 juin 2025, lovable.dev (souvent simplement appelé Lovable), une plateforme de « vibe‑coding » pilotée par l’IA, a invité les utilisateurs du monde entier à créer des applications web gratuitement — sans aucune compétence de codage. Lovable permet de concevoir des applications full‑stack via des instructions en langage naturel, directement dans le navigateur.

En partenariat avec OpenAI, Anthropic et Google, Lovable a organisé The AI Showdown, un événement public de benchmarking comparant les capacités des principaux modèles d’IA générateurs de code. Pendant 48 heures, les participants ont bénéficié d’un accès gratuit et illimité à tous les outils et modèles de Lovable.

---

🚧 Mon expérience : trois modèles,deux apps, un seul prompt

Pour évaluer chaque modèle, j’ai conçu deux applications en soumettant les mêmes instructions aux trois IA. Voici ce que j’ai réalisé :

🔊 1. Lux‑ASR‑Trial

Une application de reconnaissance vocale permettant à l’utilisateur d’enregistrer un message vocal sur smartphone ou ordinateur, puis d’envoyer le fichier audio via API au système Lux‑ASR, développé par l’Université du Luxembourg.
Lux‑ASR prend en charge automatiquement le luxembourgeois, le français, l’allemand, l’anglais, le portugais et l’espagnol. La transcription est affichée immédiatement à l’écran.

Captures d’écran et liens de test :

• https://google-speak-luxasr.lovable.app
• https://anthropic-speak-luxasr.lovable.app
• https://openai-speak-luxasr.lovable.app

🛑 2. Access‑Brake‑to‑API

Un proof of concept visant à limiter l’utilisation abusive des services GenAI gratuits. L’application utilise randomuser.mepour récupérer des profils fictifs (photo, nom, âge, adresse). Un délai progressif ralentit chaque requête successive dans la même session, afin de freiner les abus.

Captures d’écran et liens de test :

• https://random-user-viewer-by-anthropic.lovable.app
• https://random-profile-explorer-by-openai.lovable.app
• https://instant-profile-seeker-by-google.lovable.app

🌐 Défi bonus : Visionneuse WordPress Mobile-First

Pour aller plus loin et démontrer les capacités de Lovable avec un contenu réel, j’ai soumis l’invite suivante — initialement à Anthropic, mais j’ai dû passer à OpenAI en raison d’une surcharge du serveur.

Prompt:

Create a Mobile First app that fetches the JSON content of a WordPress article from the REST API at admin.ki-leierbud.lu/?p=1008 and displays it as a properly formatted HTML page with the following features:

1. A fixed header (#003366 background) with the article title on the left and a language switcher (EN, FR, DE, PT, LB) on the right.
2. A fixed footer (#004080 background) with a 3-column grid showing the article’s tags.
3. A central content area (#E6F2FF background) displaying the article body with:
   • Blue, non-underlined links
   • Proper bullets for lists
   • Bold and italic text where applicable
   • UTF-8 support
4. All links should open in a new tab/window.
5. On language change, load the corresponding article:
   • EN > ?p=1008
   • FR > ?p=1012
   • DE > ?p=1017
   • PT > ?p=1014
   • LB > ?p=1020

À ma grande surprise, l’application a parfaitement fonctionné — sans nécessiter la moindre modification du code. Le code généré a été téléchargé sur mon compte GitHub (lien à venir) et la version en ligne est accessible publiquement à l’adresse suivante :

🔗  https://github.com/mbarnig/leierbud-article-viewer

et la version en ligne est accessible publiquement à l’adresse suivante :

🔗  https://the-ai-showdown.lovable.app

Le lendemain, j’ai remarqué quelques petits problèmes HTML concernant les puces de liste et les balises de titres <h1> à <h6>. J’ai demandé à lovable.dev de vérifier le code. Voici la réponse :

Looking at your code, I can see the issue. The HTML content is being rendered with dangerouslySetInnerHTML, 
but the proper styling for HTML elements like headings, lists, etc. is not being applied correctly.

The problem is in the ArticleContent component. While you're using the prose class from Tailwind's typography plugin, 
it seems like the typography plugin might not be installed, or the styles aren't being applied properly to the rendered HTML content.

I've fixed the HTML styling issues by adding proper CSS rules for all HTML elements in the article content. 
Now headings (h1-h6) will display with different sizes, lists will show proper bullets/numbers, and all other HTML elements will be properly styled.

Voici le lien vers l’application révisée :

🔗 https://the-ai-showdown-rev1.lovable.app

📊 Et maintenant ?

Je suis en train d’analyser les performances des trois modèles sur ces deux projets. Je prévois de publier une comparaison détaillée sur les réseaux sociaux, ainsi que de soumettre mes résultats au Lovable Content Challenge.

Restez connecté·e·s pour en savoir plus !