Deploying a Website on Vercel: GitHub, Custom Domains, DNS, and HTTPS

C

Chaitz

Guest
This step-by-step guide walks you through deploying a website on Vercel, connecting a custom domain, configuring DNS records, changing the domain on an existing project, and securing your site with SSL.

Whether you want to deploy, publish, or host your website on Vercel, this guide covers the entire process from buying a domain to going live — with real screenshots from Cyvora Studio.

What You'll Learn​

  • How to create a GitHub repository for your website
  • How to deploy your website using Vercel
  • How to connect a custom domain (including GoDaddy step-by-step)
  • How to change the custom domain on an existing Vercel project
  • How DNS records work and how to configure them
  • How to use Vercel nameservers as an alternative to A/CNAME records
  • How to enable SSL and secure your website
  • Common deployment issues and troubleshooting tips

If you're a developer, blogger, or someone building a personal brand, launching your own website is more than just a technical task — it's a milestone. It's that moment when your ideas move from local files on your laptop… to something the entire world can access.

In this guide, I'll take you through my end-to-end journey of deploying a website using GitHub, Vercel, and a custom domain. This isn't just about clicking buttons — it's about understanding the complete flow.

By the end, you'll have a clear, practical roadmap to launch your own website confidently and professionally.

Choosing a Custom Domain​


Before touching any technical tools or the hard coding part lets cool our heads to come up with a name shall we, because coming up with a name for the website is a big task compared to the technical aspects.

When I started choosing a domain name, I researched so much to come up with this abstract name called "CYVORA" — I almost spent 2 hours on it. The catchy names I came up with were either taken, and I've noticed that even the most abstract domains get bought quickly. My quick suggestion: if you have an idea, implement it and buy that domain name immediately.

This is your identity on the internet, so choose wisely. Here are some tips for choosing a great domain name:

SEO Insight​


Choose a unique, low-competition domain name to help your website rank faster in search results. Avoid overly generic names that might be hard to differentiate.

🛒 Buying a Domain​


Once you've chosen a domain name, the next step is to buy it. Popular registrars include:

  • GoDaddy — popular and widely supported (I also bought my domain here)
  • Namecheap — affordable and beginner-friendly
  • Google Domains — simple interface, integrated with Google
  • AWS Route 53 — for advanced users

Did you know? You can also buy a domain directly through Vercel at vercel.com/domains. Domains purchased through Vercel are automatically connected to your project — no manual DNS configuration required. This is the easiest option if you haven't bought a domain yet and want the simplest possible setup.

After purchase, your domain will show an IDLE status, which means it's registered but not yet connected to any hosting. No need to worry — that will change once we connect it to Vercel.

Setting Up GitHub​

Think of GitHub as your source of truth.​


It stores your website's code, tracks changes, and integrates seamlessly with Vercel for automatic deployment.

  • index.html — Main page
  • styles.css — Styling
  • script.js — Functionality
  • README.md — Documentation

GitHub serves as your version-controlled source of truth, allowing you to track changes, collaborate, and easily deploy your site.

To set up your GitHub repository, you need a GitHub account. If you don't have one, sign up here: Sign up for GitHub

Now create a new repository for your project:

  • Go to GitHub and click "New Repository"
  • Name your repository (e.g., "my-website")
  • Choose Public or Private
  • Initialize with a README (optional)

GitHub Repository Creation screenshot



Pro Tip: If you're new to GitHub, initializing with a README can help you get started faster — it creates the first commit for you! Stuck? Check this documentation: GitHub Repository Creation Guide


It's recommended to use an IDE (Integrated Development Environment) — I personally recommend Visual Studio Code due to its vast library of extensions and GitHub Copilot integration.

Here's a simple file structure for a basic website:

Code:
my-website/
├── index.html
├── styles.css
├── script.js
└── README.md
  • index.html — The main HTML file that serves as the entry point of your website.
  • styles.css — A CSS file to style your website and make it visually appealing.
  • script.js — A JavaScript file to add interactivity and functionality.
  • README.md — A markdown file to document your project.

After creating the repository, clone it to your local machine:

Code:
git clone https://github.com/username/my-website.git
cd my-website

Then push your local website code to GitHub:

Code:
git init
git add .
git commit -m "Initial commit: website setup"
git push origin main
  • Vercel makes deployment incredibly simple:
  • Sign in to Vercel using your GitHub account. Once signed in, follow these steps to deploy your website:
  • Within seconds, your site is live at project-name.vercel.app. That's the power of modern deployment platforms!
  • Your site now has a default Vercel domain, making it accessible worldwide while you set up your custom domain. See the Vercel documentation for more details.
  • Connecting a custom URL (your own domain name) to Vercel is completely free on Vercel's Hobby plan. You only pay for the domain itself at your registrar.
  • To add your custom domain to your Vercel project:
  • Initially, you'll see "Invalid Configuration" status. This is normal and expected before DNS is configured in your registrar.

