Zola

This guide shows you how to deploy a Zola application to Edgio.

Example #

System Requirements #

• Install Node.js 16.16.0

Sign up for Edgio #

Deploying requires an account on Edgio. Sign up here for free.

Install the Edgio CLI #

If you have not already done so, install the Edgio CLI.

1npm i -g @edgio/cli

Create a new Zola app #

Step 1: Install Zola #

1brew install zola
2# or
3sudo port install zola

To verify your new install:

1zola --version

Step 2: Create a New Site #

1zola init myblog

You will be asked a few questions.

1> What is the URL of your site? (https://example.com):
2> Do you want to enable Sass compilation? [Y/n]:
3> Do you want to enable syntax highlighting? [y/N]:
4> Do you want to build a search index of the content? [y/N]:

For our blog, let’s accept the default values (i.e., press Enter for each question). We now have a myblog directory with the following structure:

1├── config.toml
2├── content
3├── sass
4├── static
5├── templates
6└── themes

For reference, by the end of this overview, our myblog directory will have the following structure:

1├── config.toml
2├── content/
3│   └── blog/
4│       ├── _index.md
5│       ├── first.md
6│       └── second.md
7├── sass/
8├── static/
9├── templates/
10│   ├── base.html
11│   ├── blog-page.html
12│   ├── blog.html
13│   └── index.html
14└── themes/

Step 3: Start the Zola server #

Let’s start the Zola development server with:

1zola serve
2Building site...
3-> Creating 0 pages (0 orphan), 0 sections, and processing 0 images

Configuring your Zola app for Edgio #

Create a package.json at the root of your project with the following:

1npm init

Initialize your project #

In the root directory of your project run edgio init:

1edgio init

This will automatically update your package.json and add all of the required Edgio dependencies and files to your project. These include:

• The @edgio/core package - Allows you to declare routes and deploy your application on Edgio
• The @edgio/prefetch package - Allows you to configure a service worker to prefetch and cache pages to improve browsing speed
• edgio.config.js - A configuration file for Edgio
• routes.js - A default routes file that sends all requests to Zola.

Configure the routes #

Update routes.js at the root of your project to the following:

1// This file was added by edgio init.
2// You should commit this file to source control.
3
4import { Router } from '@edgio/core/router'
5
6export default new Router()
7  // Create serveStatic route for each file in the folder public with a cache-control header of 's-maxage=315360000'
8  .static('public')

Refer to the CDN-as-code guide for the full syntax of the routes.js file and how to configure it for your use case.

Run the Zola app locally on Edgio #

Create a production build of your app by running the following in your project’s root directory:

1npm run build

Test your app with the Sites on your local machine by running the following command in your project’s root directory:

1edgio dev

Load the site http://127.0.0.1:3000

Deploying #

Create a production build of your app by running the following in your project’s root directory:

1npm run build

Deploy your app to the Sites by running the following command in your project’s root directory:

1edgio deploy

Refer to the Deployments guide for more information on the deploy command and its options.