Buy your domain. Vercel hosts it for free.

The URL you share is part of the first impression. yourusername.github.io/my-project tells people you are experimenting. yourproject.com tells them this is real. Not long ago, getting to that second URL meant paying for hosting every month on top of the domain. Vercel changed that. Your domain costs around ten dollars a year. Hosting is free. By the end of this SOP, you will have both.

what you will use

A domain registrar

A domain registrar is where you buy and manage your domain name. Good options are Namecheap, Porkbun, and Cloudflare. A .com domain costs between $8 and $15 per year. Pick whichever you prefer. The process is the same on all of them.
Vercel

Vercel is a hosting platform that connects directly to your GitHub repository. Every time you save a change to GitHub, your site updates on its own. No extra steps. Think of it as GitHub Pages but with more room to grow. The free plan covers everything you need.

the steps

Buy your domain

Go to Namecheap, Porkbun, or Cloudflare. Search for the domain name you want. If the .com is taken, try .co or .io. Both work just as well. Add it to your cart and complete the purchase. You now own a domain name. Next you will point it to your project.

Create a Vercel account

Go to vercel.com and create a free account. When it asks how you want to sign in, choose GitHub. That connection is what lets Vercel find your project and publish it for you. The free plan is more than enough for everything in this course.

Import your GitHub repository

From the Vercel dashboard, click Add New, then Project. You will see a list of your GitHub projects. Find the one with your website and click Import. Vercel figures out the rest automatically. Click Deploy.

Check your Vercel URL

After about a minute, Vercel gives you a URL that looks like your-project.vercel.app. Open it and confirm your site is there. From now on, every time you push a change to GitHub, Vercel updates your live site automatically. No more manual uploads.

Add your domain to Vercel

In your Vercel project, go to Settings, then Domains. Type your domain name and click Add. Vercel will show you a list of records to add. These are DNS records. DNS is the system that connects a domain name to a website. Think of it as the internet's address book: when someone types yourproject.com, DNS is what tells the internet where to find it. Keep this page open. You will need these records in the next step.

Update your DNS settings

Go to your domain registrar and open the DNS settings. Paste the records Vercel showed you in the previous step, usually an A record, which points your domain to Vercel's servers, and a CNAME record, which handles the www version. Copy the values exactly as Vercel gives them to you. Do not type them manually. Save the changes.

Wait for your domain to go live

DNS changes take time to reach every corner of the internet. It can be as fast as 15 minutes or as long as 24 hours. Vercel will show a green checkmark next to your domain once everything is connected. Test it from an incognito tab. The padlock you see in the browser, which tells visitors the connection is secure, is handled automatically by Vercel.

if something does not look right

DNS is the step that takes the most patience. It is not difficult. It just takes time.

The domain is not loading yet

This is almost always DNS propagation. It can take up to 24 hours. Wait and try again in an incognito tab. Do not keep changing the settings. Every time you do, the clock resets.
Vercel shows an error on your domain

Go back to Vercel's Domains settings and compare the DNS records it asks for against what you entered at your registrar. A single typo will break it. Copy and paste the values, do not type them manually.
HTTPS is not working

Vercel handles HTTPS automatically, but it needs the domain to be fully connected first. Once the green checkmark appears next to your domain in Vercel, HTTPS will activate on its own within a few minutes.

That is your project with a real address on the internet. A domain that is yours. For Marta's website, the domain would be something like www.martafotografia.com. That is the kind of URL that makes her photography business feel real and professional. Since Marta is a fictional character we created for this course, I am not going to buy that domain. We will keep using the GitHub Pages URL for the rest of the examples. But when you do this for your own project, the domain is the step that makes it feel like yours.

Your task this week SOP 04

Give your project its own domain.

Buy a domain, create a Vercel account, connect your GitHub repository, and point your domain to Vercel. Test it from an incognito tab before calling it done.

When done Your website live at yourname.com. Secure connection. Updates on its own every time you make a change.

Next — SOP 05

Add a booking form with Supabase

Your project is live. Now give it memory. Let people leave their information and actually store it somewhere.

Next week