A static site blogging tool for Bear

Monday, October 19, 2020


A static site blogging tool for Bear

Bear is awesome 🐻

I use Bear almost every single day. I use it for journaling, writing down ideas, brainstorming, creating lists, and documenting my work.

Personally, I love Bear’s UI. It’s simple and unobtrusive. It does exactly what you need it to do, and doesn’t get in your way.

When I write in it, it just FEELS like I’m way more productive (even when I’m probably not), and my ideas seem to flow seamlessly from brain to Bear versus some other writing apps that I’ve tried in the past.

But, as much as I love using Bear for writing, there’s one major thing that I still have yet to fully utilize Bear for: blogging.

More specifically, using Bear for blogging on static sites like Gatsby, Jekyll, or Hugo

What’s a static site?

The blog you’re reading right now is custom static site built with a popular framework called Gatsby.

Without getting into too much detail here, static sites are basically a set of pre-built HTML files that can be immediately served to a browser, much like they were back in the 90s.

Serving pre-built files means that the server doesn’t have to rebuild the HTML each time a user wants to visit a page on your site. This means your site loads can be very fast.

It also means the website servers themselves don’t need a lot of processing power. They can be extremely low-cost (nearly free), “dumb” servers at a fraction of the price of traditional virtual private servers (VPS), which are necessary for Wordpress sites.

Static sites are becoming increasingly popular for their speed and scalability, versus other non-static platforms (eg Wordpress) that require more server horsepower as you scale in users.

What’s this have to do with Bear?

Over the past few years, I’ve been experimenting with static sites for blogging. While they aren’t a panacea, they are definitely something worth paying attention to.

I happen to manage a few sites built on static site technology, and I’ve always wanted a way to combine the excellent writing experience of Bear with all the benefits of static site generators like Gatsby, Jekyll, or Hugo.

Before I begin, I realize that there might be other automated solutions, hacks, or perhaps apps to manage blogging with Bear.

However, this post discusses the 3 main issues that I’ve experienced using Bear for blogging, which are:

  • The Frontmatter Problem
  • The CMS Problem
  • The Cloud Problem

Finally, I’ll discuss my own personal solution that I’ve developed, bearblogr.

Let’s get started! 👊

The Frontmatter Problem

Static site generators work by taking your markdown files containing your content, and then generating static HTML files for your blog post or other individual pages on your site.

Markdown files used by most static site generators typically contain something called “frontmatter”.

Frontmatter is additional metadata that stores information such as the author’s name, published timestamps, paths to a post image, the path/slug desired for your post, etc.

Here’s an example of frontmatter from one of my other blog posts:

title: Create QR Codes With qrencode
subtitle: For sharing URLs, WiFi, Bitcoin, and all your hacking needs
path: /post/create-qr-codes-with-qrencode-for-sharing-urls-wifi-bitcoin-and-all-your-hacking-needs
date: 2020-09-01T17:03:12.246Z
author: Neo
layout: blog
  - devops
  - hacks

Without any explanation at all, it’s easy enough to determine what each line in the frontmatter is used for.

Simple enough, right?

Frontmatter is custom, and is usually something that your Content Management System (CMS) or static site generator handles for you. However, most frontmatter is easily understood, and can be edited without need for a CMS.

So, why even bother using a CMS then? Why not just use your favorite writing app for blogging?

You most certainly can! But before I discuss the process of generating markdown and frontmatter easier, I want to talk a bit about CMSs.

The CMS Problem

CMS platforms were designed to help creators manage their content. CMSs like NetlifyCMS are free and are easy to set up.

But, CMS editors aren’t designed for writing.

Also, many CMSs are hosted online, which means you have to be connected to the Internet to draft a blog post. This isn’t necessarily a huge issue, but it isn’t always the most convenient thing for writers. Especially when an idea strikes you out of nowhere, and you have to get it down; Internet connectivity or not.

Writing is a highly creative process, and the quality of tools used for creating anything almost always matter.

Bear IS designed for writing and it works offline. But unfortunately Bear doesn’t support static blogging platforms…yet.

While Bear does support copying/exporting to markdown, this is only half the battle. Getting your Bear note into a format that a static site generator can accept is a hassle, especially when you might need to frequently change your content.

Which brings us to The Cloud Problem.

The Cloud Problem

I love that anytime I want to update my site, I can *seamlessly* copy and paste my content, then add my frontmatter, save it to a file, then commit, then push to git, then preview the draft.. — No One Ever