Change the Custom Domain for an Existing Vercel Website​


If your website is already deployed, you can connect a new domain to the same Vercel project without redeploying the site. Keep the existing domain connected while you set up and verify the replacement.

Step 1: Add the New Domain in Vercel​


import-nxsd9taahdlydwtjykm2hay0


Open the Domains settings for the Vercel project that serves your existing website.

  1. Open the Vercel Dashboard and select the project that serves your existing website.
  2. Open Settings → Domains and choose Add Domain.
  3. Enter the new apex domain (for example, example.com) or subdomain (for example, www.example.com), then add it to the project.
  4. If Vercel shows Invalid Configuration, leave the domain in the project and continue with its DNS instructions. This status is expected until the DNS records are updated and verified.

import-x945smfd54q1n0ws34a4q3ln


Enter the new domain in the project's Add Domain flow.

import-dbh8eimupb57lclqu7qjc1vn


After adding the domain, Vercel lists it in the project's domain settings.

Step 2: Copy the DNS Values Vercel Displays​


On the project's Settings → Domains page, open the new domain's configuration instructions. Copy the exact record type, host/name, and value Vercel displays for your project. These values can vary, so use the dashboard rather than a copied example.

import-falbfemvpaboaygvcgfko8hx


When Vercel reports a configuration issue, use the displayed DNS record details to update your registrar.

Step 3: Update DNS at Your Domain Registrar​


Sign in to the company where you manage DNS (such as GoDaddy, Namecheap, Name.com, or Cloudflare) and open DNS Management or Advanced DNS. Add or update the record using Vercel's displayed values:

  • For an apex/root domain such as example.com, Vercel may request an A record.
  • For a subdomain such as www.example.com or app.example.com, Vercel may request a CNAME record.

Remove conflicting records for the same host if the registrar or Vercel identifies them, but keep unrelated DNS records such as email records intact. Save your changes, then return to Vercel and wait for the domain to show as configured. DNS updates may take time to propagate.

import-pzyhaxfkm7pczqemgqkumsgo


Add the CNAME record at your registrar using the host and target shown in Vercel.

Step 4: Make the New Domain Primary​


Once the new domain is verified, use its options in Settings → Domains to set it as the project's primary domain, or configure a redirect from the old domain to the new one. Test the new address over HTTPS and confirm that the expected production deployment loads.

Step 5: Retire the Old Domain (Optional)​


Keep the old domain connected if you want it to redirect visitors to the new address. If you no longer need it, remove it from the project only after the new domain is working and any desired redirect has been configured.

DNS Configuration (Critical Step)​


To make your domain work with Vercel, update DNS at your registrar using the record type, name, and value displayed in the domain's Vercel project settings. There are two methods — A/CNAME records or nameserver delegation.

Method 1: A Record and CNAME Record​

A Record (Root Domain)​


Field

Value

Type

A

Name

@

Value

Use the A-record value shown in Vercel

CNAME Record (www subdomain)​


Field

Value

Type

CNAME

Name

www

Value

Use the CNAME value shown in Vercel

import-vrmd9iaewrqx2dg4403zrrzi


Example DNS settings panel. Use the current record values displayed in your Vercel project.

What These Records Do​


These DNS records tell the internet to route your domain to Vercel's servers. Without them, your domain won't know where to find your website.

Step-by-Step: Connect GoDaddy Domain to Vercel​

  1. Log in to GoDaddy and go to My Products → Domains
  2. Click the DNS button next to your domain
  3. Under DNS Records, add or update the A or CNAME record with the exact host and target shown in your Vercel domain settings
  4. Save the changes and return to your Vercel dashboard
  5. Vercel will detect the records and the domain status will change to Valid — usually within a few minutes, but can take up to 48 hours

Using Namecheap? The steps are similar — go to Advanced DNS in your Namecheap domain dashboard and enter the A or CNAME details shown by Vercel. The field names may differ slightly (e.g., "Host" instead of "Name").

Alternative: Use Vercel Nameservers​


Instead of adding individual A and CNAME records, you can delegate your entire domain to Vercel's nameservers. This gives Vercel full control over your DNS and is the recommended approach if you bought your domain through Vercel.

Vercel Nameserver Values​


If you choose nameserver delegation, use the nameservers Vercel currently displays for your domain and follow its setup instructions. Do not replace existing nameservers until you understand which DNS records (such as email) need to be recreated.


