Deploying to Netlify

Netlify is a great service for hosting a statically built website. If you don't need to serve any dynamic content, Netlify is probably a great choice for you. It's also where nestacms.com is hosted.

Before you start, you'll need an account on netlify.com, and to have connected Netlify to your Git repository.

Once you've got your site stored in an online Git repository, and have a Netlify account, you're ready to go.

Testing the build locally

Before we ask Netlify to build our site for us, let's check it out locally.

Open a terminal, and then run this command within your site's main folder:

$ cd mysite.com
$ bundle exec nesta build

The build command should create a ./dist folder, and create an HTML file for each of your site's pages inside it.

If that looks like it went smoothly, that's great. If not, pause for a moment to investigate.

Configuring the static build

There are a couple of things that the build command isn't able to determine for itself, that we need to help it with.

  • Your web site's domain name, which is used when generating links in things like your site's Atom feed
  • The path of any assets that are dynamically generated from templates (e.g. CSS files that are generated from Sass)

We set them both up in config/config.yml. If your Nesta site was generated by a recent version of Nesta (0.14.0 or later) you'll already have the necessary config at the bottom of config.yml. If not, have a look at the bottom of this file.

To give you an example, for nestacms.com it's configured like this:

build:
  domain: "nestacms.com"
  templated_assets:
    - /css/master.css

nestacms.com has multiple .sass files, but they're used to produce just one CSS file that's loaded via a <link rel="stylesheet" ...> tag. Those are the kind of files that we need to make sure we include in the build.

If you run bundle exec nesta build again, you'll see that any CSS files that you've listed in templated_assets are included in the build.

Configuring Netlify's build system

When Netlify builds your site it needs to know what commands to run. They allow you to configure that with a config file called netlify.toml, which lives in your project's root folder.

To build Nesta on Netlify, your netlify.toml file should look like this:

[build]
  command = "bundle exec nesta build"
  publish = "dist"

You'll also need a .ruby-version file (you may have one already), so that Netlify's servers know which version of Ruby to use.

You can create one like this:

$ echo "3.3.6" > .ruby-version

Version 3.3.6 is just an example, and happens to be the latest version of Ruby as I'm writing these docs. Adjust the version to suit. It's a good idea to run the same version on Netlify that you're using locally.

You'll need to add both these files to your Git repository, commit them, and push.

Deploying to Netlify

You're very nearly done.

If you give Netlify access to your Git repository, it should be able to build and deploy your site.

See Netlify's docs on importing a site from an existing repository. In short, you:

  • Connect Netlify to your account on your Git hosting service
  • Choose the repository for your Nesta project from a list
  • Click "Deploy site"

You can also tell Netlify to automatically redeploy your site whenever you push changes. It's a really nice way to work.