If you have ever tried to handle/sync multiple copies of a document living in different places, you’ll quickly realize that it’s not just a simple matter of copy and paste.

Does this sound familiar?

But for the sake of argument, let’s assume wrangling your content and markdown files by hand isn’t an issue for you. You’re a master at CTRL+c and CTRL+v. Hell, you can do CTRL+x while sipping your morning coffee and petting your dog.

⌨️ + ☕ +🐕

Unlike Wordpress, there’s a couple more steps that you still need to go through in order to make your blog post live on most static sites.

If you have a static site for blogging, you still have to pull your latest Git repository from your remote.

Copy your newly created markdown files to the appropriate path in your static site repo.

Do a Git commit.

Push your Git repo.

Rebuild your site.

Then check to make sure that everything still works…

Every. Single. Time. You update your blog’s content.

Yes, these aren’t huge steps, but over time, they all add up and take time.

Time away from your writing and creative process.

I didn’t even mention managing multiple site repos, or if you store your content somewhere else in the cloud (eg. an AWS S3 bucket).

Given all of the above pain points that I’ve run into with using Bear for static site blogging, I figured that there might be an easier way…

Enter bearblogr

The premise for bearblogr is simple: it publishes your content from Bear to your static blog in the fewest steps possible.

The Frontmatter Problem

Is solved by embedding a special code block that contains your frontmatter inside your Bear note.

The CMS Problem

Is solved with Bear! Bear is now your blog’s centralized content management system, that works both on/offline, and on all your devices.

The Cloud Problem

Is solved with another embedded code block that knows how and where to push your blog post when you’re ready to publish. Meaning you can manage content for multiple blogs or sites from within a single Bear account.

In short, bearblogr enables you to use Bear as your CMS for one, or multiple static sites.

This allows you to create/organize/tag your content in Bear’s familiar UI, and when you’re ready, export and publish your content into the cloud (Git or S3).

Meaning you can stay focused on creating your content, and not worry about versioning, or how to get it to your blog in the right format.

How bearblogr (currently) works

See bearblogr - Installation and Usage Guide

bearblogr makes the process of creating and updating content on static sites as simple as possible by automating common tasks away.

bearblogr uses a few special embedded code blocks inside your note which are not natively supported by Bear, parses them, and automates the process of publishing your content in the right format.

This is the current workflow for writing and publishing a blog post using bearblogr:

  1. Write a new blog post in a Bear
  2. Add your custom frontmatter directly to the note
  3. Add bearblogr settings to the note
  4. Git settings
  5. S3 settings (optional)
  6. When you’re ready to publish, simply copy the note’s identifier in Bear to your clipboard and bearblogr will automatically parse your note for errors.

  1. Click “Markdown” to view/download the generated markdown files
  2. Click “Push to Git” or “Push to S3” depending on where you store your blog’s content. That’s it!

Updating a blog post is even easier. Simply make your changes in Bear and click “Update”.

If you have multiple blogs, you can create Bear notes to act as templates, so that most settings in steps 1-3 only need to be written once.

Since each note contains it’s individual configuration, there’s no more confusion about how or where to upload your content once you’re ready to publish.

Where to get bearblogr

Download the beta for macOS here

bearblogr was created to scratch my own personal itch.

No one asked me to create bearblogr, nor does Bear (Shiny Frog) or anyone else sponsor my work. It’s something I needed and really wanted, so I just built it.

I realize that the problems described in this post may or may not be the same problems that you might have.

But, if the problems I described resonate with you and you haven’t yet found a suitable solution, perhaps bearblogr is for you.

I’m hoping to build updated releases for the Bear and static site communities since they’ve been so kind and generous to me over the years.

How do I find out more about bearblogr releases?

Signup for my newsletter below, or simply follow this blog, and stay in touch on social media.

Activity on social media is the only way for me to know that people are interested and want bearblogger.

I would love to hear more from you about:

  • Is bearblogr something you would actually use?
  • What killer features are missing?
  • What other apps are similar, or are better at solving these problems?
  • What does your Bear blogging workflow look like? You can describe your own personal blogging platform if you don’t use static site generators.

Hit me up on Twitter @neooeevo!

Or, you heard about this on Reddit or somewhere else, post a message and let me know what you think!

Thanks for reading!

Cheers, Neo

Take the Red Pill

you stay in wonderland

And I show you, how deep the rabbit hole goes.

We'll never share your email with anyone else.
Liked this post? Subscribe! I've heard my newsletter is pretty cool.