Netlify is awesome because it talks to your Git provider and can build and deploy your app automatically with every commit, without any other commands.

If you don’t have an account, create one at netlify.com and come back to this tutorial.

Connect to Git

Follow the prompts to sign in to your Git provider, and give Netlify access to the repositories that you want it to deploy from. I recommend giving it access only to the repositories you need it to build and deploy, because one can’t ever be too careful.

Create a site

  1. Go to your homepage at https://app.netlify.com/
  2. Click New Site from Git
  3. Follow the prompts to give access and choose your repository
  4. Proceed to the Build options section

Build options

This depends completely on your project. Since I use node.js and parcel.js to serve my web-apps I will use it as an example.

Every time you commit, Netlify needs to know what build command to run and then where the built app needs to be served from.

Example

In my package.json, I have a build script as follows

...
"scripts": {
	...
    "build": "parcel build client/index.html"
  },
 ...

Running npm run build generates my app’s files in the dist folder.

Given this, I finally put in the following into Netlify

Build command: npm run build
Publish directory: dist

Domain Settings

Netlify automatically generates a random URL for your app.

  1. To use your own domain, go to Domain Settings.
  2. Click Add custom domain
  3. Add the full domain name
  4. Confirm ownership

Setting up DNS

Wherever you have purchased your domain, you can modify the DNS records to point the domain/subdomain to your new Netlify site.

To do this, add a CNAME record with the Host field as customsubdomain.yourdomain.com or yourdomain.com and the Answer field as weird-netlify-url.netlify.com

Setting up HTTPS

Since Netlify is awesome, they provide free HTTPS for all websites. Just scroll down, and click Verify or similar and it will get you a certificate from Let’s Encrypt.

You’re done. Enjoy!