Inscriptions à un événement sans Eventbrite, pour les événements associatifs gratuits

Pour un événement gratuit, un formulaire d'inscription sur votre propre site peut remplacer l'inscription Eventbrite : il envoie à Ikiform, qui stocke chaque inscription et prévient votre équipe par e-mail. Ajoutez un webhook qui envoie l'e-mail de confirmation depuis votre propre fournisseur d'e-mail, et comptez les places par session à partir de la dernière inscription de chaque e-mail. Gardez Eventbrite, ou une autre plateforme de billetterie, pour les billets payants, les plafonds de places stricts et le scan à l'accueil.

Ce qui change sans plateforme de billetterie

Eventbrite fait cinq choses à la fois, et on oublie facilement celles que vous ferez désormais vous-même. Pour une journée associative gratuite, une série de meetups ou un atelier, la plupart sont mineures. Voici la répartition, honnêtement :

Les tarifs d'Eventbrite évoluent : consultez sa propre page de tarifs avant de comparer les coûts. Pour les événements gratuits, les raisons de partir ne sont généralement pas les frais : la liste des participants est sur la plateforme de quelqu'un d'autre, la page ressemble à la sienne, et les inscrits confient leurs données à une autre entreprise, avec ses propres réglages de compte et d'e-mail. Pour les événements payants, restez-y. Ikiform n'a pas de paiements.

Un formulaire d'inscription avec choix de sessions

Une journée associative a souvent des sessions en parallèle, et les salles n'ont pas la même taille. Demandez à quelles sessions les gens comptent assister, pour pouvoir déplacer un atelier populaire dans une salle plus grande avant le jour J. Cette définition limite les choix à trois sur quatre, puisque deux ont lieu en même temps :

• name est libellé pour le badge, ce qui vous donne le nom sous lequel les gens veulent être appelés.
• lunch est un radio avec une option No lunch, pour commander pour ceux qui mangeront.
• updates est une case non cochée, stockée comme true ou false dans une soumission qui garde son propre created_at. N'ajoutez les gens à votre newsletter que lorsqu'elle vaut true.
• Utilisez le formulaire de RSVP du guide principal pour le markup dans votre stack, en y mettant ces champs.

Envoyer la confirmation depuis votre propre outil d'e-mailing

Ikiform n'envoie pas d'e-mail à la personne qui remplit le formulaire. Les e-mails de notification vont uniquement à vous et à votre équipe : il n'y a donc ni réponse automatique, ni e-mail de confirmation, ni double opt-in. Envoyez-les depuis votre outil d'e-mailing, déclenché par un webhook. Pour un événement, envoyez-en un quand même : les gens transfèrent la confirmation à leur responsable et la recherchent le matin de l'événement. Ce route handler reçoit le webhook signé d'Ikiform et envoie l'e-mail via l'API de Resend. Tout fournisseur doté d'un endpoint d'envoi fonctionne de la même façon.

import { verifyWebhook, WebhookVerificationError } from "@ikiform/sdk/webhooks";

const TITLES: Record<string, string> = {
  keynote: "Opening talk, 10:00",
  workshop_a: "Workshop A, 11:30",
  workshop_b: "Workshop B, 11:30",
  panel: "Closing panel, 15:00",
};

