I vibe coded a website with my daughter using AI. We're complete novices. Here's what happened.
I write a newsletter for Business Insider called Tech Memo. There's a section called AI Playground where I use a new generative AI tool every week. My latest experiment took me and my daughter deep into the world of AI coding tools.
We got started on a Sunday on the couch in early June. My daughter Tessa was back home from Wake Forest for part of the summer. She has a soap business called Scrub Club and wanted a website to promote and sell her products.
So we logged into Bolt.new and signed up for the company's Hackathon challenge. This gave us 10 million tokens to use for free. Normally, a subscription like this would cost $20 a month. Bolt is designed for novices, like us, who have no software coding experience. It's part of a new breed of AI tools that have spawned the term " vibe coding."
Here's how our vibe sessions went. Spoiler alert: The Scrub Club website is up and running. Let us know what you think: scrubclubsoap.com
Getting started
We started by uploading some photos of Tessa's soaps, along with a rough description of the website she wanted. Bolt created the site within a couple of minutes, added the soap photos to the correct sections of the site, and updated us:
"Your collection now showcases an amazing variety of unique shapes, colors, and scents — from elegant leaf-impressed bars with beautiful gradient effects to whimsical unicorns and vibrant autumn maple leaves. Each product maintains the handcrafted artisan quality that makes Scrub Club special!"
This was an endearing feature of Bolt. No matter how crap our ideas or requests were, the tool retained a positive and supportive attitude. Sometimes, it was overly eager, in fact.
Mistakes and stuff that wasn't true
When we edited some of the product listings, it took the header image of the Scrub Club logo and incorrectly put it as a new product listing. We had to type in another request to remove that. And as the afternoon progressed, the more we tweaked and fiddled, the more odd updates and mistakes the tool made.
The Bolt tool added some things that were not entirely true, to put it mildly:
It listed bestsellers that were not the top-selling products
It added customer reviews, saying things like "14 ***** Reviews" when there have been very few reviews online for Tessa's soaps so far.
It also kept insisting on saying Scrub Club had "+100 Happy Customers." The real number (so far!) is just over 20.
Bolt was particularly over-eager when it came to describing the soaps Tessa made and listed on the Scrub Club site. For one of her blue soap bars, it mentioned "ocean breeze scent." Tessa has not managed to bottle the smell of the sea yet for her products.
Bolt also highlighted "lavender and vanilla fragrance," "candy and berry scent," and decided that a yellow moth-shaped soap smelled of "spice." None of this is true, although my daughter's soaps do smell nice! There's been some early research on trying to get machines to understand different smells, but that's clearly not embedded in the AI models supporting Bolt's coding tool yet.
Getting prescriptive
So, we asked Bolt to "Keep everything else the same, but remove references to scents and smells from the product listings."
We had to be prescriptive like this because when we asked for other changes earlier, Bolt would make the tweaks but would also change other things and get them wrong, which was frustrating.
This time, though, Bolt removed all mentions of scent and smell without messing up other things on the site.
"The product descriptions now focus on the visual aspects like colors, shapes, and designs instead of any olfactory elements. Everything else remains exactly the same, including pricing, layout, and functionality," Bolt told us in its chirpy tone.
By the evening on Sunday, we had a website with many of Tessa's soaps listed. It had Tessa's Scrub Club logo, pricing details, a contact form, and links to Tessa's Etsy store and her Scrub Club Instagram account.
We wanted to add the ability to accept payments. Things got a little complicated at this point. So we put the project on pause and fired up Netflix with some pizza for the rest of the evening. By then, we had 9.4 million tokens left in our Bolt account.
Integrating Stripe payments
About a week later, we logged back onto Bolt.new and tried to add Stripe to Tessa's Scrub Club website. Stripe is the main way developers add the ability to accept card and online payments for their sites and apps.
We clicked on an "Integrations" button on the top right of the Bolt page and Stripe appeared in a dropdown menu along with Supabase and GitHub. We chose Stripe and Bolt told us this:
"To implement payments in your application, we'll need to use Stripe, which is the industry standard for secure payment processing. Before we can proceed with the integration, you'll need to:
Create a Stripe account if you haven't already
Once logged in, navigate to the Developers section in your Stripe Dashboard
Get your Stripe secret key
Once you have your Stripe secret key, let me know and I'll help you implement a secure payment system in your application."
We were sent over to Stripe's website and created an account there, and tracked down our secret API key pretty easily on the developer page. We copied this long string of characters, then we went back to Bolt and pasted the key into the right place.
Then we went back to Stripe and looked for what to do next. Things got pretty confusing at this point (well, for us anyway!). We ended up on a page that required us to create new products and set pricing, shipping, sales tax rates, and other complex stuff.
Just asking Bolt to do it
So, we gave up and just went back to Bolt and typed in "We added our secret API key from Stripe. What do we do now?"
Bolt replied reassuringly: " Perfect! Now that you have your Stripe secret key set up, I'll integrate Stripe payments into your Scrub Club website. I'll add a complete payment system with a shopping cart, checkout process, and order confirmation."
Then it did all the coding work and added the following features:
A Shopping Cart System
A Checkout Process
Customer Information Form: Collects shipping details and contact info
Order Summary: Shows all items and total before checkout
Order Confirmation: Success page after order placement
Key Features
Quantity Management: Increase/decrease quantities in cart
Remove Items: Delete items from cart
Price Calculations: Automatic total calculations
Email Integration, with customer orders sent directly to Tessa's email address.
Bolt also described the ordering process clearly. When customers place an order:
They fill out their information and review their cart
The system sends an email to Tessa with all order details
She can then contact them directly to arrange payment via Venmo, PayPal, etc.
" This gives you full control over the payment process while providing a professional shopping experience," Bolt said.
" The cart icon in the header shows the number of items, and customers can easily add products, review their cart, and place orders. The system is production-ready and will help streamline your order process!" we were also told.
Deploying via Netlify
We then clicked the blue "Deploy" button at the top right corner of the Bolt page. This connected us to Netlify, a company that hosts websites and apps created with Bolt.
After about one minute, Bolt told us the site was deployed and gave us a URL link to check it out online.
This all seemed too easy, so we double checked: "Does this website work fully now, or do we have to do anything else?" we typed the Bolt query box.
It replied, saying the site was "fully functional!" and summarized everything we'd created, including a shopping cart, a checkout process, and a product catalog.
It also shared a useful reminder about the payment process. The checkout page explains to customers that Tessa will contact them directly for payment, "which is perfect for a small business. No monthly fees or complex payment processing needed."
Claiming our project and picking a domain
One wrinkle at the end: Bolt said that to claim this project for ourselves, we had to go to Netlify's website and do a few more things. It provided a link for us to click.
We followed that and were asked to create a Netlify account, which we did. Then we were taken straight to the page where we could claim the project. Note: If you don't do this, someone else might get hold of your claim link and grab your site for themselves and change it. Not good.
Once the project belonged to us, we tried to buy a custom domain via Netlify. We chose scrubclubsoap.com, which cost $15 for the first year. We were told to wait about 10 minutes, so we hung some laundry out to dry in the garden, then came back.
By then, it was all done, including encryption certificates and other important stuff that we really didn't want to be bothered with.
A review from my editor
I sent the website to my editor Akin Oyedele and asked for feedback. Here's his review:
What he liked:
The photos were sharp and consistent.
The soap shapes themselves were creative.
The website overall looked clean and professionally done.
My browser didn't warn that the site wasn't secure.
Most of the links worked.
What he didn't quite like:
The logo was underwhelming compared to the visual quality of the photos
When he tried to add more than one of each soap, he had to press the "add to cart" button multiple times. Usually, a counter with plus and minus signs pops up on that button on other websites.
The heart buttons on some of the soaps didn't do anything
He wished there were descriptions of how the soaps smell.
At this point, I broke the news to Akin about Bolt's over-eager scent descriptions!
A final tweak and thoughts
In response to his feedback, we went back into Bolt and asked the tool to make the Scrub Club logo larger. It did that, but then cut off the top of the rest of the site.
We got a little whiny at this point and sent this to Bolt: "You've cut off the top of the rest of the website now. Can you fix that please?"
Bolt responded by saying, "You're absolutely right!" and went about addressing the problem. That took about two minutes, and then we asked it to deploy the site again to Netlify, which it did in about five minutes.
At the end of all this, we had 8.9 million tokens left in the Bolt account. So we'd used 1.1 million.
All in all, this was a relatively easy lift for two people with no software coding experience. When we were stumped by what to do next, we often just typed questions into Bolt without thinking too much about the prompts. This worked almost always. Sometimes, we had to repeat requests or get more specific and prescriptive, but that wasn't too much extra work.
Total time spent on the project: About six hours. For two people with no coding background, the experience was surprisingly smooth — proof that AI tools like Bolt can empower anyone to build a real website.
Try Our AI Features
Explore what Daily8 AI can do for you:
Comments
No comments yet...
Related Articles
Business Insider
3 hours ago
- Business Insider
What the protests against Jeff Bezos and Lauren Sánchez were really about
If you were in Venice last week and not on Jeff Bezos and Lauren Sánchez 's 200-person guest list, you may not have known the glamorous celebrations were going on. But that didn't stop local Venetians from protesting against the event. That's because the demonstrations weren't only about the third-richest man in the world. They were about pushing back against the idea of Venice as a theme park and playground for billionaires — rather than as a living city that's home to 50,000 people in the historic center who are fed up with the impacts of mass tourism. "He wanted to use Venice as a background," Tommaso Cacciari, a Venetian activist and a leader of the No Space for Bezos movement, told Business Insider of the billionaire Amazon founder. "We used him to speak about the real problems of Venice, and it worked, and we are very glad about it." The protests in Venice have made headlines around the world this month as the city, which welcomes 20 million visitors annually, prepared for private jets and megayachts to arrive, carrying A-listers like the Kardashian-Jenner clan and Bill Gates. In the weeks leading up to the wedding, protesters gathered in a Venetian town square and along the iconic Rialto Bridge, holding signs that read, among other slogans, "No space for Bezos" with an image of a rocket ship — a nod to his rocket company, Blue Origin. "Rumours of 'taking over' the city are entirely false and diametrically opposed to our goals and to reality," Lanza and Baucina, the event planner coordinating the wedding, said in a statement released earlier in June. "Before the recent news of protests arose, we had worked for there to be minimal negative impact or disruption to the lives of Venetians and the city's visitors." Protests continued during the wedding celebrations last week, with demonstrators gathering in Piazza San Marco. One protester scaled a pole in front of Saint Mark's Basilica before being carried off by police. While protesters made the Bezos-Sánchez wedding a focal point of their demonstrations, overtourism has been a prominent issue for Venetians for years. Activists in Italy have regularly staged anti-tourism protests, BI has previously reported, including targeted demonstrations against companies like Airbnb. The palpable frustration felt by locals over overcrowded streets, environmental damage, and rising living costs has dissuaded some tourists from returning to visit the city. Alan Fyall, the Visit Orlando endowed chair of tourism marketing at the University of Central Florida's Rosen College of Hospitality Management, told BI the Bezos-Sánchez wedding protests showed how fed up Venetians are with overtourism in general. Fyall said the number of wedding guests was not necessarily the problem. But given the persistent problems of overtourism and the high cost of living, locals "see it as a little bit crass." "The protesters said something like, 'This is feeding into the image of Venice as this tourism haven,'" Fyall said. "It all comes back to the bigger problem." Cacciari said the goal is not to do away with all tourism, especially since many Venetians rely on the income from foreign travelers, but that a better balance needed to be struck. "I don't like the slogan 'Tourists go home,' for example. No, tourists are welcome as long as there is a balance," Cacciari said. "But if the measure is broken, it's not the tourist's fault. It's the one who runs the city's fault." City officials had welcomed the wedding. "We are happy and honoured to welcome Jeff Bezos and his consort Lauren Sánchez," Mayor Luigi Brugnaro said, according to Reuters. In an attempt to dissuade mass travel, the city has implemented tourist taxes, charging day-trip visitors about $5 to enter the city center on certain days, and limited tour group numbers to a maximum of 25, as well as restricted the use of loudspeakers. They've also instituted restrictions on cruise ships. But despite those efforts, overtourism concerns have remained. Fyall said the persistent nature of the protests shows that the city has not yet fully addressed its residents' concerns. Until it does, we can expect to see more protests like the ones targeted at Bezos.
Yahoo
6 hours ago
- Yahoo
Fintech Bolt progresses its turnaround by landing Klarna as a partner
Klarna and Bolt announced a partnership Monday, which will see Klarna's payment options integrated into Bolt's checkout operating system. This deal means Klarna will show up a buy-now-pay-later choice on Bolt devices. Merchants using Bolt can offer Klarna's Pay in 4 or monthly financing options to shoppers in physical stores, and shoppers can choose that option with a single click. The integration is set to go live later this year, first in the US and then in other markets around the world. In a statement given to TechCrunch, Ryan Breslow, co-founder and CEO of Bolt, told us that the partnership was 'so much bigger than two companies working together.' 'It's a clear sign that commerce is moving in an entirely new direction,' he said, adding that this will not be another buy-now-pay-later option but, rather, 'an entirely new model that offers best-in-class, flexible customer experience with no new contracts or technical lift required.' Klarna, which has been waiting in the wings to go public since the spring, describes the partnership as a means to drive long-term loyalty for itself and merchants. 'By embedding Klarna into thousands of Bolt merchants, we're scaling our U.S. footprint and making Klarna available everywhere consumers shop,' a Klarna spokesperson said. This latest partnership is a big deal for Bolt for other reasons. The fintech has struggled in recent years with legal challenges and upset investors. In March, Bolt founder Breslow returned as CEO after having stepped down in early 2022. In August, Bolt was reportedly attempting to raise $450 million at a potential $14 billion valuation, But it was an oddball deal with strange terms, including a 'cramdown' threat to existing shareholders There have been no updates on that apparent deal but Bloomberg reported earlier this month that Breslow was once again looking to raise. This time, he's looking for at least $600 million, half of which would go to Bolt, while the other half would go to his other startup, Love. Breslow has said that Bolt has at least three years of runway left. Earlier this month, Bolt also announced a partnership with Palantir to launch an AI-powered personalized checkout that remembers the shopping habits of consumers. It wants to expand this checkout across its merchants and within Bolt's new SuperApp, a 'one-click crypto and everyday payments' app, as he described to us in an April interview. Adding two big names as partners, Klarna and Palantir, is the kind of step that could help clean up Bolt's reputation as it seeks to raise again. Sign in to access your portfolio
TechCrunch
6 hours ago
- TechCrunch
Fintech Bolt progresses its turnaround by landing Klarna as a partner
Klarna and Bolt announced a partnership Monday, which will see Klarna's payment options integrated into Bolt's checkout operating system. This deal means Klarna will show up a buy-now-pay-later choice on Bolt devices. Merchants using Bolt can offer Klarna's Pay in 4 or monthly financing options to shoppers in physical stores, and shoppers can choose that option with a single click. The integration is set to go live later this year, first in the US and then in other markets around the world. In a statement given to TechCrunch, Ryan Breslow, co-founder and CEO of Bolt, told us that the partnership was 'so much bigger than two companies working together.' 'It's a clear sign that commerce is moving in an entirely new direction,' he said, adding that this will not be another buy-now-pay-later option but, rather, 'an entirely new model that offers best-in-class, flexible customer experience with no new contracts or technical lift required.' Klarna, which has been waiting in the wings to go public since the spring, describes the partnership as a means to drive long-term loyalty for itself and merchants. 'By embedding Klarna into thousands of Bolt merchants, we're scaling our U.S. footprint and making Klarna available everywhere consumers shop,' a Klarna spokesperson said. This latest partnership is a big deal for Bolt for other reasons. The fintech has struggled in recent years with legal challenges and upset investors. In March, Bolt founder Breslow returned as CEO after having stepped down in early 2022. Techcrunch event Save $450 on your TechCrunch All Stage pass Build smarter. Scale faster. Connect deeper. Join visionaries from Precursor Ventures, NEA, Index Ventures, Underscore VC, and beyond for a day packed with strategies, workshops, and meaningful connections. Save $200+ on your TechCrunch All Stage pass Build smarter. Scale faster. Connect deeper. Join visionaries from Precursor Ventures, NEA, Index Ventures, Underscore VC, and beyond for a day packed with strategies, workshops, and meaningful connections. Boston, MA | REGISTER NOW In August, Bolt was reportedly attempting to raise $450 million at a potential $14 billion valuation, But it was an oddball deal with strange terms, including a 'cramdown' threat to existing shareholders There have been no updates on that apparent deal but Bloomberg reported earlier this month that Breslow was once again looking to raise. This time, he's looking for at least $600 million, half of which would go to Bolt, while the other half would go to his other startup, Love. Breslow has said that Bolt has at least three years of runway left. Earlier this month, Bolt also announced a partnership with Palantir to launch an AI-powered personalized checkout that remembers the shopping habits of consumers. It wants to expand this checkout across its merchants and within Bolt's new SuperApp, a 'one-click crypto and everyday payments' app, as he described to us in an April interview. Adding two big names as partners, Klarna and Palantir, is the kind of step that could help clean up Bolt's reputation as it seeks to raise again.
