Een formulierbouwer maken

Een formulierbouwer laat mensen hun eigen formulieren ontwerpen — velden kiezen, regels instellen, een link publiceren — en verzamelt daarna de inzendingen. Onder de motorkap bestaat hij uit drie onderdelen: een formulierdefinitie die als data is opgeslagen, een renderer die de definitie omzet in een werkend formulier, en een opslag voor inzendingen met meldingen en export. Controleer voordat je begint of je er echt een nodig hebt: als je alleen een contactformulier of een sollicitatieformulier nodig hebt, bouw dat formulier dan direct en sla de bouwer helemaal over.

Heb je wel een bouwer nodig?

Jouw situatie	Bouw dit
Een of twee formulieren die zelden veranderen	De formulieren zelf. Zie hoe je een contactformulier toevoegt.
Veel formulieren, gemaakt door niet-ontwikkelaars in je team	Een interne formulierbouwer
Formulieren horen bij je product (klanten maken ze zelf)	Een formulierbouwer met accounts, limieten en insluiten
Je wilt vooral enquêteresultaten en grafieken	Een enquête-app

Een bouwer is een groter project dan een formulier, omdat elk veldtype moet werken in de editor, het openbare formulier, validatie, opslag, meldingen en export.

Wat een formulierbouwer nodig heeft

Formulierdefinities

Sla elk formulier op als een lijst van velden, als gestructureerde data (JSON in een Postgres-kolom werkt goed). Een veld kan er zo uitzien:

id — een stabiel ID dat nooit verandert, ook al verandert het label
type — tekst, e-mail, getal, lange tekst, keuzelijst, selectievakje, datum, bestand
label en hulptekst
verplicht, min / max, toegestane bestandstypen
opties voor keuzelijsten
volgorde, en eventueel een voorwaarde („alleen tonen als veld X gelijk is aan Y”)

De editor bewerkt deze lijst; het openbare formulier leest hem. Dat is de kern: geen nieuwe code per formulier.

Inzendingen

Inzendingen — formulier, formulierversie, tijdstip van indienen, antwoorden gekoppeld aan veld-ID, status (nieuw, gelezen, gearchiveerd).
Bestanden — geüploade bestanden horen in bestandsopslag, met in de inzending alleen een verwijzing, nooit in de databaserij zelf.

Pagina's

Formulierlijst met het aantal inzendingen.
Editor — velden toevoegen, herordenen en instellen, met een live voorbeeld ernaast.
Instellingen — bevestigingsbericht of doorverwijzing, meldingsmails, open- en sluitdatums, limiet op het aantal inzendingen.
Openbaar formulier op een eigen link, en een insluitbare versie voor andere websites.
Tabel met inzendingen met zoeken, status, detailweergave en CSV-export.

Beslissingen en afwegingen

Versiebeheer. Iemand gaat na 200 inzendingen „Telefoon” hernoemen naar „Mobiel nummer”. Als antwoorden op veld-ID worden opgeslagen en elke inzending de formulierversie bijhoudt, worden oude inzendingen nog steeds correct getoond. Zonder dat loopt je data stilletjes door elkaar.

Validatie gebeurt twee keer. Controleer velden in de browser voor snelle feedback, en nogmaals op de server, omdat iedereen gegevens rechtstreeks naar je endpoint kan sturen. De controle op de server is de enige die telt.

