Skip to main content

Official 11ty docs

Remote Data

Fetch — Eleventy

87 posts in 'Remote Data'

Building pages from data in Eleventy

I've expanded the media sections I already had built to include pages generated from data using Eleventy.

Categories: Data CascadeHow to...Remote Data

Keeping Out Dark Visitors

One short data file and one tiny template to block all AI scrapers and crawlers.

Categories: How to...PermalinksRemote Data

Leveraging APIs like Notion with a nice caching system

How I implemented Notion and PSN APIs in my Eleventy build for my Now and Gaming pages

Categories: How to...MarkdownNow PageRemote Data

Surfing The Web And Sharing What I Find

How I surf the web, manage my online bookmarks and share exciting hyperlinks with the community.

Categories: CollectionsHow to...PaginationRemote DataRSS

Building a Live Preview with Eleventy, Contentful, and Liquid Templating

As a part of the marketing team at Heyflow, I collaborate with people who work on the company’s website. Although all team members are technically acquainted, sometimes they struggle to update the website. The struggle is not being able to visualize what will change on the page when updating the content. Saving the updates and […]

Categories: CMSHow to...NetlifyRemote DataServerless

Building My Comics Page

How I built my comics page using League of Comic Geeks, a NodeJS module and Eleventy.

Categories: How to...Remote Data

Weaving music data in and out of my personal website

I started integrating music data into my personal website when I added Last.fm artist and album displays to my now page. Initially, I tried sourcing artist images from a few different services, knowing that Last.fm had updated their API to stop serving them. After a fair bit of searching I found that most services that supplied artist images covered only a small fraction of my library and often supplied the wrong image when there were multiple artists sharing the same name.

Categories: How to...Now PageRemote Data

Using Eleventy to Gobble Up Everything I Do Online

A blog post about how my site works based on a talk I did at the Eleventy meetup

Categories: BloggingGlobal DataHow to...Remote DataSocial Media

Building a bespoke now-playing web component

I've long had a now playing element on the home page of my site that displays either what I've checked into on Trakt, the Lakers' record and who they're playing when a game is on or the last song I've listened to. After leveraging some new web components on my site, I decided to refactor the code powering this into a web component specific to my needs.

Categories: Remote DataHow to...Now Page

Using B2 as a JSON data store

My links page is powered by the Readwise Reader API but because there are, quite reasonably, rate limits in place, I've gone ahead and reduced the page count I fetch on each build and cached older link data from past builds in a B2 bucket.

Categories: Data CascadeGlobal DataHow to...Remote Data

Eleventy - Fetch data from the Github REST API to populate a projects page

We will populate a page with data from GitHub. We will use the eleventy-fetch plugin to do this with minimal code and refresh the data every 2 days.

Categories: FiltersGlobal DataLayoutsRemote Data

Track and display uptime of your blog

This article is about: How you can track and display the uptime of your eleventy-page using Uptime Kuma

Categories: DeploymentHow to...PerformanceRemote Data

addRemoteData

An Eleventy plugin for fetching remote data and exposing the response as a global data variable.

Categories: PluginsRemote Data

Cloudflare Pages Cron Deploys

Scheduling static site deploys daily

Categories: BloggingDeploymentRemote DataWebmentions

How I use Readwise Reader to post and share links.

Categories: BloggingHow to...Remote Data

Building robots.txt from a simple API endpoint

The online journal of Ashur Cabrera.

Categories: ConfigurationHow to...Remote Data

LastFM Recently Played with Eleventy

How I'm using Eleventy Fetch to display my recently played tracks from LastFM.

Categories: How to...Remote Data

Adding a GitHub Repository List to an Eleventy Site (part 2)

An extension of the previous post that shows how to add a list of GitHub repositories to this site using authenticated access to the GitHub REST API.

Categories: How to...Remote Data

Adding a GitHub Repository List to an Eleventy Site

I decided to add a list of GitHub repositories to this site; not because the site needs it, but because I wanted to learn how to do it. I built a quick and easy approach (with limitations) and this post describes how I did it.

Categories: How to...Remote Data

Programmatically importing your Last.fm listening data to ListenBrainz

I love Last.fm, but in the interest of redundancy, Ive started programmatically importing my listening data from Last.fm into ListenBrainz.

Categories: Data CascadeGlobal DataHow to...Remote Data

Adding Music Previews to My Now Page

How I added a simple audio preview to my recent Spotify tracks.

Categories: How to...Remote Data

DoubleShift

A small idea to check how many actors have been in both Scrubs and Grey's Anatomy turned into a much bigger thing

Categories: How to...Remote Data

How I'm using the Fathom API to show a list of popular blogs posts in my Eleventy site

Categories: Data CascadeFiltersHow to...Remote Data

Generating the Firehose page on the 11tybundle site

Here's how the Firehose page of the 11tybundle.dev site is built.

Categories: CollectionsHow to...Remote Data

Excluding Livestreams from the YouTube Data API in JavaScript

The YouTube API doesn't exclude past livestream videos from a playlist on its own. Here's how I filtered them.

Categories: How to...Remote DataYouTube

