ScottHanson.DE Savin it up for Friday night 🎵

Push an Outline with Github Actions

I've never worked with Github Actions before, but when thinking about how to push an outline from Drummer to GitHub I thought I'd take a look.

Actions are in YAML files saved in a special directory .github/workflowsin your repository. They can run when something happens in the repository (like a push or a pull request) or can be triggered externally (with an API call). The action starts a virtual machine, runs commands, then shuts down.

Fetching an outline from Drummer and committing it to the repository was pretty easy...

name: fetch-opml
on: [workflow_dispatch]
jobs:
  fetch-opml:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - shell: bash
          run: |
            git config --global user.name "GitHub Action"
            git config --global user.email "papascott@gmail.com"
            curl http://drummer.scripting.com/ScottHansonDE/papascott-de.opml -o papascott-de.opml
            git add papascott-de.opml
            git commit -m "Fetched at `date`" --allow-empty
            git push origin main

NB: This post was written in Markdown, not Drummer, since I don't know yet how to render code blocks from OPML. Still diggin'!

Correction: Do NOT hide your secrets in the root outline

Correction 13 November: you should not use this for real secrets, since the root outline is not really hidden or secure. But for global variables that you don't mind having exposed it should be OK. Caveat emptor!

My video demo yesterday revealed the URL of my Netlify build hook for all to see. It's now been changed, but I need not have revealed. Drummer has a root outline where global variables can be defined.

So in the root outIine I can create an env object, and define an entry for netlifyBuildHook for the URL. (You have to use proper JavaScript object syntax, with brackets, colons and quotes.)

The xhr.open line of my build script can then be
xhr.open("POST", root.env.netlifyBuildHook, true);
without revealing the actual URL.

Video Demo of Posting to Gatsby

Dave Winer asked me to make a quick video of how it looks for a user to post to Gatsby from Drummer. I'm more than happy to oblige!

Blogging in Gatsby with Drummer

It works! At least for me, with a lot of limitations. But this post (and the two previous posts) on my Gatsby-powered blog was written in Drummer. The Dummer posts are integrated with the previous posts that were written in Markdown. The code for my blog with the new OPML plugin is on GitHub.

As I mentioned, I started with demo code by Andrew Shell for Little Outliner outlines. That was written for Gatsby v2, I submitted a couple of fixes so it would work with Gatsby v3 and the recently released v4.

The demo code plugin creates Markdown 'nodes' for the outline entries. I added a couple of frontmatter entries to these nodes for ease of processing. I then adapted my gatsby-node.js to handle both Markdown files and the Markdown nodes from the OPML plugin.

There are still a lot of limitations. It ignores blog posts without titles (my wish, for now) and does not support most of the attributes used by the OldSchool CMS. But now it's my template, my layout, and my code, and I can add those features later whenever I want! 😛

Making POST requests from Drummer

That build hook URL for Netlify requires a POST request. But Drummer lets you run a script from the Iconbar. Here's mine.

const xhr = new XMLHttpRequest();
// XXX is given to you by Netlify
const hookUrl = "https://api.netlify.com/build_hooks/XXX";
xhr.open("POST", hookUrl, true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.send(JSON.stringify({}));