BBQHeros
BBQHeros is een sociale webapp voor BBQ-liefhebbers: recepten loggen met foto's, ingrediënten en stappen, BBQ-momenten delen, YouTube-tutorials bewaren, militaire rangen verdienen en een persoonlijk kookboek bijhouden — gebouwd als installeerbare Progressive Web App.

Wie is BBQheros?
BBQHeros is een compleet sociaal platform waar BBQ-enthousiastelingen hun recepten, sessies en kennis vastleggen en delen. Gebruikers loggen recepten met foto, ingrediënten, bereidingsstappen, kooktijd, aantal personen en een persoonlijke sterrenwaardering. Daarnaast kunnen ze lichte BBQ-momenten posten (foto + tekst, zonder heel recept), YouTube-video’s delen als tutorials, en een persoonlijk logboek bijhouden voor losse aantekeningen zoals kerntemperaturen.
Het platform heeft een volgsysteem (“Collega chefs”) waarmee je de recepten en momenten van anderen in je feed ziet, een like-systeem, en de mogelijkheid om recepten van anderen op te slaan in je eigen kookboek (fork). Een gamificatie-laag met militaire BBQ-rangen (van Recruit tot BBQ General) en punten voor elk gelogd recept en moment houdt gebruikers gemotiveerd.
Een admin dashboard voor @designpixels.nl accounts biedt gebruikersbeheer: archiveren, herstellen, verwijderen en wachtwoorden resetten. Gebruikers kunnen zelf hun wachtwoord wijzigen en hun account verwijderen met bevestiging.
Wat hield de opdracht in?
De opdracht: bouw een besloten, sociale kookboek-app specifiek voor BBQ-liefhebbers. Het moest meer zijn dan alleen recepten opslaan — het moest een community-gevoel creëren met een stoere, donkere uitstraling die past bij de BBQ-cultuur. Gebruikers moesten recepten kunnen loggen met alle details, maar ook snel een BBQ-moment kunnen delen zonder verplichte ingrediëntenlijst. Een puntensysteem met rangen moest het loggen belonen en een speels competitie-element toevoegen.
Technisch moest het als een app op de telefoon te installeren zijn (PWA), snel laden, en werken met een gratis hosting-opzet via GitHub Pages. De backend moest schaalbaar zijn met row-level security zodat privérecepten echt privé blijven. Recepten moesten printbaar en mailbaar zijn voor offline gebruik.
Hoe is het resultaat geworden?
Het resultaat is een volwaardig sociaal platform dat aanvoelt als een native app: installeerbaar op telefoon en desktop, met offline caching, een donker thema met vlamaccenten en dikke typografie die de BBQ-sfeer ademt. De landingspagina trekt bezoekers met GSAP-animaties en een duidelijke feature-presentatie.
Onder de motorkap draait het op React 19, Vite, TypeScript en Tailwind CSS v4, met Supabase als backend voor authenticatie, database met row-level security, bestandsopslag en edge functions. E-mail (wachtwoordherstel, receptkaarten versturen) loopt via emailit.com. De app wordt gehost op GitHub Pages met automatische deploys via GitHub Actions — volledig gratis in gebruik.
Het platform biedt recepten met foto’s, ingrediënten, stappen en sterren, BBQ-momenten, YouTube-tutorials, een persoonlijk logboek, een volgsysteem, likes, een fork-functie, doorzoekbaar kookboek met sorteeropties, printbare recepten, en een compleet admin dashboard.
Sociale recepten-app
Progressive Web App
Rang- & puntensysteem
Andere chefs volgen
Recepten mailen en printen
BBQ-momenten loggen
Een blik op de gelanceerde website.
Drie momenten uit het eindresultaat — van homepage tot mobiele weergave.