Making a privacy respecting hit counter with Plausible analytics

Adding a hit counter with Plausible is private and quick using their aggregate API

Categories: How to...Remote Data

Hacking together a Tweekly.fm replacement

I mused the other day about wanting a replacement for Tweekly.fm which shut down due to Twitter's API changes and restrictions. In my case, the aim would be to make this compatible with Mastodon since that's where I've found myself spending the most time recently.

Categories: How to...Remote Data

Using Wordpress as a headless CMS for Eleventy

How I avoided having to re-learn PHP and love Eleventy.

Categories: CMSGlobal DataNavigationPaginationRemote DataSearch

Scratch that...use the Google Sheets API

Just generating a json file from Google Sheets was not good enough. I had to use the API.

Categories: Data CascadeGlobal DataNetlifyRemote Data

Build a Blogroll with Eleventy

A step-by-step guide to adding a blogroll, complete with each blog's latest posts, to your Eleventy site.

Categories: Data CascadeRemote DataHow to...ConfigurationBlogging

Now page: grouping episodes of the same tv show

I made a minor update to how I'm normalizing TV data for display on my now page.

Categories: Remote DataHow to...Now Page

Webmentions in Eleventy

There comes a time in every Eleventy blog's life where the author must write a post about implementing webmentions. Here is mine.

Categories: How to...Remote DataWebmentions

Website rewrite and switching to Notion as CMS

This website served me well for almost 5 years with minor improvements, tweaks and hacks. Now, it was time for a total rewrite and upgrading my stack and tools.

Categories: Remote DataHow to...

How I built my Now page

YouTube video

Categories: How to...Remote DataYouTube

Pulling WordPress Post Categories & Tags Into Eleventy

Step by step guide to gathering post categories and tags from the WordPress REST API for better filtering and discoverability in an Eleventy blog.

Categories: Remote DataHow to...

Now Page: Automatically Syncing My Now Pages

How I automatically sync my now page with omg.lol

Categories: How to...Remote DataNow Page

I took some time last week to build out a popular posts widget after seeing Zach's implementation using Google Analytics.

Categories: Remote DataHow to...

Now page update: poster art for shows and movies

Combine multiple API calls and eleventy-fetch to enrich Trakt metadata with poster art.

Categories: Remote DataHow to...

Displaying listening data from Apple Music using MusicKit.js

Up until now my now page has sourced music data from Last.fm (and may well again). But, in the interest in experimenting a bit, I've tried my hand at rewriting that part of the page to leverage data from Apple Music, using MusicKit.js instead.

Categories: Remote DataHow to...

Adding game cover art to my /now page

How I'm using Eleventy-Fetch and the Steam API to fetch recently played games, the games cover art and store page URL to display on my /now page.

Categories: ImagesRemote DataHow to...Now Page

From ICS to JSON: surfacing anticipated albums

I use MusicHarbor by Marcos Tanaka to track upcoming albums from my favorite artists (typically by syncing my last.fm data with the app.) When I see something new that I want to add to my collection I throw it on a calendar creatively titled Albums.

Categories: Remote DataHow to...

Using Goodreads Data in Eleventy - Update

A followup to my previous article on Goodreads and Eleventy

Categories: Remote DataHow to...

Using Goodreads Data in Eleventy

An example of using exported Goodreads data in an Eleventy site.

Categories: Remote DataHow to...

Eleventy Displaying Posts from Another Site

I wanted to pull the most recent articles from an Eleventy site into another Eleventy site, so I wrote this article to explain how I did it.

Categories: How to...Remote Data

I hooked up Eleventy to WordPress API

I’ve got some plans for this site. The main thing I want to do is bring my music collection into my main site, instead of having a subdomain. That thing has been a “prototype” for over 2 years now… The problem is that site uses Notion as its data source. I really like managing my […]

Categories: Remote DataHow to...

Fetching & caching data from Airtable in my 11ty site

Using the Airtable.js library and Eleventy Fetch

Categories: Remote DataHow to...

Building and Automating My Now Page

How I built and automated my now page with Eleventy and APIs.

Categories: How to...Remote DataNow Page

Syncing Letterboxd Data to Markdown Files

Owning my Letterboxd data.

Categories: Remote Data

Building my /now page using Eleventy

As part of my commitment to writing about things I've written in other frameworks in Eleventy, this is how I re-engineered my /now page in Eleventy.

Categories: Remote DataNow Page

CAUTION

The posts below were published before the release of Eleventy v2.0.0 (Feb 8, 2023). Information in these posts may be out of date. The current stable release is 2.0.1. Eleventy v3.0 is currently under development and available for testing.

Using the Airtable API with Eleventy Collections

A detailed guide to building a reading list with the Airtable API and templated Eleventy data. Includes general guidance regarding personal access tokens and environment variables, relevant to most API projects.

Categories: Remote DataCollections

Pulling WordPress Content into Eleventy

Composable Architecture Powered by WordPress part 2 – How to pull content from a WordPress RESTful API into an Eleventy generated static site.

Categories: Remote Data

Using Airtable as a Jamstack CMS

