Van rommelige Excel-sheets naar een strakke kantinedienst-app in twee avonden
Een lokale hockeyclub verving hun onoverzichtelijke Excel-bestanden door een op maat gemaakte webapp. Met Lovable en Supabase bouwde de vrijwilligerscoördinator zonder programmeerervaring een werkend platform.
Ruben Klaver
Bijdrager · lvbl.nl
De eerste stappen in Lovable
Via de bouwerscommunity kwam de coördinator uit bij Lovable. Met het idee dat AI het zware programmeerwerk kon overnemen, begon het experiment met een prototype. Het doel was vanaf het begin heel helder afgekaderd: een simpele, overzichtelijke webapp waarin leden kunnen inloggen, hun toegewezen diensten zien en eventueel een ruilverzoek kunnen indienen bij een ander clublid. In plaats van direct een ingewikkeld platform met tientallen functies te eisen, begon het proces bij de absolute basis. Lovable kreeg de opdracht om een strak dashboard te genereren met een kalenderoverzicht, een lijst met openstaande diensten en een overzichtelijke profielpagina voor het lid.
Van visueel ontwerp naar functionaliteit
Binnen enkele minuten stond de visuele basis van de interface klaar. Lovable genereert de volledige layout en onderliggende componenten direct in de browser. Een kantine-app heeft echter live gegevens nodig: wanneer iemand een dienst overneemt van een ander lid, moet die verandering meteen zichtbaar zijn voor het hele team. Hier kwam de integratie met Supabase om de hoek kijken. Via de ingebouwde koppeling in Lovable werd een database opgezet voor de gebruikers, het dienstenrooster en de actieve ruilverzoeken. Met eenvoudige, beschrijvende Nederlandse instructies legde de coördinator aan Lovable uit hoe de verschillende tabellen met elkaar moesten communiceren.
Slimme logica toevoegen
Het opzetten van de logica achter de schermen bleek verrassend soepel te verlopen. Denk hierbij aan specifieke regels zoals: een lid mag alleen een dienst ruilen met iemand uit dezelfde leeftijdscategorie, of een bevestigde ruil moet automatisch de status van het rooster bijwerken. Alle gewenste functies werden stap voor stap in de chatinterface omschreven. Wanneer de gegenereerde code een fout vertoonde bij het afhandelen van de statuswijzigingen, werd bijgestuurd door de exacte logica opnieuw uit te leggen en Lovable de code te laten herstellen. Binnen twee avonden stond er een volledig werkend prototype dat gereed was voor een praktijktest.
Feedback verwerken uit de praktijk
Tijdens de eerste testfase met een klein team kwamen er praktische verbeterpunten naar boven die vooraf niet waren voorzien. Sommige oudere leden vonden de knoppen op hun mobiele telefoon aan de kleine kant, en het proces om een ruilverzoek te bevestigen bleek in de eerste versie wat onduidelijk. Dit is precies waar een AI-builder zijn waarde bewijst. In plaats van urenlang handmatig CSS aan te passen of functies te herschrijven, kon de ontvangen feedback direct als nieuwe opdracht worden ingevoerd. Na een paar snelle iteraties waren de knoppen groter, was de navigatie logischer ingericht en werkte de applicatie uitstekend op zowel telefoons als desktopcomputers.
Het resultaat op de club
De applicatie is inmiddels officieel in gebruik genomen voor het lopende seizoen. Leden krijgen nu enkele dagen voor hun geplande dienst een automatische herinnering via de app. Als iemand onverhoopt niet kan, regelt het systeem de ruilvraag direct met een reserve. Het bestuur beschikt over een beheerderspaneel waarin in één oogopslag te zien is welke diensten nog openstaan. De hoeveelheid gemiste diensten is drastisch afgenomen en de communicatie binnen de club verloopt een stuk rustiger. Wat voorheen een tijdsintensieve, wekelijkse klus was, draait nu grotendeels op de achtergrond.
Wat deze case ons leert
Het succes van deze applicatie zit niet in extreme technische complexiteit, maar in het gericht oplossen van een alledaags, praktisch probleem. Veel mensen die beginnen met tools zoals Lovable denken dat ze meteen een gigantisch SaaS-platform moeten neerzetten, maar de echte kracht zit vaak in dit soort interne hulpmiddelen. Op lvbl.nl benadrukken we vaker dat we een onafhankelijk platform zijn dat ervaringen uit de praktijk deelt, en dit voorbeeld laat precies zien hoe de drempel om functionele software te bouwen definitief is verlaagd voor iedereen met een goed idee.
Tips voor je eigen project
Wil je zelf een vergelijkbare oplossing bouwen voor je vereniging, bedrijf of stichting? Houd dan rekening met een paar praktische uitgangspunten: - Begin altijd met een minimale versie die slechts één specifiek probleem echt goed oplost. - Koppel Lovable zo snel mogelijk aan een database zoals Supabase voor het veilig opslaan van data. - Test het prototype direct met de uiteindelijke gebruikers om te zien waar ze vastlopen. - Gebruik de feedback van die testen om in korte sessies gerichte aanpassingen te vragen in de chat.
Vond je dit fijn?
Geef een hartje en deel het met een andere Lovable-fan.