Skip to content
View project liveShare your own project

Flavours of the Tour

Collection of Tour de France recipes curated by Eurosport commentator Jonathan Harris-Bass.

Project Shots

Map of France and Italy with regional recipes scattered across the map
Detail view of the daily Tour de France recipe by Eurosport commentator Jonathan Harris-Bass

Editing environment

During each of the 21 days of bike racing at the Tour de France, Eurosport commentator Jonathan Harris-Bass shares a recipe that nods to the region the riders are biking through on that day. These recipes are the website's raison d'être and therefore feature as the main content in Sanity Studio. Since each recipe is scoped both geographically and chronologically, the recipe schema includes references to race 'stage' documents, which comprise day and location data. The recipe-race day references allow me to place the recipe nodes across the map.

About the project

During each of the 21 days of racing at the Tour de France, the riders traverse a different part of France or visiting countries. Each day, also, a Eurosport commentator Jonathan Harris-Bass (@jhbfoodiecyclist) comes on air during the early stages of the broadcast and runs us through the plat du jour, which nods to the region the riders are zooming across at breakneck speeds.

I'm a big fan of cycling, as well as food, so, for this year's edition of the Tour de France, I decided to collect Jonathan's recipes on a website, both as a tribute to his work and as a way for me to quickly access the recipes and share them with friends.

In it's current state the site and its data have a fairly limited scope—a single race parcours through Italy and France, consisting of 21 days of racing with 21 corresponding location data and recipe documents. My ambition, however, is to turn this into a long-term project and create new maps for future as well as previous editions of the race.

The biggest challenge arising from the growing pool of data is how to organize it. To tackle this challenge, I am using the Structure Tool API to group both race day and recipe data by year in the document list view. Once the year information for a given recipe is locked in, the list of possible recipe-to-race-day references is constrained for that year. This approach ensures a great editing experience and future-proofs the project from a content perspective.

Each year, the race parcours of the Tour is released months ahead of the race, allowing me to author 21 race day documents for the given year. Then, during each day of the ongoing race, when Jonathan releases a new recipe, I can input the recipe content and link it to one of the 21 available race day documents for that year's edition of the race. Upon publishing a new recipe, a Vercel integration webhook runs and the Next.js site is redeployed with the latest content featuring on the map.

I don't use Sanity on the daily basis so I initially struggled with making deep customizations to the Studio, but I found that with enough of an understanding of the different Sanity tools, plugins and APIs, I could make great use of ChatGPT in writing the necessary code. Hopefully, this is only the beginning of a long-term hobby project so I cannot wait to make even greater use of Sanity's awesome tools in the future!