Alchemy RecipeBeginnerguide

Building Landing Pages and Websites Without a Developer: Free and Cheap Options

Published

Building a website used to require either hiring a developer or learning to code yourself, both of which could drain your budget and time. If you're launching a startup, portfolio, or small business, you likely don't have thousands to spend on custom development. The good news is that AI-powered website builders have matured significantly, and there are now solid free and affordable options that genuinely work without requiring any coding knowledge....... For more on this, see Tracking AI Coding Costs: A Guide for Development Teams U....

This guide covers three tools that stand out for different use cases: Dora AI for visually stunning, interactive designs; V0 for rapid prototyping with modern components; and Your Next Store AI for e-commerce sites specifically. All three can get you from zero to live website in hours rather than weeks, and they integrate well with your existing tools. You'll learn how to choose the right tool for your needs, set up your first project, and avoid the common mistakes that waste time and money.

By the end of this guide, you'll understand the strengths and limitations of each platform, know which one suits your project, and have a working website you can iterate on without touching a terminal.

What You'll Need

Before you start, gather these items. None of them cost money to set up initially.

Accounts and access:

  • A free GitHub account (required for V0 and helpful for all three).

  • A free account with each platform you're using.

  • Basic email access for password resets and confirmations.

Technical requirements:

  • A modern web browser, Chrome or Firefox recommended.

  • A domain name, either existing or one you plan to register later (Namecheap or Google Domains cost around £8-12 per year).

  • An optional but useful: a Vercel account for hosting (free tier includes generous bandwidth).

Budget expectations:

  • Free tier: You can launch a complete site on £0 if you're comfortable with basic features and some platform branding.

  • Beginner plan: £20-50 per month across all tools if you want custom domains and remove their branding.

  • E-commerce specific: Budget £30-80 per month if you're selling products, as payment processing adds costs.

You don't need Photoshop, design experience, or any programming knowledge. All the heavy lifting happens inside each platform's editor.

Step-by-Step Setup

This section walks through getting a working website live with each tool. Start with the one that matches your project type, or follow all three if you're comparing them.

Setting Up with Dora AI

Dora AI specialises in visually polished, animated websites. It's best for portfolios, marketing sites, and brands where aesthetics matter....... For more on this, see From Script to Polished Video: Using AI for Demo and Mark....

Step 1: Create your project

  1. Visit dora.run and sign up with your email or GitHub account.
  2. Click "Create New Project."
  3. Choose a starting template or begin blank. Templates include: Portfolio, Agency, Product Launch, and SaaS Landing Page.
  4. Name your project something descriptive like "My Portfolio 2025."

Step 2: Understand the editor layout

The Dora editor has three main sections on screen: a left sidebar with components and layers, a central canvas where you design, and a right panel for properties and settings.

Components in Dora include buttons, text, images, cards, forms, and animations. You drag these onto the canvas and position them. Each element can have animations applied, such as fade-in on scroll, hover effects, or entrance sequences.

Step 3: Build your first section

Start with the hero section, which is the top visible area of your site. This is what visitors see immediately.

  1. Drag a "Hero" component or a container onto the canvas.
  2. Add a headline text block. Type your main message, for example: "I'm a Product Designer Based in London."
  3. Add a subheading beneath it.
  4. Add a call-to-action button. Set its text to something like "View My Work" or "Get in Touch."
  5. Add a background image or colour. Click the element, go to the Design tab on the right, and choose Background.

Step 4: Add animations

This is where Dora stands out. Select any element and go to the Interactions tab.

  1. Click "Add Animation."
  2. Choose a trigger: On Load, On Scroll, or On Hover.
  3. Select an animation type: Fade In, Slide Up, Scale Up, or custom motion.
  4. Set duration and delay.

For example, set your headline to fade in on load with a 0.5-second delay, then the button slides up half a second later. This creates polish without complexity.

Step 5: Add more sections

Duplicate your hero section or create new containers for:

  • About section with text and an image.

  • Portfolio or services grid (use the Grid component).

  • Contact form (Dora provides a form component that emails submissions to you).

  • Footer with links and social icons.

