Ep. 5: 11ty Serverless Search and the Data Cascade

For December, we have Bryan Robinson showing us how to use 11ty Serverless for search functionality and Ben Myers diving deep into the Data Cascade.

Using 11ty Serverless to create serverless search

Progressive enhancement is an important topic when creating any web site or app. What happens when a user’s browser isn’t able to handle any JavaScript or the specific JavaScript you’re using? If your front end fails, you need a fallback to allow basic functionality to keep working.

What’s so hard about that?

When you’re working in the Jamstack, that can be harder than traditional stacks. No server means no server rendering. Sure you can use serverless functions, but then you have to recreate your frontend and don’t have any of the benefits of your static site generator’s templates… Or at least, you DIDN’T!

With 11ty Serverless, we can create a fully server-rendered search page using all the same templates and syntax with love with 11ty. No additional codebase; no additional template languages; no adapting your lovely liquid into terrible template literals (alliteration only, I love template literals, but you get the point!). Install the 11ty Serverless plugin, get request-time information, and pass that information into an 11ty filter to get customized data for a search page. No frontend JS required.

Bryan Robinson (He/Him) Website Twitter

Bryan is a designer and developer with 15 years of experience building experiences and leading teams on the web. He writes and records about HTML, CSS, the power of static sites (11ty, amirite?!) and good, clean design.

Journey to the Center of the Data Cascade

Data is integral to Eleventy sites, and the data cascade is a powerful tool for architecting your site — and yet, it might not always be clear where to put your data, and the relationship that data has to other data in your project. In this talk, we'll go step by step through the data cascade, from global data all the way through to template front matter and computed data, exploring real-world practical use cases for each step!

Ben Myers (they/he) Website Mastodon

Ben Myers is a frontend developer and accessibility advocate, currently building Microsoft's developer documentation platform Microsoft Learn. Additionally, Ben blogs about accessibility and more at benmyers.dev. Previously, they hosted Some Antics, a Twitch show where guests from around web development and web design joined to demonstrate how to build great user experiences for the web in a hands-on way, with a focus on accessibility and/or core web technologies.