Hostwizly

How To Deploy Static Website On Vercel For FREE

Published 17 October 2023 by Jarvis Silva

Looking to host your static website on Vercel but don't know how then you are at the right place. In this tutorial I will show you how to deploy static website on Vercel web hosting platform.

Vercel is a cloud platform that allows developers to deploy, manage and scale their website very easily, we will use vercel's free plan to our host static website which is enought to run a website made using html, css and javascript.

So before proceeding you need to have a static website made using html, css and js ready for deployment, a github account and a Vercel account with a hobby plan which is free of cost now let's host our website.

1. Upload Static Website To Github

To deploy any code on Vercel we need to first upload the code on Github repository then in Vercel connect github account and import the code from the Github repository, follow the below steps to push code to Github:

  • Open Github and login to your account, click on create a new repository, enter your app name, leave rest everything default and click create repository.
  • Now it will show you commands to push your code to this repository, open a terminal at your static website code location and run all the commands one by one.
  • Github new repository page with commands

Read: How to push code to github

After you run all the commands you should see your code upload to your Github repository.

2. Deploying Static Website To Vercel

Now we just need to deploy our code on Vercel for that you need to have your Github connected with your Vercel account to do that you can login by Github account or use the connect Github option in Vercel, after connecting follow the below steps:

  • Go to your Vercel dashboard and click on the add new button it will open a dropdown in that click on project.
  • Vercel new project button page
  • Now it will open a new page displaying your Github repositories, now here you need to click on import of your static website repository you want to host.
  • Vercel git repo import page
  • Now it will ask you to enter your project name, leave the other settings as default and click on deploy.
  • vercel project deployment final step

Now it will start building your website and deploy it on Vercel, it will generate some preview url to view your static website you can also connect a custom domain if you have.

Also read: Deploy express app to Vercel

So this was everything required to host a static website on Vercel For Free, I hope you were able to follow along and successfully deploy your static site to Vercel. Thank you for reading, Have a nice day 😊

About the author

I am Jarvis Silva, a tech-savvy individual. I have 5 years of experience in website hosting and development, Now sharing all my knowledge related to web hosting and other various technologies on the internet through Hostwizly.