Today, let’s take a look at how to host a static website on Netlify, including setting up continuous deployment.
TL;DR “Just set it and forget it.”
Getting started on Netlify
In this section, we will show you how easy it is to launch your site on Netlify. If you are not already a Netlify user, go ahead and sign up for free here first.
Step 1: Add Your New Site
Creating a new site on Netlify is simple. Once you’ve logged in, you’ll be taken to https://app.netlify.com. If you’re just starting out, there’s only one option, Click the Add A New Project button shown above.
Step 2: Link to Your GitHub (or supported version-control tool of choice)
Clicking “Add A New Project” brings you to this screen:
Be sure to push your repo to GitHub, so that all we’ll need to do is link Netlify to GitHub. Click the GitHub button as illustrated in the screenshot above.
Step 3: Authorize Netlify
It’s time to allow Netlify and GitHub to talk to each other. Clicking the Authorize Application button will do just that. Like it says in the image below, Netlify doesn’t store your GitHub access token on our servers. If you’d like to know more about the permissions Netlify requests and why we need them, you can visit.
https://docs.netlify.com/github-permissions/
Step 4: Select Your Repo
Now that you’ve connected Netlify and GitHub, you can see a list of your Git repos.
Step 5: Configure Your Settings
Here you can configure your options. Make sure your Directory is dist/ and your build command is npm run build. Then click the Build your site button to continue.
Step 6: Build Your Site
Now it’s time to sit back and relax. You did your part let Netlify take care of the rest - it’ll only take a minute.
Step 7: All Done
Netlify went ahead and gave your site a temporary name. Let’s quickly update that to make it look a little prettier:
There, that’s better. Looks pretty good, huh? Wasn’t that easy? Take it a step further and setup your custom domain (Learn how to do that here). Congratulations, and thanks for using Netlify!
Notice something is incorrect or outdated?
First off, great eye! We appreciate your discovery and want to ensure it gets addressed immediately. Please email us at support@netlify.com.
About Netlify
Netlify is an all-in-one platform for deploying and automating modern web projects.
Simply push and Netlify provides everything—servers, CDN, continuous delivery, HTTPS, staging environments, prerendering, asset post processing, DNS, and more.
Any project, big or small, can perform instantly on a global scale.
Test your site NOW