Deploy Your Website on Vercel and Connect with a Custom Domain

Introduction

Are you ready to take your website live with a custom domain? Buckle up because we're about to embark on a web deployment adventure! In this guide, I'll show you how to deploy your website on Vercel and seamlessly connect it with your very own custom domain. Let's dive in!

Step 1: Creating a GitHub Repository

The journey begins with your trusty GitHub repository. Create one for your project and make sure all your web assets are safely stored there.

Step 2: Adding a New Project on Vercel

Head over to Vercel and click that inviting "ADD NEW" project button.

Step 3: Searching for Your GitHub Repository

Now, search for the GitHub repository you just created.

Step 4: Configuring the GitHub App

If your repository isn't imported to Vercel automatically, don't fret. Just click on "Configure GitHub App." It'll ask for your GitHub password, so toss that in there to continue.

Step 5: Saving Your Repository

Back in the tab, scroll down to find your repository and click on "Save."

• Search for your Repository on Git Hub.

• Now click on save.

Step 6: Importing Your Repo to Vercel

Now, you're all set to import your repository to Vercel.

Step 7: Deployment Magic

You're almost there! Just click on "Deploy."

Step 8: The Moment of Truth

After your site passes all the checks, you'll know it's successfully deployed. 🚀

• click on Visit to see your website live!!

Step 9: The Domain Dance

Time to claim your domain!

By default, Vercel provides you with a domain like <repo-name>.vercel.app, but let's add some personal flair.

I got my custom domain from Porkbun, but you can choose your favorite domain registrar.

Step 10: Adding Your Custom Domain to Vercel

Back in Vercel, add your custom domain.

• Head over to "domains"

• Add your custom domain here

Step 11: Custom DNS Records

Vercel will provide you with custom DNS records for your domain. Keep a note of them.

Step 12: Configuring DNS Settings

Head over to your domain name provider's website and configure the custom DNS records for your domain. It's like giving your website a secret handshake!

• This is Porkbun. All this information is provided by Vercel.

Fill in the details and finally click on "Add" and let the magic happen.

Step 13: The Waiting Game

Now, be patient. Wait for Vercel to fetch the changes you made, and within a few minutes, you'll have your very own custom domain for your website. 🌐