Skip to content
Vibe Coding the Baguette S3: Web Server GPIO and LED Control
Hi 👋 Rich here. I'm in charge of products at The Pi Hut. I've been playing with our new Baguette S3 board after spending a decent amount of time with our latest recruit, Colin, designing the board.
I'm about to waffle on about my recent introduction to 'vibe coding', including some brief instructions on how to try it out for yourself, and how I ended up making this web server code for the Baguette S3.
If you'd rather just grab the web server script for your Baguette (it's OK, I bore myself sometimes), jump straight to the project code here.
I vibe'd it and I don't care
Now, here's the rub. I have unlimited access to over 8000 products in our warehouse, but what I don't have are:
- Time - I'm a dad of two with a long commute and a busy job
- Energy - see above 👀
- Patience - see above 👀
So how can an exhausted dad of two with a seemingly endless commute continue to tinker and play in the little free time he has left?
Enter vibe coding.
What is vibe coding?
Vibe coding is all about using AI to help you write code. In fact, officially, vibe coding isn't about 'helping' you write code - it does it all for you, and you just review the end product and tweak.
But...isn't that...cheating?
I always thought this. I still think this. I'm on the fence.
It's good for some
On one hand, for folks like me, it helps us to continue to enjoy this 'still up at 3am with a coffee on a school night because I just want to finish this project' hobby - without having to actually stay up until 3am.
The thing is, I've done my time - I've put together my fair share of scripts and code in the traditional way and learnt along the way. More importantly, I did it when I had the time, was somewhat lighter, not quite as close to 40, in a less-demanding 9-5 job and very much child-free.
If there was ever a time to utilise some shortcuts, it was now!
Not so good for others
On the other hand, I hate the idea of younger coders going straight to AI. Nothing beats typing out code from a workbook or article when learning; it makes indentation, functions, and commands stick like glue.
There's also the concern that this will take jobs away from our fellow humans, although I'm not convinced it's reliable enough for anything serious yet.
It's not perfect
Yet. This is more of my general opinion on AI as a whole.
It's amazing - until it's not. I find it very helpful for limited tasks such as formatting, but you just can't beat a squidgy human for accuracy and creative stuff.
I found the same thing when vibe coding - it's incredible - and then some weird, silly mistakes creep in and you're left trying to untangle a dodgy road your code went down.
I'm sure the next 30 years will age this statement terribly as the machines take over and I'm forced to choose a red or blue pill, but for now, I'm not what you would call pro-AI.
Vibe coding the Baguette S3
In terms of how/software, there are lots of options, and as mentioned above, I used Visual Studio Code (VSC) with the Gemini plug-in.
I'm no expert - I hadn't followed any tutorials, I was just messing around with an old ESP8266 board earlier this week and ended up stumbling across the VSC Gemini thing, and it's so intuitive that I was tapping away my demands in minutes.
Want to try? Here's how to get started:
Software
You'll need to download and install:
Then once you've done that, install:
I blindly ticked yes/default to everything whilst doing this (bye bye data and privacy), so apart from installing those (and any recommended dependencies), it's pretty straightforward.
You'll need a Google account to log in to Gemini. I'm pretty sure it's open (and free) for most to use, but certain regions may not be available yet.
Create a new script
We'll create and save a blank script/folder in the Arduino IDE first, and then open that in VSC afterwards. Doing it this way allows you to have both programs open, and any changes to the code on either side will reflect on both applications in real-time.
Open the Arduino IDE, select File > New Sketch, then once that loads, select File > Save As. Give it a name, hit save, and then move over to VSC.
Tip: If you haven't set up your Baguette S3 in the Arduino IDE yet, head over to our user guide and do that now.
Open VSC, then hit Ctrl+O (or File > Open File). Navigate to your Arduino sketch and select it to open. You'll see the same script there, and now any edits on either application will reflect on both instantly:
Open Gemini Code Assist
We're going to run a split view here, with our script on the right and Gemini on the left.
Assuming everything is installed correctly, you'll see the Gemini option in your left-hand sidebar. Give that a cheeky click:
You should see Gemini open on the left side like the example below, ready to accept your prompts:
Gemini Code Assist Prompts
Back to a bit of story time. At this stage, I would usually start searching for the best way to word a prompt - but being the AI sceptic that I am, I wanted to see if it would 'just work'.
So I just went in guns blazing, telling it what I wanted in my own words, something along the lines of:
I'm using a Baguette S3 ESP32-S3 dev board (https://thepihut.com/products/baguette-s3-esp32-s3-prototyping-board) with the Arduino IDE. I want to be able to control elements of the board via a web interface:
- All the GPIO pins HIGH/LOW via ON/OFF buttons in a compact grid
- An ON/OFF button for the onboard RGB LED
- A colour picker for the RGB LED
I want the UI on the web interface to have a 'dark mode' style, with accent colours in #be1443. I want the ability to add two SSIDs for WiFi.
The program needs to be robust, with exceptions built in for no WiFi or any other potential issues.
Gemini got to work straight away...
...and I was blown away! It created a script for me without confusing the board type or asking more questions, and after a quick skim read, it looked promising.
It gave me instructions on libraries I'd need to include in the Arduino IDE, which fields would require modification (such as WiFi SSID and password), and even suggested further prompts/questions I might ask.
All I had to do was click the 'Accept' button, and my script would be updated, reflecting on both VSC and the Arduino IDE:
I was full of confidence, so I switched over to the Arduino IDE, installed the suggested libraries, and uploaded the script to my Baguette S3...
...and it didn't work.
Tweaking and testing
The script failed, but because we have AI at our disposal, this is fine. I copied the error and just dumped it into the Gemini chat.
Gemini analysed the error, explained the problem, suggested a fix, and even gave me a convenient Accept button to automatically update my code.
Same routine - accept the change, test it out, then continue to tweak and refine until it's working how you want.
This is apparently the way with vibe coding - less code inspection, more end product review and requesting changes. I find it saves you so much time, and helps avoid rage quitting your project as you check the clock yet again and realise you should have been in bed an hour ago.
I continued to tweak and ended up with the sketch below.
Baguette S3 Web Server: GPIO and LED Control
You can download my sketch here and have a look for yourself.
You'll need to:
- Make sure your board type and COM port are correctly selected
- Our Baguette S3 user guide covers how to do that
- Update lines 9 and 10 with your own WiFi details
- Install the Adafruit NeoPixel library in your Arduino IDE
The sketch will cycle through colours on the RGB LED for a few seconds when it boots, and then connect to your WiFi network. Grab its IP address from your router or an app like Fing or WiFiman, then go to that IP address on your phone, tablet or PC to see the controls.
If you find any bugs, let me know in the comments. I'll blame the robots, of course.
Why not open it in VSC and ask Gemini to add a password to the interface? Or add a section showing board data? See what you can come up with.
Vibe coding: your view
It's a touchy subject. Is it dumbing down the youth and stealing jobs, or just a useful tool? Is it making makers lazy, or opening the maker scene up to those who wouldn't have even looked at a dev board previously?
Personally, I have found it enables me to get creative with hardware without being put off by the potential time-hog that coding can present (I've always been more of a hardware guy).
I can work on more projects now, and still maintain work and family commitments. Sure, it gets things wrong, but it can (usually) correct them itself, and I have my own knowledge to fall back on if needed.
Would I show it to my kids? No, not yet anyway. I'll keep them on Scratch for now. Walk before you can run.
Add a comment below to share your view or add your own vibe coding top tips.
