Bookmarking application with Sanity + 11ty + Netlify

This bookmarking application uses 11ty for the frontend, Sanity as a repository for bookmarks (and a newsletter), and Netlify Functions to save bookmarks.

By Bryan Robinson

Project Shots

The HTML output of a newsletter then gets put into ConvertKit and sent as a newsletter

Screenshot of part of the iOS shortcut setup

Editing environment

Bookmarks are saved to a studio, under a bookmark type

Bookmarks can be added to a newsletter via an array of references

About the project

Originally built for a demo on Smashing Magazine of using FaunaDB to store JAMstack data, I recently rebuilt this project to use Sanity as my database of choice.

It uses a Netlify serverless function to take a URL and scrape the metadata for Title and Description. Those items – and the URL – are then saved to Sanity's data store. To push the URL to the serverless function, I use an iOS shortcut in my "Share sheet" for my phone and a Chrome bookmarklet for my desktop.

The bookmarks are then displayed on an 11ty site at a subdomain of my personal site.

I then added functionality for creating a newsletter to send weekly. The email body text is Portable Text and then an array of bookmarks are added. Currently 11ty builds the HTML for the email and I copy and paste into ConvertKit for my email. In the future, I plan on creating a custom preview that displays the HTML I need to copy into ConvertKit.

Contributor

Bryan Robinson

Sr. DevRel @ Algolia