Using the Airtable hybrid spreadsheet-database app as a CMS "back-end" for a personal portfolio Jamstack website.

Categories: Remote Data

From Notion to Eleventy

Mostly frontend, sometimes art

Categories: Remote Data

A truly fetching utility for Eleventy

While trying to make things work equally well in multiple repos, I discover the value of an Eleventy plugin I’d previously ignored.

Categories: Remote DataHow to...

Bringing your Notion database to life with Eleventy

How and why I combine Notion and Eleventy (11ty) to render my weekly feed stats on my website.

Categories: Remote Data

From Notion to Eleventy part 2: Building Markdown from JSON

The ramblings of Ryan Boone, a web developer and designer from Texas with a passion for open, accessible front end development.

Categories: How to...Remote Data

Including RSS Content in your Eleventy Site - Part 2

A follow up to my post on using RSS data with Eleventy sites

Categories: How to...Remote DataRSS

Including RSS Content in your Eleventy Site

A quick example of using RSS content for an Eleventy page.

Categories: Remote DataHow to...RSS

From Notion to Eleventy part 1: The Notion API

The ramblings of Ryan Boone, a web developer and designer from Texas with a passion for open, accessible front end development.

Categories: How to...Remote Data

Notes Section: From Notion To Eleventy

How to write notes on Notion and publish with Eleventy

Categories: Remote DataHow to...

A Google Static Maps Eleventy Plugin

A simple Eleventy plugin to support Google Static Maps

Categories: How to...Remote Data

Using a Google Photos Album in your Eleventy Site with Pipedream

Integrating a Google Photos Album in your Eleventy site with Pipedream

Categories: ImagesHow to...Remote DataImage Galleries

Fetching remote images with Eleventy

Following up on last month’s article about doing this in Hugo, we explain how to get there in a JavaScript-based SSG.

Categories: ImagesRemote Data

CAUTION

The posts below were published before the release of Eleventy v1.0.0 (Jan 9, 2022). Information in these posts may be out of date. The current stable release is 2.0.1. Eleventy v3.0 is currently under development and available for testing.

A Running Log - Garmin Connect and Eleventy

Use Eleventy to log Garmin Connect activities on a website and automate the process with Zapier and Netlify.

Categories: Data CascadeHow to...Remote Data

Page Level URL Fetching with Eleventy

Making a network request on a page with Eleventy

Categories: How to...Remote DataFront MatterGlobal Data

Blog post filter with Netlify Functions

I built my first ever serverless feature to add tag filtering to my blog listing. Here's how I integrated that to my Ghost & Eleventy setup with Netlify Functions.

Categories: FiltersHow to...ServerlessRemote Data

Making an 11ty collection from a remote XML file

RSS is XML with a specification, however not all RSS feeds follow the spec. In this post, we process the feed as an XML document meaning we can access the extra attributes and values

Categories: CollectionsHow to...Remote Data

Integrating Eleventy with GitHub Flat Data

How to use the Flat Data GitHub action with Eleventy

Categories: Remote Data

Create an 11ty collection from any RSS feed

Using 11ty global data files, we create an 11ty collection from an RSS feed. As an example, we show the latest YouTube videos on our website

Categories: Remote DataCollectionsHow to...RSS

Notion API with 11ty

How to use the Notion API in 11ty

Categories: Remote Data

Using PDFs with the Jamstack - Now with Thumbnails

Combing Adobe PDF APIs with Eleventy to create PDF Thumbnails

Categories: How to...Remote DataPagination

Accessing Eleventy Data on the Client Side

Accessing Eleventy data files in your JavaScript code

Categories: Global DataRemote DataHow to...Front Matter

Using Airtable with Eleventy

A long-winded look at getting Airtable data into Eleventy.

Categories: Remote DataHow to...Global Data

Adding Google Calendar to Your Jamstack - with Pipedream

An updated demonstration of integration calendar data into your Jamstack site - with Pipedream

Categories: Remote DataHow to...

Hooking Up FaunaDB to Eleventy

Father, husband, developer relations and web standards expert, and cat demo builder.

Categories: Remote DataHow to...Pagination

Have a set of frequently referenced links? A global data file can come in handy.

Categories: Remote DataGlobal DataData Cascade

Migrating from Node and Express to the Jamstack - Part 3

Father, husband, developer relations and web standards expert, and cat demo builder.

Categories: Migrating to EleventyServerlessHow to...Remote Data

Performant data fetching with promises and Eleventy

Fetching a whole bunch of data from APIs at build time can be an intensive process. Getting that data in a performant way and caching it locally is an important part of Jamstack projects.

Categories: Remote Data

Integrating Google Analytics with Eleventy

How to use Google Analytics with Eleventy

Categories: How to...Remote Data

Integrating Netlify Analytics and Eleventy

How to use Netlify's Analytics API in Eleventy

Categories: How to...Remote Data

Creating an Editable Site with Google Sheets and Eleventy

Remember Tabletop.js? We just covered it a little bit ago in this same exact context: building editable websites. It’s a tool that turns a Google Sheet into

Categories: How to...Remote Data

Get the blog by email (or RSS)

Powered by Buttondown