Skip to main content

Playbook

Build & Launch Your Professional Website

The complete AI-powered, zero-experience-required playbook for building and publishing with GitHub and Netlify.

Pair these steps with conversion-tested copy from the AI Prompting Lab to generate headlines, CTAs, and FAQs that fit your new site.

Pre-Flight Checklist

Before you start, gather these items to ensure a smooth process. Missing any of these will slow you down later.

Required Information Checklist:

  • Business/Personal Name (exactly as you want it displayed - write it down now)
  • Your Professional Email (the one you check regularly - for domain registration)
  • A List of 2-3 Main Services You Offer (be specific: "Social Media Management for Restaurants" not just "Marketing")
  • Target Audience Description (one sentence: "couples in Chicago planning weddings")
  • Professional Headshot (high-resolution, well-lit photo of yourself)
  • Pen and paper for writing down login credentials (this is critical!)

Step 1: Create Accounts & Buy Domain (20 minutes)

A. Create Your Accounts (15 minutes)

B. Buy Your Domain (5 minutes)

Go to a registrar like Namecheap or GoDaddy and purchase your domain. Uncheck all add-ons except for free WhoisGuard privacy protection.

Step 2: Set Up Your Digital Workspace (10 minutes)

Create a main folder named My_Website_Project on your desktop. Inside, create two subfolders: Images and Content. In the Content folder, create a text file named website_info.txt and fill it out with your business details, services, content, and account usernames.

Step 3: Design Your Logo in Canva (20 minutes)

Use Canva to create a simple, professional logo. Search for "logo" templates, customize with your brand name and colors, and download it as a PNG with a transparent background. Save it as logo.png in your Images folder. Helpful reference: Designing a Logo in Canva

Step 4: Write Your Content & Collect Images (15 minutes)

Complete your website_info.txt file. Save your headshot as headshot.jpg in the Images folder. Compress any large images using TinyPNG.

Step 5: Generate Your Contact Form Code (10 min)

In JotForm, create a new "Classic Form" with Name, Email, and Message fields. Test it using the preview, then go to Publish → Embed and copy the full embed code. Helpful reference: How to Embed Your Form

Step 6: Build Your Website with AI (60+ minutes)

Provide Gemini with your prepared content, logo, images, and JotForm embed code using a detailed prompt. Iterate on the design until you are happy with the preview.

Step 7: Test Everything Locally (15 minutes)

Save the final code as index.html in a new folder called my-final-website, along with all your images. Open the file in your browser to test all links, buttons, and the contact form. Check for responsiveness by resizing your browser window.

Step 8: Upload to GitHub & Publish with Netlify (20 minutes)

Create a new public repository on GitHub and upload all files from your my-final-website folder. In Netlify, choose Add new site → Import an existing project, connect the GitHub repository, leave the build command blank for a simple static site, and set the publish directory to the repository root. Netlify will give you a preview URL immediately. Helpful reference: Add a new Netlify site

Step 9: Connect Your Custom Domain (25 minutes)

In Netlify, open Domain management, add your custom domain, and follow Netlify's DNS instructions. The simplest path is to point your domain's nameservers to Netlify DNS so Netlify can manage the records and HTTPS certificate for you. Helpful reference: Add a custom domain

Step 10: Final Quality Check

Verify all functionality on the live site, including form submissions and mobile responsiveness.

Step 11: Cost Recap

Expect a low-cost setup: a domain name, any optional AI tool subscription used while building, a free GitHub repository, and Netlify's free tier for a simple static website. Most small sites can launch for under $50 before optional upgrades.