function escape(text: string) {
  return text.replace(/[&<>"']/g, (char) => `&#${char.charCodeAt(0)};`);
}

export async function POST(request: Request) {
  const payload = await request.text();
  try {
    const event = await verifyWebhook({
      payload,
      headers: request.headers,
      secret: process.env.IKIFORM_WEBHOOK_SECRET!,
    });
    if (event.type !== "submission.created") return new Response(null, { status: 204 });

    const fields = event.data.fields;
    const email = String(fields.email ?? "");
    const chosen = (Array.isArray(fields.sessions) ? fields.sessions : []).map((id) => TITLES[String(id)] ?? String(id));
    const response = await fetch("https://api.resend.com/emails", {
      method: "POST",
      headers: {
        Authorization: `Bearer ${process.env.RESEND_API_KEY}`,
        "Content-Type": "application/json",
        "Idempotency-Key": request.headers.get("webhook-id") ?? event.data.submission_id,
      },
      body: JSON.stringify({
        from: "Community Day <hello@community.example>",
        to: email,
        reply_to: "hello@community.example",
        subject: "You're registered for Community Day, 14 March",
        html: [
          `<p>Hi ${escape(String(fields.name ?? ""))},</p>`,
          "<p>You're on the list for Community Day on 14 March at The Old Library. Doors open at 9:30.</p>",
          `<p>Your sessions: ${chosen.map(escape).join(", ")}.</p>`,
          '<p><a href="https://community.example/day.ics">Add it to your calendar</a>. Can\'t come after all? Reply to this email.</p>',
        ].join(""),
      }),
    });
    if (!response.ok) return new Response(`Email API answered ${response.status}`, { status: 502 });
    return new Response(null, { status: 204 });
  } catch (error) {
    if (error instanceof WebhookVerificationError) return new Response(error.reason, { status: 400 });
    throw error;
  }
}

• verifyWebhook vérifie la signature, pour que personne d'autre ne puisse faire envoyer des e-mails à votre domaine.
• Idempotency-Key utilise le webhook-id de la livraison, qui reste identique à chaque nouvelle tentative automatique et lors d'un Retry manuel d'une livraison échouée : une livraison dont la réponse s'est perdue n'envoie donc pas un second e-mail.
• Le nom et les titres des sessions sont échappés avant d'aller dans le HTML. Traitez les valeurs des champs comme des entrées non fiables.
• Un 502 fait réessayer Ikiform, donc une courte panne chez le fournisseur d'e-mail ne fait pas perdre de confirmation. Le spam ne déclenche jamais le webhook : les bots ne vous font pas écrire à des inconnus.

Ajoutez la route sous Webhooks dans le tableau de bord et copiez son secret dans IKIFORM_WEBHOOK_SECRET. Ikiform réessaie une livraison échouée pendant environ 3 jours, et le journal des livraisons affiche chaque tentative. Sans code, un outil d'automatisation comme Zapier ou Make peut envoyer le même e-mail.

Places par session

Ikiform n'arrête pas les inscriptions à une session quand sa salle est pleine, et ne peut pas masquer une option complète. Comptez plutôt, à partir de l'inscription la plus récente de chaque personne, et lancez ce calcul dès que vous voulez un chiffre :

import { createClient } from "@ikiform/sdk";

const ikiform = createClient({ apiKey: process.env.IKIFORM_SECRET_KEY! });
const ROOMS: Record<string, number> = { keynote: 200, workshop_a: 30, workshop_b: 30, panel: 200 };
const latest = new Map<string, string[]>();

for await (const submission of ikiform.submissions.iterate({ formId: process.argv[2], status: "received", limit: 100 })) {
  const email = String(submission.fields.email ?? "").trim().toLowerCase();
  const chosen = Array.isArray(submission.fields.sessions) ? submission.fields.sessions.map(String) : [];
  if (email && !latest.has(email)) latest.set(email, chosen);
}

for (const [session, seats] of Object.entries(ROOMS)) {
  const taken = [...latest.values()].filter((chosen) => chosen.includes(session)).length;
  console.log(`${session.padEnd(12)} ${String(taken).padStart(4)} of ${seats}${taken >= seats ? "  FULL" : ""}`);
}

Quand un atelier est complet, modifiez la page pour l'indiquer et retirez son option du formulaire et de la définition des champs, pour que les nouveaux envois ne puissent plus le choisir. Quand toute la journée est complète, choisissez Pause form : les envois reçoivent 403 form_paused, et la page doit indiquer que les inscriptions sont closes.

Sur place

1. La veille au soir, exportez Submissions en CSV et supprimez les e-mails en double, en gardant le plus récent.
2. Triez par nom, gardez name, organisation et lunch, et imprimez deux exemplaires pour l'accueil.
3. Imprimez les badges depuis le même tableur avec un publipostage, à partir de la colonne name.
4. Notez à la main les personnes venues sans inscription. Après l'événement, ajoutez-les à votre liste seulement si elles sont d'accord.

Vérifiez avant d'annoncer

1. Dans Allowed domains du formulaire, ajoutez le domaine de votre site, plus localhost pendant le développement. Laissez vide pour accepter les envois de partout.
2. Inscrivez-vous avec votre propre e-mail, en choisissant deux sessions.
3. L'e-mail de confirmation arrive depuis votre domaine et liste les deux sessions.
4. Si vous avez ajouté un webhook, ouvrez l'endpoint dans Webhooks. La livraison affiche succeeded avec la réponse de votre serveur.
5. Lancez le décompte des places. Chacune de vos deux sessions affiche une place prise.
6. Rien n'est arrivé ? Passez le filtre de statut du tableau de bord sur Spam. Le spam reçoit la même réponse de succès qu'une vraie soumission.

Pièges

Questions