Step 6: Connect a domain and publish

  1. In settings, go to "Domain."
  2. Either use Dora's free subdomain (yourname.dora.run) or connect your own domain via nameserver settings.
  3. Click "Publish."

Your site is live within minutes. You can update it any time by editing and republishing.

Setting Up with V0

V0 is Vercel's AI website builder. It's best for rapid prototyping and building component-based sites. If you want something functional and modern quickly, V0 excels.

Step 1: Access V0

  1. Go to v0.dev and sign in with your GitHub account (required).
  2. Click "Create New."
  3. Describe what you want to build in plain English. For example: "A landing page for a fitness coaching service with a hero section, three service cards, and a contact form."

V0 then generates a complete page based on your description. This saves significant time compared to building from scratch.

Step 2: Review and refine the generated code

V0 shows you the live preview on the left and the code (React/Next.js components) on the right. The preview updates as you edit.

Don't be intimidated by the code. You don't need to write it. Instead:

  1. Click on elements in the preview to select them.
  2. Use the right sidebar to change text, colours, and spacing without touching code.
  3. If you want to modify something the sidebar doesn't cover, edit the code directly. V0 updates the preview instantly.

Step 3: Customise colours and branding

  1. Look for colour definitions at the top of the code block. They typically look like:

const colors = {
  primary: '#3B82F6',
  secondary: '#10B981',
  background: '#FFFFFF'
}
  1. Change these hex codes to your brand colours. Use a colour picker tool online if you don't know your hex codes.
  2. The preview updates immediately, showing your new colours throughout.

Step 4: Edit text and content

All text on the page is editable. Either:

  • Use the sidebar to change it visually, or
  • Find the text in the code and edit it directly.

For example, change "Fitness Coaching for Busy Professionals" to your actual headline.

Step 5: Add pages and navigation

V0 projects can have multiple pages. To add a new page:

  1. Click the "+" icon in the pages panel (left side).
  2. Describe the new page, for example: "About page with team member profiles."
  3. V0 generates it based on your description.

Set up basic navigation by adding links in your header or menu. V0's generated pages include navigation hooks you can update.

Step 6: Deploy to Vercel

  1. In V0, click "Deploy."
  2. Choose "Deploy to Vercel."
  3. You'll be taken to Vercel's setup. Select "Create new project."
  4. Vercel automatically builds and deploys your site.
  5. You get a free URL like my-site-xyz123.vercel.app.

To use your own domain:

  1. In Vercel project settings, go to "Domains."
  2. Enter your domain name.
  3. Vercel provides nameserver instructions. Update these at your domain registrar (GoDaddy, Namecheap, etc.).
  4. Wait 24 hours for DNS to propagate.

Your site is now live and updates automatically whenever you change the code in V0.

Setting Up with Your Next Store AI

Your Next Store AI focuses on e-commerce. Use it if you're selling physical or digital products.

Step 1: Create a store

  1. Go to yournextstore.ai and click "Start Free."
  2. Enter your email and create a password.
  3. Name your store. This becomes part of your free subdomain, for example: myshop.yournextstore.ai.

Step 2: Add products

  1. Go to "Products" in the left menu.

  2. Click "Add Product."

  3. Fill in:

    • Product name
    • Description
    • Price
    • Product image (upload from your computer)
    • Product category
  4. Click "Save."

Repeat for each product you want to sell. You can add as many as you want on the free plan.

Step 3: Customise your storefront

  1. Go to "Design" or "Storefront Settings."
  2. Upload a logo and banner image.
  3. Choose a colour scheme from presets or set custom colours.
  4. Add store name and description.
  5. Configure basic information: address, phone, email.

Your Next Store AI's interface is simpler than Dora or V0 because it handles the backend automatically. You focus on products and branding, not layout.

Step 4: Set up payment processing

  1. Go to "Payments" or "Billing."
  2. Choose your payment provider: Stripe or PayPal.
  3. Sign up for a Stripe account (free to create, you pay per transaction) or link your PayPal account.
  4. Your Next Store AI will guide you through verification.

