HKVibeCode · Beginner · 12 min

Getting Started with Vibe Coding in 2026

A step-by-step start. No prior coding job is required, but you do need to test what the tool produces.

Pick a first tool

If you do not want to see code files, try a browser builder such as Lovable or Base44 and treat the result as a draft.

If you are willing to look at files, try Cursor or Windsurf.

If you already write code, GitHub Copilot inside your editor is enough to start.

The tools directory on this site lists products with a link to each vendor. Prices change, so check the vendor page.

A first app

  • Create a small React project, or open a browser builder.
  • Ask for a to-do list with add, complete, delete, and local storage.
  • Run it.
  • Ask for one extra feature at a time, such as due dates.

Mistakes that waste a day

  • "Make me an app" is too vague. Name the screens and the buttons.
  • Do not add five features before the first one runs.
  • Paste the error back to the tool instead of starting over.
  • Learn what a button, a form, and a database row are. The words make your prompts clearer.

A practical starter stack

Cursor or another AI editor, Supabase for data, Vercel for hosting, and Clerk or Supabase Auth for sign-in. This site uses that kind of stack. It is a suggestion, not a requirement.

Hong Kong

HKVibeCode lists courses, a knowledge base, and a hire form. Photos of community events are on the home page. There is no members-only chat linked from this site.

Key takeaways

  • Start with one tool and one small app.
  • Be specific, then add one feature at a time.
  • Check the live vendor page before you pay for a tool.
WhatsApp 傳個點子填寫簡短需求