Sam Bunting

Creating markdown files for a Gatsby blog with Hygen

How to use the command line to create boilerplate blog posts

January 12, 2020



My Gatsby blog uses markdown for content, these are inside of the content folder, and thought I could make life a bit easier by using Hygen to generate the directories and the basic markdown file by running a command.

Introducing Hygen

Hygen is a code generator that is activated in the command line, and configured within a text editor.

Hygen can be used by installing it globally:

npm i -g hygen

From there we can initialise it, and create our own generator named “post”

hygen init self
hygen generator new post

What we need

I need a way of creating these markdown files from a template, currently these files contain a bit of metadata, and the actual blog post content itself.

title: This is the title of the blog post
date: "2020-01-01T00:00:00.000Z"
description: "This is a description of the blog post"
This is where the blog post body goes.

Modifying the template

Since Hygen is template based, we can edit the newly created _templates/post/new/hello.ejs.t. The name doesn’t actually matter, since we will be renaming it later on anyway, so feel free to change it if you wish.

However, the contents of the file needs a bit of changing, start by deleting everything in the body, as we want the post body to be blank.

The to option needs to be changed to where we want the file to be, in this case in a directory in content/blog/. Hygen allows us to pass through properties through the command line, in this case, I’ll use name as the property.

to: content/blog/<%= name %>/

However, we need it to be written as a slug. In order for us to do that, we need to create a helper. We can do this by creating a .hygen.js file in the root of our project.

Once created add the following.

// Created by GitHub user codeguy
function string_to_slug(str) {
  str = str.replace(/^\s+|\s+$/g, ''); // trim
  str = str.toLowerCase();

  // remove accents, swap ñ for n, etc
  var from = "àáäâèéëêìíïîòóöôùúüûñç·/_,:;";
  var to = "aaaaeeeeiiiioooouuuunc------";
  for (var i = 0, l = from.length; i < l; i++) {
    str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i));

  str = str.replace(/[^a-z0-9 -]/g, '') // remove invalid chars
    .replace(/\s+/g, '-') // collapse whitespace and replace by -
    .replace(/-+/g, '-'); // collapse dashes

  return str;

module.exports = {
  helpers: {
    slugify: s => string_to_slug(s),
    date: () => new Date().toISOString()

This code contains a function from a GitHub gist which simply put, slugifys a string.

I’ve also added a date helper, as we use it later.

Now we can go back and modify our hello.ejs.t file.

to: content/blog/<%= h.slugify(name) %>/

Now, run:

hygen post new "Test Post"

And notice a new slugified folder has been created inside of content/blog! This is a great start, but we haven’t finished just yet, we want to add in the post metadata.

to: content/blog/<%= h.slugify(name) %>/
title: <%= name %>
date: "<%= %>"
description: ""

title will use the name that we provided.

date is the new helper also added.

description is blank.

Now when you run:

hygen post new "Test Post"

You should now see an file created inside of content/blog/test-post/ that looks something like this!

title: Test Post
date: "2020-01-12T20:23:40.378Z"
description: ""

Read more

That's the article!

I really hope you enjoyed this post or found it useful in some way!

Previous Article

Hello World!

What's this all about?

January 11, 2020

Next Article

Uploading files to Google Drive via the command line

How you can use rclone to upload files to a cloud storage provider.

February 22, 2020