Skip to main content

Command Palette

Search for a command to run...

Hosting static HTML pages on Vercel

A tutorial on how to host your static HTML website on Vercel

Updated
2 min read
Hosting static HTML pages on Vercel

A few days ago one of my friends came to me and asked me if it was possible to host a static HTML page on Vercel.

I looked into it, and after looking at how the Vercel hosting worked, I found it is "basically" a Node.JS host.

I started setting up a Node.JS project to host HTML with Express

Therefore I made a GitHub repo template that you can use to host your own page on Vercel.

Checkout the GitHub repo here: https://github.com/KindCoder-no/vercel-html-hosting-template

Here is a walkthrough on how to set up the GitHub repo with Vercel.

Start by cloning the repo (or use it as a template)

image

Go to https://vercel.com and log in with your GitHub account

Create a new project and import it from GitHub

image

image

Select your GitHub repo and press import

image

Under project settings, you need to customize your build settings

Build command: npm run start

Install command: npm install

image

After you have set up build setting press deploy and Vercel should deploy the project by itself

If you have setup everything correctly you should see a page looking somewhat like this:

image

You should get a domain from vercel. Mine became: https://vercel-html-hosting-template.vercel.app/

After your Vercel deployment is setup you can add your HTML, CSS and javascript files to the public folder on GitHub. And Vercel should deploy the changes automatically