Nameserver

Use the nameserver shown in Vercel

Use the other nameserver shown in Vercel

How to Update Nameservers in GoDaddy​

  1. Log in to GoDaddy → My Products → Domains
  2. Click Manage on your domain
  3. Scroll to Nameservers and click Change
  4. Select Enter my own nameservers
  5. Enter the nameserver values Vercel displays for your domain
  6. Save — propagation takes 1–48 hours

A/CNAME vs. Nameservers — Which to Use?​


Use A/CNAME records if you need to keep other DNS records (email, subdomains) managed at GoDaddy. Use Vercel nameservers if you want the simplest possible setup and are moving everything to Vercel. Domains purchased through Vercel use nameserver delegation automatically.

  • Good news: Vercel automatically provisions an SSL certificate for your domain using Let's Encrypt — at no cost and with no configuration required.
  • Once DNS propagation completes, your site will be secured with:
  • Vercel handles the entire HTTPS setup automatically. You don't need to install anything or pay for a certificate separately.

Troubleshooting Common Issues​

Domain Still Shows "Invalid Configuration"​


This means DNS changes haven't propagated yet. DNS propagation can take 5 minutes to 24–48 hours. Check that your DNS records are correctly entered in your registrar's dashboard and wait.

Domain Redirects to Wrong Site​


Ensure you're using the correct A and CNAME records provided by Vercel. Typos in DNS values are the most common cause. Double-check the IP address and CNAME value character by character.

HTTPS Not Working​


Wait for DNS propagation to complete, then refresh. Vercel needs to verify DNS ownership before issuing the SSL certificate. If it still doesn't work after 48 hours, remove and re-add the domain in Vercel settings.

www and non-www Both Working?​


This is actually fine — both work. You can set a redirect from one to the other in Vercel's Domain settings if you prefer a canonical URL.

GoDaddy Nameservers Not Updating​


After changing nameservers in GoDaddy, it can take up to 48 hours to propagate globally. You can check propagation status at dnschecker.org.

Next Steps​


Congratulations on deploying your website! Here are recommended next steps:

  • Set up Analytics — Use Vercel Analytics or Google Analytics to track visitors
  • Configure Environment Variables — For API keys and sensitive data
  • Enable Auto-deployments — Deploy automatically on every GitHub push
  • Set up Email — Add contact forms and email forwarding
  • Optimize Performance — Use Vercel's built-in performance tools
  • SEO Optimization — Add meta tags and structured data

Frequently Asked Questions​

1. Is Vercel free for personal projects?​


Yes. Vercel offers a free Hobby plan that is suitable for personal websites, portfolios, blogs, and small projects.

2. Can I connect a custom domain to Vercel?​


Yes. Vercel allows you to connect domains purchased from providers like GoDaddy, Namecheap, Hostinger, and Google Domains. You can also buy a domain directly through Vercel at vercel.com/domains.

3. Is connecting a custom domain to Vercel free?​


Yes. Adding a custom domain to your Vercel project is free on the Hobby plan. You only pay for the domain registration itself at your chosen registrar (typically $10–$15/year for a .com).

4. Do I need coding experience to deploy a website on Vercel?​


No. Vercel provides a simple interface that allows beginners to deploy websites directly from GitHub repositories with minimal setup.

5. How long does it take to deploy a website on Vercel?​


Most deployments complete within a few seconds to a few minutes depending on the project size. DNS propagation for a custom domain can take up to 48 hours.

6. Does Vercel provide automatic HTTPS?​


Yes. Vercel automatically provisions an SSL certificate for your domain using Let's Encrypt, ensuring your site is secured with HTTPS at no extra cost and with no configuration needed.

7. Can I update my website after deployment?​


Yes. Any changes pushed to the connected GitHub repository automatically trigger a new deployment on Vercel.

8. What is the difference between Vercel and traditional web hosting?​


Vercel focuses on modern web application deployment with automatic scaling, Git integration, global CDN, and continuous deployment workflows. Traditional hosting typically requires manual file uploads and server management.

9. How do I point my domain to Vercel?​


To point your domain to Vercel, log in to your domain registrar and go to DNS Management. Add the A or CNAME record using the exact values shown in your Vercel project's domain settings. If using Vercel DNS, follow the nameserver values and instructions Vercel displays.

10. How do I change the custom domain on an existing Vercel website?​


Add the new domain to the existing project under Settings → Domains, update DNS at your registrar using the values Vercel displays, and wait for verification. Set the new domain as primary or configure a redirect, test it, then remove the old domain only if you no longer need it.
 

Thread statistics

Created
Chaitz,
Replies
0
Views
3
Back
Top