Adding a Guestbook to Your Jamstack Site (Yes, Seriously)

Don’t do this. I’m serious. Or do it, I certainly don’t listen to reason when it comes to building demos. I’ve been in web development for a very, very long time, and I’ve seen many trends come and go. Guestbooks were a way for folks to leave a comment on your site as a whole. I haven’t seen one in ages, but some still linger. In fact, Ana Rodrigues has an absolutely lovely guestbook driven by Webmentions. And if you really want to, you can still download a Perl CGI guestbook over at Matt’s Script Archive. I haven’t written Perl in decades, but I absolutely loved it back in the 90s. That being said, I had a free hour yesterday, was bored, and decided,... more →
Posted in: JavaScript

Adding URL Parameters to an Interactive Map

It’s Saturday so I have decided to give myself a 30 minute break. Today I will only be spending ½ an hour on the One Hour AI Map Challenge. In these 30 minutes I want to create URL parameters for Meet in the Middle which will allow us to replace the Google Maps link for shared meeting points with a link back to our own map.Prompt No.1:how can i add url parameters to a leaflet.js map to show Maps Mania… more →
Posted in: Interactive Maps

Adding Music Previews to My Now Page

About two months or so ago I added a Now page to my site. It shows my current reading list, my last watched movies, my Untappd beer check-ins, and my most recent Spotify tracks. You can see that part here: When I built it, I used a Pipedream workflow to wrap calls to Spotify’s API. My Pipedream workflow gets my most recent tracks, slims down the data quite a bit, and returns just what I need. I use some client-side code to hit that endpoint and then render it out on the Now page. (I also use a bit of caching with LocalStorage such that the endpoint is only hit every ten minutes.) Currently, when rendering each track, I link to its URL and Spotify users can listen to the track completely.... more →
Posted in: JavaScript

Adding Simple Routing to Cloudflare Workers

I’ve been "playing" with serverless for years now, but honestly still feel new to it. When it comes to organization in a project that uses serverless functions, I’ve typically tried to build one function per operation. So for example, if I had a need to get a list of cats, I’d have one function. If I had a need to get information about a cat based on an identifier, I’d probably build a second one. That being said, I recently came across an example Cloudflare function that did something cool – it used a router, specifically the very lightweight itty-router. Let me share an example of how it works. What is a Router? # So I kinda assume most folks know what... more →
Posted in: JavaScript

Adding Caching to a Cloudflare Worker

Last week I blogged about my first experience building a Cloudflare Worker serverless function. In that post, I built a simple serverless function that wrapped calls to the Pirate Weather API, a free and simple-to-use API for getting weather information. For today’s post, I thought I’d show how easy it is to add a bit of caching to the worker to help improve its performance. As with my last post, I’ve also got a video walkthrough of everything you watch instead. (Or read and watch, go crazy!) The Application # In the last post, I shared the complete code of the Worker, but let me share it again: // Lafayette, LAconst LAT = 30.22;const LNG = -92.02;export default { async fetch(request,... more →
Posted in: JavaScript

Adding Form Participation Support to Web Components

Many years ago when the web platform began to really improve, when everything was "HTML5 this" and "HTML5 that", I remember being particularly excited by the updates to forms. I started my web career doing a lot of form processing and have always thought it was one of the more important aspects of the platform. Anything that improved that was a good thing. In my explorations of web components, I was ecstatic to discover that web components can be participants in forms. So what do we mean by that? What’s a Form Field? # Form fields have a number of different features, including: Including a name and value as part of the overall form. This is the bare minimum thing a... more →
Posted in: JavaScript

Adding Download Support in an Eleventy Site

I was thinking recently about how I would add "Downloads" support to an Eleventy site. By that I mean, a site where you have various resources (PDFs, zip, etc) and want to provide a way to let users download them in a consistent manner, as well as how basic tracking could be done as well. I came up with a few ideas I’d like to share, but as always, please let me know what you’ve done and what you would suggest. Method 1 – Meta Refresh For my first attempt, I imagined a site where I’ve got some files up in S3 (like I do for my images here) and I’d like to take a directory and set them up as resources. So for example, imagine a _data file named downloads.json: {... more →
Posted in: JavaScript
1 2