DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Kahlil Lechelt
Kahlil Lechelt

Posted on • Originally published at kahlillechelt.com on

blog-cli: A CLI for Blogging with Static Site Generators

My blog is built with Hugo. Every blog I ever had was built with a static site generator or a file based CMS. I love static site generators, they make content management simple, they are secure and it’s fun to build websites with them.

For me, they have one problem: creating a blog post is annoying. Typically the file for the post needs to have the date in it and the slug and then you need to put in the Front Matter for the post. It is all just very tedious and annoying.

That’s why I made blog-cli. It creates the Markdown file for me at the right location with the correct file name, inserts the basic Front Matter and opens the file in my favorite Markdown editor. This means I go from post idea to writing in 1 second.

This should work for most static site generators. At least for simple setups.

Here is how it works.

First you have to install blog-cli. You need Node.js and npm for that.

npm install --global @kahlil/blog-cli
Enter fullscreen mode Exit fullscreen mode

Then you need to tell blog-cli where you want it to put your posts.

blog --path ~/my-blog/posts
Enter fullscreen mode Exit fullscreen mode

Then you need to tell blog-cli about your favorite Markdown Editor.

blog --editor 'ia writer'
Enter fullscreen mode Exit fullscreen mode

Now you are all set and you can create a new post and open it in your editor by simple specifying a slug.

blog my-new-cool-post
Enter fullscreen mode Exit fullscreen mode

This will create a new file with the filename: 2019-01-17-my-new-cool-post.md in the directory you specified, ~/my-blog/posts in this case.

The Front Matter that is inserted looks something like this:

---
draft: true
date: 2019-01-18T10:03:48.620Z
title: ""
---
Enter fullscreen mode Exit fullscreen mode

Now, if you are part of the cool kids club then you probably keep your files in a Git repository, commit new blog posts and push them to Github at which point it gets deployed to Netlify.

It turns out that blog-cli can help you with that as well!

blog --publish
Enter fullscreen mode Exit fullscreen mode

Will automatically commit all changes with the message β€˜new post’ and execute a git push.

Nifty, right?! If you are static-site-generator-blogging as well I hope blog-cli can help you.

If you have any ideas to improve it please send an issue or a PR on GitHub.

Top comments (19)

Collapse
 
peterwitham profile image
Peter Witham

This is a great idea for a tool, two questions

  1. Is it possible to edit the frontmatter template easily to make it work just the way you want for any given site?

  2. Can it work with multiple blogs?

Keep up the great work!

Collapse
 
kahlil profile image
Kahlil Lechelt Author

Currently it is not possible to configure the front matter. But that could be added as a feature quite easily. Feel free to send a PR :D

If you want to switch to a different blog just set a new path. This could be made easier too though...

Collapse
 
peterwitham profile image
Peter Witham

Thanks for the reply, I plan to put some time aside to take a deeper look and see if I can contribute something useful to it.

Thread Thread
 
kahlil profile image
Kahlil Lechelt Author

Sweet, looking forward to it.

Thread Thread
 
kahlil profile image
Kahlil Lechelt Author • Edited on

Here is an idea: blog-cli could just check if there is a blog-cli property in the package.json that has a property pathToPosts or something and if yes it could just use that.

Multiple blogs could be suported by adding multiple paths in there that have an alias name as a property or something:

{
  "blog-cli": {
    "paths": {
      "work-blog": "/my/work/blog/posts",
      "personal-blog": "/my/personal/blog/posts"
    }
}

And then there should be a command line flag that should allow you to switch between blogs, like: blog --switch-to work-blog for example.

Thread Thread
 
peterwitham profile image
Peter Witham

I think I'd need to see an implementation of the idea to really get it.

I have been working on adding the ability to work with more than one template and to set a template path, I have it working but I need to clean it up a little and test for when it's not specified.

Once I have it done I'll submit it as a pull request, my fork is here
github.com/GrfxGuru/blog-cli

Thread Thread
 
kahlil profile image
Kahlil Lechelt Author

I made an Electron app based on blog-cli now: kahlillechelt.com/2019/05/07/annou...

Thread Thread
 
peterwitham profile image
Peter Witham

Great! I will be taking a look at it.

Collapse
 
johnbokma profile image
John Bokma

Being aware of this issue I wrote my own static site generator differently: it uses a single input file. While I use it mainly to generate a blog, Plurrrr, it certainly can be used to generate (small) sites with it as well. The SSG is available on GitHub: tumblelog.

Collapse
 
michael76359143 profile image
Michael Williams

Hi Kahlil,

I hope it will work with Pelican as well.

Collapse
 
kahlil profile image
Kahlil Lechelt Author

Hi! What is Pelican?

Collapse
 
michael76359143 profile image
Michael Williams

It's Static site generator written with Python.

Thread Thread
 
kahlil profile image
Kahlil Lechelt Author

So far its not specific to any static site generator. All you need is a folder with markdown files that contain your posts and front matter. If Pelican has a different file format or doesn't use front matter, that can be added quite easily. You can send a PR if you want.

Thread Thread
 
michael76359143 profile image
Michael Williams

Yes, pelican blog posts are written in Markdown. This should work then. Thanks a ton.

Thread Thread
 
kahlil profile image
Kahlil Lechelt Author

Check it out I made an Electron app to do the same with a GUI kahlillechelt.com/2019/05/07/annou...

Collapse
 
marpme profile image
marpme (Marvin) • Edited on

oh wow, didn't know about that one. Thank you very much!

Collapse
 
kahlil profile image
Kahlil Lechelt Author

Happy to! πŸ€—

Collapse
 
dopitz profile image
Daniel O.

How do you upload images and embed them?

Collapse
 
kahlil profile image
Kahlil Lechelt Author

blog-cli doesn’t help you there besides with the publishing. Youβ€˜ll have to put the image into the folder your static site generator requires and then you just reference it as you would before in the MD file. Images and text will typically be deployed via a git push and then a Webhook from Netlify for example.

blog-cli is just a thin convenience layer over a static site generator.

🌚 Browsing with dark mode makes you a better developer.

It's a scientific fact.