Speed building a carousel block

Yesterday, I competed against Jessica Lyschik in the Speed Build Challenge at WordCamp Asia, which was hosted by Jamie Marsland. I was handily defeated. If you want to witness my failure, check out the live stream recording.

Jessica and I were tasked with rebuilding the homepage of diablaoutdoor.com in WordPress. While Jessica took a practical approach, I decided to experiment with AI to recreate the carousel element in the site's header.

During the 30-minute challenge, I used Cursor to build a rough prototype. The idea was to use Cover blocks for the slides and then create a wrapper block that would handle the carousel functionality. By the end, I had a working, if imperfect, version of the carousel.

After the competition, I spent another hour refining it. For a total of 1.5 hours of prompting, I am quite happy with the result.

You can check out the plugin on GitHub.

It's interesting to browse through the files and see how the AI built the plugin. The block not quite production-ready, but it's close. I would want to add more controls for modifying the carousel, such as autoplay, speed adjustments, and better mobile responsiveness.

So while I lost the competition, it was a fun challenge to see how quickly you can leverage AI to build complicated functionality. Congrats again to Jessica on another well-deserved victory.