Description
Get 10% Off Vide Coding: https://darrelwilson.com/vibe-coding
Use coupon code: darrel10
Learn how to use Hostinger AI Builder to create a professional website and a working web application without writing code. This complete Hostinger AI Builder tutorial for beginners covers AI prompting, website design, mobile optimization, domains, databases, user accounts, subscriptions, Stripe, PayPal and more.
Links And Resources:
Compress Images: https://pixelpress.site/
ChatGPT: https://chatgpt.com/
Design files: https://designmd.ai/ or https://getdesign.md/
Prompts Used
Website Prompts: https://chatgpt.com/share/6a9045bd-ea0c-83ec-a3a9-d8e949f31511
Image Compress App: https://chatgpt.com/share/6a90429d-7a24-83ec-bc2d-65b272f0477a
Hostinger AI Builder, previously known as Hostinger Horizons, lets you build websites and full web applications by describing what you want in normal language.
In this step-by-step tutorial, I’ll first show you how to create a professional business website. We’ll use ChatGPT to develop the design direction, generate website screenshots, create a color palette and prepare a detailed prompt for Hostinger AI Builder.
We’ll then take things further by building a functional image-compressor SaaS application. The finished app includes user registration, authentication, personal dashboards, cloud image storage, paid subscriptions, Stripe payments and PayPal.
By the end of this Hostinger AI Builder tutorial, you’ll know how to:
✅ Write better prompts for AI website builders
✅ How To Use The Hostinger Website Builder
✅ Learn how to make websites with the hostinger ai website builder
✅ Build a complete website without coding
✅ Customize text, images, colors and layouts
✅ Add pages, navigation and contact forms
✅ Optimize an AI-generated website for mobile devices
✅ Improve buttons, links and on-page SEO
✅ Connect and publish on a custom domain
✅ Build a functional web application
✅ Add user accounts and authentication
✅ Create free and paid membership plans
✅ Store customer data and uploaded images
✅ Connect Stripe and PayPal
✅ Test, debug and publish your application
CHAPTERS
00:00 What We’re Building
00:45 What Is Vibe Coding?
02:02 Websites vs. Web Applications
03:00 Hostinger Horizons Is Now Hostinger AI Builder
03:24 Hostinger AI Builder Plans and Setup
05:37 Hostinger Dashboard and AI Builder Interface
06:39 How to Prompt AI Correctly
09:20 Generate Website Designs With ChatGPT
11:05 Choose Your Website Design
12:00 Create a Color Palette and Design System
14:45 Generate High-Quality Website Images
15:31 Create the Complete AI Builder Prompt
16:43 Build the Website With Hostinger AI
20:04 Hostinger AI Builder Editor Tutorial
23:10 Customize Website Elements With AI
24:00 Add Custom Website Sections
25:15 Optimize the Website for Mobile
26:32 Add Pages, Navigation and a Contact Form
30:07 SEO, Working Buttons and Final Website Polish
32:57 Connect a Custom Domain
33:52 Build a Working Web Application
35:18 Manual Mode vs. Agentic Mode
36:00 Create the Web App Prompt
38:02 Build an Image Compressor App
40:54 Add User Accounts and Authentication
43:31 Add Subscriptions and Ecommerce
44:10 Hostinger Ecommerce Dashboard
46:55 Add Cloud Image Storage
49:29 Test, Debug and Polish the App
50:02 Connect Stripe and PayPal
52:30 Test the Complete Checkout
53:15 Confirm the Subscription Payment
53:39 Final Results and Vibe Coding Advice
If you have any questions about Hostinger AI Builder, vibe coding or building your first AI application, leave a comment below.
Subscribe for more tutorials about WordPress, AI website builders, web design and building applications without code.
DISCLOSURE
Some links in this description are affiliate links. If you purchase through one of these links, I may receive a commission at no additional cost to you. I only recommend tools and services that I believe will provide value to my audience.
🎬 Check out our new Clips channel!
We’re sharing shorter clips from our tutorials, tips, and best moments. Subscribe so you don’t miss them 👇
https://www.youtube.com/channel/UCIIqVMy3Ro-A19DdtaJN62A
#Hostinger #HostingerAIBuilder #VibeCoding
