This is a beginner’s guide to how to deploy a static website from GitHub to Netlify.

Netlify is a service which provides an easy way to deploy the static sites from GitHub or GitLab or Bitbucket. Moreover, it’s free (unlimited projects) for one user. Best fit for personal websites.

In this tutorial, I will explain how to host a site on Netlify from a GitHub repository. I assume you have a repository in GitHub. If you do not have any, fork my repo from here.

If you are new to Git, follow this amazing tutorial from product.hubspot.com. or the basic guide by Abhishek Joshi from here.

Signup and Login to Netlify

Let’s start with creating an account in Netlify. As we are hosting our site from GitHub, it’s recommended to signup with GitHub account.

Netlify Signup with GitHub account

New site from GitHub

After Signup, Login to Netlify with GitHub account. On the Home page you can see a button to Create New site from Git.

Create New site from Git button on Home Page

Click on New site from Git button. On the next page, you can see the option to connect to GitHub to fetch the repositories.

Connect to GitHub

Configure a repository for Netlify

Authorize with GitHub. As we haven’t yet configured any repositories for Netlify, they will be listed here. Now configure a new repository by clicking on Configure the Netlify app on GitHub.

Pick a GitHub repository

You will be navigated to your GitHub account. There you can select the repositories of your choice. Select the repository from the dropdown and click on Save.

Deploy Site

Now the selected repo will be listed in Netlify. Click on it to deploy the site.

Repositories configured for Netlify

Leave the options and click on Deploy Site

Deploy site

Congratulations! You have just deployed your first site on Netlify! The site will have a random name. Click on the hyperlink (URL ending with netlify.com) to browse the site.

Rename site

Click on Deploy settings and then click on General in the left panel. Click on Site details. Now you can see the site information in the right panel. Now click on Change site name to rename the site.

Site details page

Rename the site to the desired name.

Rename site

Continuous Deployment

Whats more, every time you push a new commit, Netlify updates the site on-the-go. Super Cool right?

Live updates

Live site

Here is My dev Landing Page hosted with Netlify.

My dev landing page live at Netlify

Hope it helps you!!

Originally published at Medium