In the spirit of Daring Fireball and to fill a space between a social post or boost and a full blog post, I’ve created a new feature for Hearthside that allows me to share a link to a web page that I want to share along with some brief notes and, usually, a quote. It’s similar to social bookmarking, linklogs, content aggregators, etc. I curate a set of links I enjoy online, write up a little blurb about them, and publish to the new Linked section of my site.
How I built it
My Linklog is built around a Link model, which you might have guessed easily enough. I previously had a different app that I used to store a searchable history of articles I’d read and might want to be able to recall something about, hoping I’d eventually have a Memex-style personal knowledge base. That fell by the wayside, but I was able to salvage the schema for this feature. In addition to the “necessary” fields, the schema includes several things that I probably won’t ever expose, but which I figure I might find useful for myself at some point and which are neat to be able to capture using my Apple Shortcut.
Schema
UUID
A non-sequential, non-slug unique identifier that I use in the URL
URL
Link to the external page
Title
Initially the <title>
element of the page I’m storing, I usually end up removing some cruft like the name of the website or author before I hit publish
Highlight
When I run the shortcut to create a new Link, if something is highlighted on the page this will store that. It becomes a quote in the default content block for the Link. I can also tinker with the URL to include a text fragment to link to that specific text if I want to, but that’s not automated.
Author
Sometimes the shortcut can figure this out for me, other times I’ll fill it in myself.
Header Image URL
Not currently used, but the Shortcut attempts to find the most prominent image on the page and include a link to that in case I want to use it later.
Content
Starts empty, this is the HTML I display along the link on the listing and detail pages for the Linklog
Excerpt
Again, sometimes the Shortcut is able to populate this. I don’t currently use it.
Body and HTML
These are the Safari Reader version of the content in plaintext and the HTML of the page, respectively. I cache them for cases where the page’s content is no longer available or changes sufficiently that I’d rather serve up a cache of the content. It’s like having a poor substitute of an Internet Archive version of the page in my database. I’ll probably use these later on for search on my own site, but they really exist as an artifact of this coming from the Memex aspiration.
Location address, Latitude, and Longitude
Where was I when I saved this article? Probably not something I’ll ever publish but neat to have around. Again, Memex.
Published At
You’ll always want a time stamp instead of a Boolean, trust me. Once I’ve filled in the content of the Link, this timestamp gets touched and I order the Linklog based on this as well.
Apple Shortcut
The Apple Shortcut I use to bookmark links isn’t strictly necessary - it’d be easy enough to create these manually with a CRUD interface or to cook up some JavaScript Bookmarklet to save content via API, but I think it’s neat. It’s definitely a work in progress, but it is able to accept a page shared from Safari, grab a bunch of info about a Link-to-be from the URL and from Safari (which Shortcuts treats differently), and creates a Bookmark for me to visit later. It also grabs my current location You can take a look at it here if you’re so inclined, but it doesn’t include any of the server-side stuff you’d need to make it work.
Action Text
I’m currently using Action Text as a WYSIWYG editor so that I don’t need to edit a Markdown or HTML file and commit it to update the content. I’m pretty dissatisfied with using it, though. I’ve had trouble getting the attachments to upload, but more importantly the HTML it generates is wildly non-semantic. Rather than <p>
tags as you’d expect, you get a <div>
wrapper with repeated <br>
tags used to split paragraphs. I have also made assumptions in my CSS about the structure of articles that this doesn’t meet, so I’m in the market for an alternative to writing up the content of the Links. I’m definitely interested in suggestions for alternatives that are relatively easy to use and that generate semantic HTML, ideally with some level of customization.
Atom Feed
If you’re following this site via Atom (a feed format that is an alternative to RSS), you may notice that your reader of choice has a bunch of new entries. I’m including Linked articles in that feed now, as I see /atom.xml as the full feed for this site. Be forewarned that I may decide to add more stuff to it later, though I’ll avoid including completely superfluous entries like comments feeds or including a /now updates feed.
That said, you might want to have a lower-volume, higher-content feed that only includes articles, or you might not care that much about my TTRPG content and only want to see Programming content (or vice-versa). I have a solution for you!
I’ve split out Articles and Linked feeds that only include those types of content, and I also provide tag-, and series-specific feeds that you can subscribe to directly (for example, check out my Rebuild in the Open feed that includes articles like this one).
You can also mix-and-match feeds if you are so inclined. I’ve designed a simple URL scheme where you can combine tags, series, or types with commas to build up your desired mix of content. If you’re interested in all Linked posts, my Fake it ‘Til You Make It series from before I had a Rails site, and anything I tag with Swift, you could subscribe to this Atom feed.
As a side-note, performance for this endpoint is probably terrible. It’s got to join three different tables to be able to remove unpublished content and filter tags by slug and articles by series and include links or articles by their type. Wait until I finish my photo sharing feature. Luckily, feeds are probably only being fetched by your feed reader software, so there’s not a strong reason to spend time optimizing it unless it causes slowdowns for other requests. I’ll keep an eye out.
What do you think?
I’d love to hear what you think of the new section. Do you like how it functions? How it looks? Notice any issues?
I’m fairly satisfied with it as something I more or less banged out in a couple of evenings and some time on a weekend, but I’m sure it could use polish.
Let me know!