Mahesh's blog
Published on

Intro to Netlify

Tagsnetlifydeploymentfeaturesserverlessgit

Earlier, I used to deploy my blog using Heroku. It used to be good with minimal setup and diverse options for scalability. As I was doing few courses in Frontend masters, I got introduced to Netlify which is another deployment framework for web projects. I was planning to try and got hooked into it quickly because of its simplicity in setup and web portal usability.

Netlify features

These are useful and interesting features in Netlify which makes it worthy to try for pet projects and even for large scale projects. Here are we go with the features:

Simplicity in setup

Netlify is easy to get started and setup auto deployment. Here are 3 steps:

  • Link Github or Bitbucket or Gitlab account
  • Pick git repository from linked account
  • Give start command. In my blog, it was Gatsbyjs based site and got picked up right away without need of mentioning any start command.

Netlify will generate site url but you can always change based on your preference.

That's all. You are all set for auto deployment as you push changes to code repository.

Auto preview of Pull request

This is one of the useful features in Netlify.

Whenever you create a PR, changes from the branch gets deployed automatically without any setup. This makes it easier to test and demo features during development phase before merging pull request.

Custom domain and SSL setup

If you want to use custom domain, you can do it in no time with these steps:

  • You can go to Domain management of site setup in Netlify
  • Add domain alias
  • Update in the domain site with ANAME record to Netlify site as instructed. This is to tell custom domain to get redirected to Netlify site.
  • Wait for 24hrs for sync to complete and then you should be good to use custom domain.

Once custom domain redirect to Netlify site is working, you can setup SSL certificate for your site inside Domain management (HTTPS section). It uses Lets Encrypt (a free service for providing ssl certificates). It is important to setup SSL for security purpose and moreover, its free and easy to setup in Netlify.

Functions

Usually, we maintain servers to abstract secure information of site and restrict any access other than app. This comes with a cost of maintaining servers and environment setup for the app whenever we need new deployment. This makes sense for long running executions but can be tedious if code execution neither takes time nor needs setup.

Consider a scenario of authentication using 3rd party api. You can pass parameters to 3rd party api and get response to let user in or not. For this, we can use simpler setup than setting server to make it work. Here is the where we can use serverless functions like AWS Lambda. This will be essential if you have JAM stack site like my blog where there is no server setup at all.

First Netlify function

Here is the code to implement Netlify version of serverless function:

install netlify-lambda npm module using following shell command

npm install netlify-lambda

netlify.toml

[build]
  command = "npm run build"
  functions = "functions"
  publish = "public"

hello-world.js

exports.handler = async (event, context, callback) => {
  return {
    statusCode: 200, // http status code
    body: 'Hello world of serverless function',
  }
}

To test locally, you have this locally in scripts of packages.json :

"start:lambda": "netlify-lambda serve src/functions"

To test locally,

npm run start:lambda

By default, you can hit localhost:9000/hello for testing function and you can use api url: "/.netlify/functions/hello" within your site to call the function after deployment in Netlify.

Once you push these changes to code repository, then you are all set with Netlify functions.

Split testing

Though I didn't use this feature yet, this is perhaps the best feature I liked in Netlify. Split testing means Netlify will deploy different versions from different branches and can distribute the request load between these versions according to percentage you set. This can be really useful to get user feedback for new features or experiments without impacting full site.

There is literally no setup other than mentioning branches and percentages in Netlify. No setup with so much power makes it compelling case to use.

These are no way complete list of features of Netlify but more like features either I used or liked to try in near future. So, give it try and keep me posted if you happen to see anything interesting in Netlify.

References