Ako vytvoriť nástroj na tvorbu formulárov

Nástroj na tvorbu formulárov umožňuje ľuďom navrhnúť vlastné formuláre — vybrať polia, nastaviť pravidlá, zverejniť odkaz — a potom zbiera odoslania. Pod kapotou sú tri veci: definícia formulára uložená ako dáta, vykresľovač, ktorý z definície spraví funkčný formulár, a úložisko odoslaní s upozorneniami a exportom. Skôr než ho začnete stavať, skontrolujte, či ho naozaj potrebujete: ak chcete len kontaktný formulár alebo formulár na prihlášku, postavte priamo ten formulár a celý nástroj preskočte.

Potrebujete vôbec nástroj na tvorbu?

Nástroj na tvorbu je väčší projekt než formulár, pretože každý typ poľa musí fungovať v editore, vo verejnom formulári, pri overovaní, ukladaní, oznámeniach a exporte.

Čo nástroj na tvorbu formulárov potrebuje

Definície formulárov

Každý formulár ukladajte ako zoznam polí, uložený ako štruktúrované dáta (JSON v stĺpci Postgres funguje dobre). Pole môže vyzerať takto:

• id — stabilné ID, ktoré sa nikdy nemení, ani keď sa zmení popisok
• type — text, e-mail, číslo, dlhý text, výber, zaškrtávacie políčko, dátum, súbor
• label a nápoveda
• povinné, min / max, povolené typy súborov
• možnosti pre polia výberu
• poradie a voliteľne podmienka („zobraz len vtedy, ak pole X je Y“)

Editor upravuje tento zoznam; verejný formulár ho číta. To je celý trik: žiadny nový kód pre každý formulár.

Odoslania

• Odoslania — formulár, verzia formulára, čas odoslania, odpovede podľa ID poľa, stav (nové, prečítané, archivované).
• Súbory — nahrané súbory patria do úložiska súborov, pričom odoslanie drží len odkaz, nikdy nie obsah v riadku databázy.

Stránky

• Zoznam formulárov s počtom odoslaní.
• Editor — pridávanie, zoraďovanie a nastavenie polí, s živým náhľadom vedľa.
• Nastavenia — potvrdzovacia správa alebo presmerovanie, oznamovacie e-maily, dátumy otvorenia a zatvorenia, limit odoslaní.
• Verejný formulár na vlastnom odkaze a verzia na vkladanie pre iné webové stránky.
• Tabuľka odoslaní s vyhľadávaním, stavom, detailným zobrazením a exportom do CSV.

Rozhodnutia a kompromisy

Verzovanie. Niekto po 200 odoslaniach premenuje „Telefón“ na „Číslo mobilu“. Ak sa odpovede ukladajú podľa ID poľa a každé odoslanie zaznamenáva verziu formulára, staré odoslania sa stále zobrazia správne. Bez toho sa vaše dáta potichu pomiešajú.

Overovanie beží dvakrát. Polia kontrolujte v prehliadači pre rýchlu odozvu a znova na serveri, lebo ktokoľvek môže poslať dáta priamo na váš koncový bod. Rozhodujúca je kontrola na serveri.

Nahrávanie súborov. Prináša náklady na úložisko, limity veľkosti, kontroly typu súboru a otázky súkromia (životopisy, doklady, zdravotné formuláre). Obmedzte typy a veľkosti a nahrané súbory nastavte ako súkromné predvolene, čitateľné len vlastníkmi formulárov. Pozrite ako pridať nahrávanie súborov do aplikácie.

Oznámenia. „Pošli mi e-mail, keď niekto odošle formulár“ sa očakáva. Potrebuje poskytovateľa e-mailov a API kľúč; pozrite ako posielať e-maily z aplikácie.

Spam. Verejný formulár nájdu boti. Použite skryté pole honeypot (pre ľudí neviditeľné, boti ho vyplnia), limity počtu požiadaviek na IP, overovanie na serveri a v prípade potreby službu CAPTCHA.

Vkladanie. Vkladanie cez iframe je najjednoduchší a najbezpečnejší spôsob, ako dať formulár na cudziu webovú stránku. Vkladanie cez skript pôsobí prirodzenejšie, ale je ťažšie ho postaviť a zabezpečiť.

Podmienená logika. „Zobraz toto pole, iba ak…“ je obľúbené, ale násobí testovanie. Pridajte ju až po zvládnutí základov.

Prvý prompt, ktorý funguje

