c2bk Infrastructure Report: Hearts

If you're like me, this site has become your primary social network. Whether it's the hours you've spent arguing in the comments section, the days poring through the archives looking for hidden gems, or even those few minutes on the about page trying to answer the question, "Why is this here?" you've come to expect the best and are often delighted beyond expectation. Yes, all of these things are true, and more.

So I was perplexed the other day by an exchange I had with a friend. My online buddy casually messaged, "What do you use for your blog?" I typed back, "Why, PHP and MySQL, my good friend!" He responded, "You wrote your own thing?" I said, "Indeed! Would you like the code?" His final reply was like a punch in the gut: "No one has time for that. I'll use Medium."

No one has time for that. I'll use Medium.

Let that sink in. I knew in my heart that couldn't be true. What does Medium have that onfocus hasn't? And then it hit me like a second, more forceful punch in the gut: hearts. Medium has hearts.

I didn't get mad. I started building. And as of today, onfocus has hearts. At the bottom of every post is the option to click a heart symbol. What does clicking the heart symbol do? It fills in the heart so that it goes from being the outline of a heart to a solid heart. What does clicking the heart symbol mean? That's a question that each onfocus reader must answer for themselves.

I expect this feature to become the very pulse of this site, driving the blood (data) filled with rich oxygen to the vital organs (server) and then carrying it (clicks) away to the liver (apache logs) for detoxification (pageviews).

Who has time for what now?

c2bk Infrastructure Report

Infrastructure updates to this blog continue apaceish:
  • HTTPS1 on at all times
  • Emoji everywhere
  • Friendlier URLs for posts with slugs
  • CSS now SASS-y
  • Super modern git and CDN deploy process with a bash script
  • Cutting edge access reports with analog
  • Most recent CodeMirror for textarea while composing posts
  • Deferred loading of video embeds
  • Bug fixes and performance improvements

And for fun here are the services I use for this site:
I still feel more couch than blogK at this point, but ticking off items that have been on my to-do list since the early part of this century feels good.

1 Proper pronunciation?
2 The hovering businessman emoji's ska roots.

c2bK: Comment Emojification

As part of my Couch to BlogK program (c2bK), I'm making some infrastructure improvements around here. This blog uses some home-rolled PHP, a handful of Perl scripts for snagging photos from other services, and love. I figured suffering the slings and arrows of a public commenting system would help me stay on task, but my old commenting system felt a bit dated. I knew there was only one thing that could bring my weblog comments into the Slack millennium: emoji.

I don't have research to back it up, but I'm fairly certain that kids these days don't even use text. They share pictures and write elaborate encoded messages with a set of pictograms that communicate with more verve than the stolid word. Who am I to fight against a tide of verve?

Once the decision was made, I thought it was just a matter of making sure my database was using a character set that could handle emojis and I'd be off to the races. Iñtërnâtiônàližætiøn is a solved problem! UTF-8 has solved everything! Well...

Using emoji on your phone is easy. Using emoji on your desktop is not as easy. And even though I'm bringing this website up-to-date for the kids who might not even know what a desktop is, I'd like our elders to be able to participate in the fun. Building my own emoji-selection contraption felt like a tall order, but I google stumbled on wdt-emoji-bundle by Nedim Arabacı which did most of the heavy lifting for me. He was inspired by the Slack emoji picker which translates emoji into a colon-delimited short name that can mingle easily with text.

That led me to Slack's own Cal Handerson's project emoji-data that is the rosetta stone of emoji. You see, different device manufacturers use different codepoints to represent the same glyph. So even if you're storing the incoming emoji characters correctly, not everyone would be able to see, for example, Down-Pointing Red Triangle on the other end. emoji-data does the work of saying that Android's arrow is here, Apple's arrow is there, and you don't need to just give up on people being able to emoji together.

(This doesn't even touch on the problem of different visual implementations across different emoji sets.)

Instead of storing the universal emoji characters, I opted to store the short name as plain text and then do a bit of translating on the other end. Another of Cal Henderson's projects, php-emoji made it easy for me to write some quick translation functions and then I really was off to the races! (No, I don't have emoji implemented for posts yet.)

Long story short: emojis are hard, this hand-coded blog now has a comment system with a Slack style emoji menu, support for emoji short code text, and a bridge to interface with the Snapchat generation thanks to folks like Cal and Nedim sharing some of their work in public.

And all of that means I'm on my way to blogK.

Couch to BlogK

What if I started blogging again? I used to enjoy putting words in an order specific to clearly convey ideas in a public setting. So my blog voice is rusty. That's why I need a program to help get me off the couch to go get my laptop and then back to the couch where I can craft content for the open Web. (Did we stop capitalizing Web?)

What do I have to lose? The blogosphere is a burned-out, empty forest with a few giant redwoods that survived that great social media blaze of the mid 2000s. I know the score. I have Google Analytics running here. It's just me and those few bots that know how to trick Google Analytics into thinking they're legitimate traffic. Come with me, clever bots, while I reclaim my corner of the blogosphere!

This program will consist of a forced writing regimin.