Bestandsuploads. Ze brengen opslagkosten, groottelimieten, controles op bestandstype en privacyvragen mee (cv's, identiteitsbewijzen, medische formulieren). Beperk typen en groottes, en maak geüploade bestanden standaard privé, alleen leesbaar voor de eigenaar van het formulier. Zie hoe je bestandsuploads aan je app toevoegt.

Meldingen. „Mail me als iemand iets indient” wordt verwacht. Daarvoor heb je een e-mailprovider en een API-sleutel nodig; zie hoe je e-mails vanuit je app verstuurt.

Spam. Een openbaar formulier wordt door bots gevonden. Gebruik een honeypotveld (voor mensen verborgen, door bots ingevuld), limieten per IP-adres, validatie op de server en, indien nodig, een captchadienst.

Insluiten. Een iframe-embed is de eenvoudigste en veiligste manier om een formulier op andermans website te zetten. Een script-embed past beter in de pagina, maar is moeilijker te bouwen en veilig te houden.

Voorwaardelijke logica. „Toon dit veld alleen als…” is populair en vermenigvuldigt het aantal tests. Voeg het toe nadat de basis stevig staat.

Een eerste prompt die werkt

Bouw een formulierbouwer-webapp voor mijn team. Ingelogde gebruikers maken formulieren in een editor met een live voorbeeld. Veldtypen: korte tekst, lange tekst, e-mail, getal, datum, enkele keuze, selectievakjes en bestandsupload. Elk veld heeft een stabiel ID, label, hulptekst, een verplicht-vlag en typespecifieke regels (min/max, opties, toegestane bestandstypen en een limiet van 10 MB). Sla de formulierdefinitie op als JSON met een versienummer dat bij elke publicatie omhooggaat. Elk formulier krijgt een openbare link en een iframe-embedcode. Valideer inzendingen op de server tegen de gepubliceerde versie, sla antwoorden op per veld-ID met de formulierversie, en zet geüploade bestanden in privé bestandsopslag. Voeg een verborgen honeypotveld en een limiet per IP-adres toe. Eigenaren van formulieren zien een tabel met inzendingen, met status (nieuw, gelezen, gearchiveerd), een detailweergave en CSV-export. Sla alles op in een database. Laat voorwaardelijke logica en e-mailmeldingen voor later.

Bouwstappen

Editor en definitie. Bouw een formulier met elk veldtype en bekijk de opgeslagen JSON met de agent. Is die schoon en stabiel?
Openbaar formulier. Vul het in op een telefoon. Controleer de validatieberichten en het bevestigingsscherm.
Validatie op de server. Laat de agent een inzending sturen die de regels breekt, rechtstreeks naar de server, zonder de pagina. Die moet worden afgewezen.
Versiebeheer. Hernoem en herorden velden na een paar inzendingen. Oude inzendingen moeten nog steeds de juiste antwoorden tonen.
Uploads. Probeer een bestand dat te groot is en een van het verkeerde type. Controleer dat een vreemde niet een geüpload bestand kan openen door de link te raden.
Tabel met inzendingen en export. Controleer de CSV-export met komma's, regeleindes en accenten in antwoorden.
Meldingen, insluiten, logica. Voeg ze één voor één toe.

Veelgemaakte fouten

Antwoorden opslaan op label. Labels veranderen. Gebruik stabiele veld-ID's.
Validatie alleen in de browser. Het is een gemak, geen bescherming.
Openbare geüploade bestanden. Formulieren verzamelen vaak documenten die mensen niet openbaar willen zien.
Geen spambeveiliging. Een openbaar formulier kan binnen een paar dagen vol met rommel staan.
Een bouwer maken voor één formulier. Bouw gewoon het formulier.
Onbeperkt aantal inzendingen bij een openbaar product. Als klanten zelf formulieren maken, stel dan limieten per abonnement in, anders kan één populair formulier je hostingrekening flink laten oplopen.

Wanneer een kant-en-klaar product beter is

Gehoste formuliertools zijn uitstekend en voor de meeste behoeften goedkoop. Ze hebben insluiten, spam, betalingen, integraties en toegankelijkheid al voor tientallen veldtypen opgelost. Als je team gewoon formulieren nodig heeft, gebruik er dan een — zie Typeform-alternatieven en Google Forms-alternatieven.

Bouw zelf wanneer inzendingen naast je eigen gegevens moeten staan (voeding voor een CRM of klantportaal dat je beheert), wanneer je workflows na het indienen nodig hebt die de tools niet kunnen, wanneer de locatie of het eigendom van gegevens een eis is, of wanneer formulieren onderdeel zijn van een product dat je verkoopt.

Bouwen met Mythex

Bij Mythex beschrijf je de bouwer in de chat en test je de editor en het openbare formulier naast elkaar in het live voorbeeld. Mythex voegt een aparte database toe voor formulierdefinities en inzendingen, en schakelt bestandsopslag automatisch in wanneer je app uploads nodig heeft (op het Free-abonnement beperkt tot 1 GB). Meldingsmails gaan via een provider die je met je eigen sleutel koppelt. Publiceer de app naar een mythex.ai-link, of op je eigen domein met Pro, en de openbare formulierlinks werken vanaf daar.

Veelgestelde vragen

Hoe slaat een formulierbouwer formulieren op?

Meestal als formulierdefinitie: een lijst van velden, elk met een type, label, validatieregels en volgorde, opgeslagen als gestructureerde gegevens zoals JSON. Dezelfde definitie stuurt zowel de editor als het openbare formulier aan, dus een nieuw veld toevoegen vereist geen nieuwe code.

Hoe moeten formulierinzendingen worden opgeslagen?

Sla elke inzending op met een verwijzing naar de formulierversie waarmee die is ingevuld, en de antwoorden gekoppeld aan het veld-ID. Zo breekt het hernoemen of herordenen van een veld later niet de oude inzendingen.

Hoe voorkom ik spam op een openbaar formulier?

Combineer een verborgen honeypotveld, een limiet op het aantal verzoeken per IP-adres, validatie op de server en, als spam aanhoudt, een captchadienst. Vertrouw nooit op controles die alleen in de browser draaien.

Heb ik een volledige formulierbouwer nodig of gewoon een formulier?

Als je één of twee vaste formulieren nodig hebt, bouw je die formulieren direct — dat is veel eenvoudiger. Een formulierbouwer loont wanneer niet-technische mensen zonder ontwikkelaar veel formulieren moeten maken en wijzigen.