How to build a directory or listings site for free

Build it with

The stack

Every pick has a free plan you can launch a business on, unless it says otherwise. Free tiers checked 2026-10-27.

UI kit and libraries

AI skills and MCP servers

Guides and connections that make your AI builder produce better code.

• Lovable: Prompting best practicesService

  Plan the product and key user action first, build UI one component at a time, use real copy and style keywords, ask questions in Plan mode.

• Bolt: Prompt effectivelyService

  Plan the app and first prompt, use Enhance prompt, and make small one-at-a-time changes.

• v0: How to prompt v0 + Vibecoding GuideService

  Describe the product surface, context of use, and constraints and taste (2025-12-15); the Academy guide adds patterns and starter prompts.

• AGENTS.mdMIT

  Open 'README for agents’ format stewarded by the Agentic AI Foundation (Linux Foundation); used by 60k+ open-source projects.

  Add an AGENTS.md file at the repository root

The plan

1. 1

   Write down the plan

   30 minutes
   • Name the people who use it and the one job it does for them.
   • List the screens: Listing pages and category pages, built as static pages for search engines; Search and filters; A submission form with review before anything is published.
   • Sketch them on paper or in Excalidraw. Rough is fine.
   • Download this kit as AGENTS.md and keep it in your project: it’s the brief your AI tool reads first.
2. 2

   Set up the foundation

   Day 1
   • Start a new Lovable project and paste the prompt below.
   • Connect Supabase from Lovable’s integrations, then turn on email and Google login.
   • Publish it and open it on your phone to check it works.
   • Connect the project to GitHub so you own the code.
   Prompt for Lovable

   Build a directory or listings site: a directory or listings site (a directory of AI tools)
   The main screens: Listing pages and category pages, built as static pages for search engines; Search and filters; A submission form with review before anything is published.
   Use Supabase for the database and login (email and Google). Turn on row-level security on every table so people only see their own data.
   Use shadcn/ui components, a clean light design, and make every screen work on a phone.
   Don’t add payments yet. Start with sample data so I can click through it.

3. 3

   Build the core

   Days 2–7
   • Listing pages and category pages, built as static pages for search engines
   • Search and filters
   • A submission form with review before anything is published
   • Paid featured spots or sponsorships
   • A sitemap and structured data for Google
   Prompt for Lovable

   Now build these, one at a time, and let me test each before the next:
   1. Listing pages and category pages, built as static pages for search engines
   2. Search and filters
   3. A submission form with review before anything is published
   4. Paid featured spots or sponsorships
   5. A sitemap and structured data for Google
   Add search with Postgres full-text search.

4. 4

   Take payments and send emails

   Week 2
   • Add Stripe checkout.
   • Mark orders as paid only from the payment webhook, never from the browser.
   • Send emails through Resend, and add its DNS records (SPF and DKIM) so they don’t land in spam.
   Prompt for Lovable

   Add payments with Stripe. Use test mode first.
   Create a webhook handler on the server that verifies the signature and marks orders paid; never trust the browser for this.
   Send receipts and account emails with Resend from a server function.

5. 5

   Get it ready to launch

   Week 2–3
   • Add PostHog and track the one action that means it’s working (a booking, a sale, a sign-up).
   • Add Sentry so errors reach you before users complain.
   • Go through the launch checklist below.
   • Add a privacy policy and terms, then connect your own domain.
   • Show it to ten people who have the problem, and watch them use it.
   Prompt for Lovable

   Review the whole app for security and launch problems before I go live:
   - every table has row-level security (or server-side checks) and I can’t read another user’s data,
   - no secret keys in the browser bundle or the repo,
   - inputs are validated on the server, and sign-up, login and forms are rate-limited,
   - error pages and empty states exist for every screen,
   - it works on a phone and with the keyboard.
   List what you find, fix the serious ones, and tell me what’s left.

Before you launch

• Row-level security (or server checks) on every Supabase table, tested with two accounts.
• No secret keys in browser code or in git. Rotate any that leaked.
• Server-side validation for every form, plus rate limits on sign-up and login.
• Payments confirmed by webhook only, and tested end to end in test mode.
• Your sending domain verified (SPF, DKIM), so emails reach the inbox.
• Backups: know how to restore your data (free database plans often have none).
• Privacy policy, terms, and a way for people to contact you.
• Error alerts on, and an uptime check on the home page.
• Tested on a phone, with a keyboard only, and with a slow connection.

Risks to plan for

• Thin pages don't rank: give each listing real details, photos or reviews.
• Keeping data fresh is the real work: plan a monthly review.