Marco Barnig

Lovable AI Showdown

by

Building with the Best: My Experience at “The AI Showdown” on Lovable.dev

During the weekend of June 14–15, 2025, the Swedish start-up lovable.dev (often referred to simply as Lovable), an AI-powered “vibe‑coding” platform, invited users worldwide to build web applications for free—no coding experience required. Lovable enables full-stack app creation through natural language prompts, right in your browser.

In collaboration with OpenAI, Anthropic, and Google, Lovable hosted The AI Showdown—a public benchmarking event comparing the capabilities of leading code-generating AI models. For 48 hours, users enjoyed unlimited free access to Lovable’s powerful tools and all three major AI models.

🚧 My Experiment: Three Models, Two Apps, One Prompt

To test the capabilities of each model, I designed two different applications, submitting identical prompts to all three AIs. Here’s what I built:

🔊 1. Lux-ASR-Trial

A speech-to-text application that allows users to record a voice message on a smartphone or computer using the built-in microphone. The app then transmits the audio file via API to the Lux-ASR speech recognition system developed by the University of Luxembourg.

Lux-ASR supports automatic recognition of Luxembourgish, French, German, English, Portuguese, and Spanish. The transcribed text is immediately displayed on-screen for the user.

Screenshots and test links:

Google App
Anthropic App
OpenAI App

🛑 2. Access-Brake-to-API

This second app is a proof of concept aimed at mitigating the abusive or excessive use of freely accessible GenAI services. It uses the open-source generator randomuser.me to fetch JSON data and display fictitious user profiles, including photo, name, age, and postal address.

To prevent abuse, a progressive delay mechanism is implemented—slowing server requests within a session after each call.

Screenshots and test links:

Anthropic App
OpenAI App
Google App

🌐 Bonus Challenge: Mobile-First WordPress Viewer

To push things further and showcase Lovable’s capabilities with real-world content, I submitted the following prompt—initially to Anthropic, but had to switch to OpenAI due to high server load:

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“

To my surprise, the app worked perfectly—without any need for code tweaks. The generated code has been uploaded to my GitHub account

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

and the live version is publicly accessible at:

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

The following day, I noticed that there were some small HTML issues with list bullets and <h1-h6> headers. I asked lovable.dev to check the code. Here is the answer :

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.

Here is the link to the revised application :

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

📊 What’s Next?

I’m currently analyzing the results and performance of the three models across both projects. I plan to publish a detailed comparison on social media, and submit my findings to the Lovable Content Challenge.

Stay tuned for more!