Adding PDFs to Your Webpage without JavaScript

/ / No Comments
Edited at 4:03PM to add a small note to the end. In my time at Adobe, one of the products I evangelized was the PDF Embed API, a JavaScript library for adding PDFs to a web page. I still recommend this library of course, but I was thinking this morning about how you could get similar results without JavaScript. Remember, you are allowed to build a web page and not ship any JavaScript. It’s ok, I won’t tell. Before looking at what I built, some context to why someone would use a library like Adobe’s PDF Embed: Browser’s have great built-in PDF support, natively, but the display is typically the entire page, which means you lose the context of the rest of your site. There’s... more →
Posted in: JavaScript Tagged with: , , , ,

Adding Translation with a Web Component and Chrome AI

/ / No Comments
A few days ago, I blogged about using Chrome’s built-in generative AI features (which are still super duper too early to even consider for production) to add on-device translation capabilities to a web app. It got me thinking, what if we could do translation automatically via a web component? If for some reason it failed, that would be fine as the original text would still be there, but in cases where it could work, it would be automatic. Here’s what I built. First, I whipped up a quick HTML demo of the text I’d like translated: <translate-text>Congress shall make no law respecting an establishment of religion, or prohibiting the free exercise thereof; or abridging the... more →
Posted in: JavaScript Tagged with: , , ,

Adding AI Insights to Data with Google Gemini

/ / No Comments
Yesterday, Elizabeth Siegle, a developer advocate for CLoudflare, showed off a really freaking cool demo making use of Cloudflare’s Workers AI support. Her demo made use of WNBA stats to create a beautiful dashboard that’s then enhanced with AI. You can find the demo here: https://wnba-analytics-ai-insights.streamlit.app/ I found this incredibly exciting. I last looked at Cloudflare’s AI stuff almost an entire year ago ("Using Cloudflare’s AI Workers to Add Translations to PDFs"), and I haven’t quite had a chance to try it again, mostly because I’ve been focused on Google Gemini for my Generative AI work. From an API/usage perspective, Cloudflare’s... more →
Posted in: JavaScript Tagged with: , , , ,

Adding Your Buttondown Email Stats to Your Website

/ / No Comments
I’ve been using Buttondown for almost a full year now (I blogged about the setup here). After having a few issues with Mailchimp and my newsletter, I was pleasantly surprised by how easy Buttondown was and how quick it was to set up. I ended up paying for it as I knew I’d end up paying for some solution and Buttondown worked great and wasn’t expensive. For a while now, I’ve had a custom-built stats page on my blog that’s primarily built for me. It reports on multiple different parts of my site and its biggest use is to let me quickly judge how well I’m keeping to my publishing schedule (a post a week). One stat it didn’t have that I’ve been checking... more →
Posted in: JavaScript Tagged with: , , , ,

Adding Recommendations to my Blog with Algolia

/ / No Comments
I’ve been using Algolia for my site’s search functionality for a few years now and it works great, especially once the free tier expanded to cover the size of my content somewhat better. In that time, I’ve mainly just stuck to basic search functionality and haven’t really touched any of the more advanced features. This weekend I took a look at one I’ve been meaning to play with for some time, Recommendations. My thinking was, of course, a way to recommend/suggest content related to the current blog post you may be reading. This distinction is important because as I looked at the Recommendations marketing and documentation, the content is heavily focused on product... more →
Posted in: JavaScript Tagged with: , , ,

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

/ / No Comments
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 Tagged with: , , , ,

Adding URL Parameters to an Interactive Map

/ / No Comments
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 Tagged with: , ,

Adding Music Previews to My Now Page

/ / No Comments
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 Tagged with: , , ,
1 2