A better static site blogging workflow with Alfred + Eleventy in 2022
Using Alfred to make creating blog posts easier, automating file and YAML creation.
Much that I love the simplicity of writing blog posts in Markdown for eleventy (11ty), it can be tedious to create files and the YAML markup needed for a blog post, and I want to reduce the effort needed to both create, write and publish in 2022.
Solution: Automate the boring bits
After a bit of searching I came across two posts from Mark Boulton and Robin Rendle which were the answers to my problems - use Alfred App (a trusty Mac launcher with workflow capabilities) and it's Workflow capabilities to both create a file in the right place and write out the YAML template needed.
I've tweaked both of their suggestions as I wanted to output a date and time in the YAML, and use the date only as part of the filename, and use the title in both the filename and the YAML so have added some extra steps.
Old workflow
To paraphrase Robin:
Just look at this nightmare blogging process:
- Open up VS Code and the workspace.
- Create the file name inside /_posts.
- Go to another file and copy/paste the metadata to the top of this one.
- Add the title and the correct date.
- Write the dang blog post.
- Push that code to the master branch so Netlify can publish.
New workflow
- Launch Alfred
- Type 'b' and the title of your blog post -> Alfred does steps 1-4 for you above!
- Write and commit/push to your master branch
Below is the workflow needed - It looks complex, but it really isn't - each step is small and feeds into the next. Alfred passes whatever you type after your keyword into a variable called query
.
I've annotated the steps, and code below for each step:
How to add these steps
Please note most of these steps can be added by right clicking on the workflow window, and choosing from the top 5 menu options.
Step 1 - Trigger > Hotkey
Choose a trigger keyword, and set the text that shows up in Alfred to tell you what the action is.
Step 2 - Utilities > Args and Vars
Copy the query
variable into another variable called title
- we use this for the page title.
Step 3 - Utilities > Replace
Do a find and replace with the passed in {query}
variable to remove spaces and replace with hyphens.
Step 4 - Utilities > Transform
Change the {query}
to be lower text.
Step 5 - Utilities > Args and Vars
Set up three variables - a hyphenatedtitle
for the filename, and the current time, and current date.
Step 6 - Outputs > Write Text File
This is where the blog post file gets created, and the YAML output. I usually add a summary, and a tag for the post, so have included these.
Step 7 - Actions > Open File
Open the file in VS Code (or whatever your chosen editor is).
Step 8 - Outputs > Post Notification
Show a success message!
In Conclusion - Automate all the things
This looks complicated but really isn't, and once you have it set up you can easily copy and tweak it. I've been using it for writing quick blog posts and notes and it's lightening fast.
AlfredApp and it's workflows are really powerful, and I'm only starting to scratch the surface of what they can do. Find out more about Alfred workflows on their site.