Once live, customers see a checkout button on each product. Your Next Store AI handles the payment process and deposits funds to your Stripe or PayPal account, minus their percentage (typically 2.9% + £0.30 per transaction for Stripe).

Step 5: Connect a custom domain

  1. Go to "Settings" and find "Domain."
  2. Enter your domain name.
  3. Follow the nameserver instructions to point your domain to Your Next Store AI.

Step 6: Launch

Click "Publish" or "Go Live." Your store is now accepting orders.

Tips and Pitfalls

These lessons come from real experience building sites with these tools.

Mobile responsiveness matters immediately:

All three tools generate mobile-friendly sites by default, but you should still preview on actual phones. Use your browser's developer tools (right-click, then Inspect) to view how your site looks on different screen sizes. If something looks broken on mobile, fix it before launching. A site that looks great on desktop but broken on phones drives visitors away.

Test forms before publicising:

If your site has a contact form or signup, send yourself a test submission before launching. Verify the email arrives in your inbox. With Dora, check that email notifications are enabled in settings. With V0 and Your Next Store AI, confirm that payment or form submissions actually process.

Avoid over-animation:

Animations are tempting in Dora AI, but too many slow down your site and annoy visitors. Limit animations to key elements: your hero section, call-to-action buttons, and section transitions. Let the content breathe.

Don't over-complicate navigation:

Keep your main menu to five items or fewer. Visitors should understand your site's structure in seconds. Each navigation item should lead somewhere; avoid dummy links. If you're unsure whether to include something, leave it out initially and add it later.

Version control with V0:

V0 saves versions automatically, but take screenshots or notes before major changes. If you break something, you can roll back, but it's easier to remember what you changed if you document it.

E-commerce requires payment account setup:

With Your Next Store AI, you can't accept payments until you've verified your Stripe or PayPal account. This takes 24 to 48 hours. Don't launch your store expecting sales immediately; allow time for payment verification.

Domain DNS changes take time:

When you point a custom domain to any of these platforms, DNS changes propagate globally over 24 hours. Your site might be live on the old host for a while. If you're migrating an existing domain, expect a brief period where the old site still appears for some visitors. Plan your launch during a low-traffic window if possible.

Free plans have limits:

Free tiers are genuinely functional, but they include platform branding and limited customisation. If branding matters for your business, budget for a paid plan.

Cost Breakdown

ToolPlanMonthly CostNotes
Dora AIFree£0Dora branding on site, basic features, 1 project
Dora AIStarter£19Remove branding, custom domain, 3 projects, analytics
Dora AIProfessional£49Advanced features, team collaboration, 10 projects
V0Free£0Free Vercel hosting, code-based editing, GitHub required
V0Vercel Pro£20Unlimited projects, priority support, advanced analytics
Your Next Store AIFree£0Subdomain only, product limit (typically 50), platform fees apply on sales
Your Next Store AIStarter£19Custom domain, 200 products, enhanced support
Your Next Store AIProfessional£49Unlimited products, advanced analytics, email marketing tools
Domain RegistrationAnnual£8-15Most registrars; varies by domain extension
SSL CertificateIncluded£0All platforms include free SSL; HTTPS is standard

Notes on payment processing costs: With Your Next Store AI, you pay transaction fees to Stripe (2.9% + £0.30) or PayPal (3.49% + £0.30) on top of the monthly plan. On a £50 sale, you'd pay roughly £2 to Stripe, so you'd receive £47.70 net.

Summary

Building a professional website without a developer is now genuinely feasible. Dora AI excels for design-heavy sites and portfolios, V0 suits rapid prototyping and modern web applications, and Your Next Store AI is purpose-built for selling products. Choose based on your project type, start with the free tier to test, and upgrade only if you need custom domains or want to remove platform branding. The barrier to launching online has dropped dramatically; the real challenge now is deciding which tool fits your vision.

More Recipes