Vytvor webovú aplikáciu na tvorbu formulárov pre môj tím. Prihlásení používatelia vytvárajú formuláre v editore so živým náhľadom. Typy polí: krátky text, dlhý text, e-mail, číslo, dátum, výber jednej možnosti, zaškrtávacie políčka a nahrávanie súborov. Každé pole má stabilné ID, popisok, text nápovedy, príznak povinnosti a pravidlá pre typ (min/max, možnosti, povolené typy súborov a limit veľkosti 10 MB). Ulož definíciu formulára ako JSON s číslom verzie, ktoré sa zvýši pri každom publikovaní. Každý formulár dostane verejný odkaz a kód na vkladanie cez iframe. Odoslania over na serveri podľa publikovanej verzie, ulož odpovede podľa ID poľa spolu s verziou formulára a nahrané súbory daj do súkromného úložiska. Pridaj skryté pole honeypot a limit počtu požiadaviek na IP. Vlastníci formulárov uvidia tabuľku odoslaní so stavom (nové, prečítané, archivované), detailné zobrazenie a export do CSV. Všetko ulož do databázy. Podmienenú logiku a e-mailové oznámenia nechaj na neskôr.

Postup budovania

1. Editor a definícia. Postavte formulár so všetkými typmi polí a s agentom si pozrite uložený JSON. Je čistý a stabilný?
2. Verejný formulár. Vyplňte ho na telefóne. Skontrolujte správy o overovaní a obrazovku s potvrdením.
3. Overovanie na serveri. Nechajte agenta poslať odoslanie, ktoré porušuje pravidlá, priamo na server bez stránky. Malo by byť odmietnuté.
4. Verzovanie. Po niekoľkých odoslaniach premenujte a presuňte polia. Staré odoslania by mali stále zobrazovať správne odpovede.
5. Nahrávanie. Vyskúšajte príliš veľký súbor a súbor nesprávneho typu. Overte, že cudzí človek nedokáže otvoriť nahraný súbor odhadnutím odkazu.
6. Tabuľka odoslaní a export. Skontrolujte export do CSV s čiarkami, zalomeniami riadkov a znakmi s diakritikou v odpovediach.
7. Oznámenia, vkladanie, logika. Pridávajte ich jedno po druhom.

Časté chyby

• Ukladanie odpovedí podľa popisku. Popisky sa menia. Používajte stabilné ID polí.
• Overovanie len v prehliadači. Je to pohodlie, nie ochrana.
• Verejne prístupné nahrané súbory. Formuláre často zbierajú dokumenty, ktoré ľudia nechcú zverejniť.
• Žiadna ochrana pred spamom. Verejný formulár sa dokáže za pár dní zaplniť odpadom.
• Stavanie nástroja na tvorbu kvôli jednému formuláru. Postavte ten formulár.
• Neobmedzený počet odoslaní vo verejnom produkte. Ak si zákazníci vytvárajú formuláre, nastavte limity podľa plánu, inak môže jeden populárny formulár zvýšiť účet za hosting.

Kedy je lepšie hotový produkt

Hostované nástroje na formuláre sú výborné a lacné pre väčšinu potrieb. Už vyriešili vkladanie, spam, platby, integrácie a prístupnosť pre desiatky typov polí. Ak váš tím potrebuje len formuláre, použite jeden z nich — pozrite alternatívy k Typeformu a alternatívy ku Google Forms.

Vlastné riešenie budujte, keď sa odoslania musia uchovávať vedľa vašich vlastných dát (napájanie CRM alebo klientskeho portálu, ktorý prevádzkujete), keď potrebujete po odoslaní pracovné postupy, ktoré nástroje nezvládnu, keď je vlastníctvo alebo umiestnenie dát požiadavka, alebo keď sú formuláre súčasťou produktu, ktorý predávate.

Stavba s Mythex

V Mythexe opíšete nástroj v chate a otestujete editor a verejný formulár vedľa seba v živom náhľade. Mythex pridá vyhradenú databázu pre definície formulárov a odoslania a automaticky zapne úložisko súborov, keď aplikácia potrebuje nahrávanie (na bezplatnom pláne obmedzené na 1 GB). Oznamovacie e-maily idú cez poskytovateľa, ktorého pripojíte vlastným kľúčom. Aplikáciu publikujte na odkaz mythex.ai alebo na vlastnú doménu v pláne Pro a verejné odkazy na formuláre budú fungovať odtiaľ.

Otázky