Formularz w Replit

Replit Agent często dodaje do formularza kontaktowego trasę Express i bazę danych. Prompt zostawia formularz po stronie frontu i wysyła go do Formgong.

  1. Weź access key na stronie głównej.
  2. Otwórz aplikację w Replit i wklej prompt do Agenta.
  3. Sprawdź, że dla formularza nie powstała trasa serwerowa, baza ani sekret.
  4. Opublikuj, wyślij test i zobacz go w skrzynce Formgong.

Prompt

Dodaj do aplikacji formularz kontaktowy bez własnego backendu. Zgłoszenia przyjmuje Formgong.
- POST https://formgong.com/submit (zwykły formularz HTML albo fetch)
- Ukryte pole access_key o wartości fk_your_access_key (klucz jest publiczny)
- Pola name, email, message; etykiety po polsku
- Ukryte pole honeypot botcheck poza ekranem
- Nie dodawaj trasy Express ani Flask, bazy danych, Replit Secrets ani nodemailer dla tego formularza
- Dla fetch: Accept: application/json; sukces to json.success === true

Dodatkowo:
- Ukryte pole _lang o wartości pl (język strony): komunikaty błędów, strona z podziękowaniem i autoodpowiedź będą po polsku.
- Opcjonalnie: ukryte pole _redirect z pełnym adresem https Twojej strony z podziękowaniem. Bez niego Formgong pokaże własną stronę z podziękowaniem.
- Opcjonalnie: <script src="https://formgong.com/fg.js" async></script> raz na stronie. Uzupełnia _lang z <html lang> i liczy wyświetlenia formularza bez cookies.
- Turnstile dodaj tylko wtedy, gdy podam site key.

Minimalny kod

Komponent React

"use client";
import { useState } from "react";

export function ContactForm() {
  const [status, setStatus] = useState("");
  async function onSubmit(event) {
    event.preventDefault();
    const fields = Object.fromEntries(new FormData(event.currentTarget));
    const response = await fetch("https://formgong.com/submit", {
      method: "POST",
      headers: { "Content-Type": "application/json", Accept: "application/json" },
      body: JSON.stringify({ _lang: "pl", ...fields, access_key: "fk_your_access_key" }),
    });
    const result = await response.json();
    setStatus(result.message || (result.success ? "Wysłano. Dziękujemy!" : "Nie udało się wysłać. Spróbuj ponownie."));
  }

  return (
    <form onSubmit={onSubmit}>
      <label>Imię <input name="name" placeholder="Twoje imię" required /></label>
      <label>E-mail <input name="email" type="email" placeholder="ty@example.com" required /></label>
      <label>Wiadomość <textarea name="message" placeholder="W czym możemy pomóc?" required /></label>
      <div aria-hidden="true" style={{ position: "absolute", left: "-10000px" }}>
        <input name="botcheck" tabIndex={-1} autoComplete="off" />
      </div>
      <button type="submit">Wyślij</button>
      <p role="status">{status}</p>
    </form>
  );
}

Przed publikacją

  • Formularz wysyła na https://formgong.com/submit (action formularza albo URL w fetch).
  • W access_key jest Twój klucz z panelu Formgong, a nie fk_your_access_key.
  • Jest ukryte, puste pole botcheck.
  • _lang zgadza się z językiem strony.
  • Dla formularza nie powstała trasa API, funkcja serwerowa, tabela w bazie ani sekret.
  • Testowe zgłoszenie widać w skrzynce Formgong i w Twojej poczcie.

Pobierz klucz