Alle toepassingen

Bouw je frontend met Lovable

Maak in Lovable een app voor klantverzoeken, terwijl OrganiseYou de gegevens en REST-API beheert.

Van spreadsheet naar een portaal voor klantverzoeken

Stel je een klein serviceteam voor dat klantverzoeken per e-mail ontvangt. Iemand zet ze in een spreadsheet, een collega werkt een andere kopie bij en een klant belt om te vragen hoe het staat. Je wilt een eenvoudig portaal: een verzoek indienen, de details bekijken en de voortgang volgen. Lovable kan die ervaring bouwen. OrganiseYou geeft het team een gedeelde plek om de klanten en verzoeken erachter te beheren.

Waarom OrganiseYou achter Lovable?

Een mooi scherm is een begin. Collega’s moeten ook klantgegevens corrigeren, achterstallige verzoeken vinden en doorwerken als de interface verandert. Definieer Klanten en Verzoeken één keer in OrganiseYou en maak interne formulieren en grids voor die records. De Lovable-interface gebruikt de API voor dezelfde gegevens. Zo ontwikkel je de klantervaring verder terwijl het team zijn eigen werkplek houdt, zonder records tussen twee systemen te kopiëren.

Waar MCP helpt: laat de bouwer je model begrijpen

Zonder context moet een AI-bouwer veldnamen, relaties en beschikbare bewerkingen uit je beschrijving afleiden. De metadata-MCP-tools van OrganiseYou kunnen bestaande entiteiten, formulieren, grids en endpoints beschrijven. Met een compatibele eigen MCP-verbinding in Lovable krijgt de bouwer concrete informatie. Vraag bijvoorbeeld om Klanten en Verzoeken te bekijken en schermen voor de echte velden voor te stellen. Waar je rechten het toestaan, kunnen metadatawijzigingen als concept ter beoordeling worden voorgesteld. Dit gebruikt de bestaande MCP-interface; controleer de compatibiliteit met jouw Lovable-inrichting.

Geef MCP een duidelijke taak

Begin met metadata als context. Zijn voorbeeldrecords nodig, dan heeft OrganiseYou een apart data-MCP-endpoint voor expliciet ingeschakelde endpoints en toegestane bewerkingen. Gebruik een testorganisatie met niet-gevoelige voorbeelden en geef alleen de benodigde rechten. Een metadataverbinding geeft niet automatisch toegang tot records. De chatconnector van Lovable helpt tijdens het bouwen en wordt niet de verbinding voor bezoekers van je gepubliceerde app.

Wat verandert er op een gewone werkdag?

Een klant dient een verzoek in via je Lovable-app. De API-aanroep vanaf de server maakt het record in OrganiseYou. Een collega vindt het in het verzoekengrid en wijzigt de status. Zodra het portaal het record opnieuw ophaalt, verschijnt de nieuwe status. Volgende week voeg je een streefdatum toe: pas het model en endpoint aan en vraag Lovable het scherm op het gewijzigde schema af te stemmen. MCP geeft context tijdens het bouwen; beveiligde API-aanroepen verbinden de draaiende app.

Lovable · MCP ↗

Zo richt je het in

  1. 01

    Modelleer de gegevens

    Maak Klanten en Verzoeken als entiteiten in OrganiseYou. Voeg bijvoorbeeld onderwerp, status en streefdatum toe en koppel ieder verzoek aan een klant.

  2. 02

    Stel de juiste bewerkingen beschikbaar

    Maak REST-endpoints voor deze entiteiten. Kies de velden en lees-, aanmaak- en wijzigingsbewerkingen die je app nodig heeft. Publiceer eventuele conceptwijzigingen en haal de beveiligde OpenAPI-beschrijving op.

  3. 03

    Verbind de API veilig

    Maak een Connection met een API-sleutel en rechten voor de endpoints. Voeg de sleutel toe via de geheime instellingen van Lovable en laat serverfuncties OrganiseYou aanroepen. Controleer daar de toegang van gebruikers; zet de sleutel nooit in browsercode of een chatbericht.

  4. 04

    Bouw en controleer de schermen

    Geef Lovable de API-beschrijving en vraag om een verzoekenlijst, detailscherm en invoer- en bewerkformulier. Test het opslaan en controleer dat een bewerking zonder rechten wordt geweigerd.

Voorbeeldopdracht voor Lovable

Bouw een interface voor klantverzoeken op basis van deze OpenAPI-beschrijving. Roep OrganiseYou aan via serverfuncties, lees de API-sleutel uit een secret en begin met een verzoekenlijst en een bewerkformulier.
Handleiding voor API-integratie in Lovable ↗