# Ikiform ガイド

> どんなサイトでもフォーム送信を受け取るためのハウツーガイド。ウェイトリスト、お問い合わせフォーム、スパム対策、メール、Webhook を、コピーできるコード付きで解説します。

## [新しい SaaS のウェイトリストを作る方法](https://ikiform.com/ja/guides/waitlist.md)

自分のランディングページにローンチ前のウェイトリストを作ります。フォーム、スパム対策、重複、確認メール、ローンチ日のきれいなエクスポートまで扱います。

- [Product Hunt のローンチに向けてローンチ前のメールリストを作る方法](https://ikiform.com/ja/guides/waitlist/product-hunt.md): Product Hunt の数週間前からローンチリストを集め、登録をチャネルごとにタグ付けし、太平洋時間のリセットに合わせてローンチ日のメールを 2 回に分けて送ります。
- [応募者を選考するベータ登録フォームの作り方](https://ikiform.com/ja/guides/waitlist/beta-signup.md): サーバーが必須を強制する選考質問付きのベータ応募フォームと、応募者を採点してリストから各コホートを選ぶスクリプトを紹介します。
- [App Store 公開前のモバイルアプリ用ウェイトリストページの作り方](https://ikiform.com/ja/guides/waitlist/mobile-app.md): 使っているスマホを尋ね、iPhone のテスターを TestFlight に送り、Play のクローズドテストを埋める、iOS・Android アプリ向けの公開前ウェイトリストです。
- [サーバーアクションで Next.js のウェイトリストを作る方法](https://ikiform.com/ja/guides/waitlist/nextjs.md): Next.js App Router のウェイトリスト。シークレットキーで登録を転送するサーバーアクション、useActionState、楽観的なサンクス表示、訪問者ごとの制限を扱います。
- [Framer のサイトにウェイトリストを追加する方法](https://ikiform.com/ja/guides/waitlist/framer.md): Framer でウェイトリストの登録を集める 2 つの方法。Ikiform への Webhook を使う Framer のフォームか、訪問者ごとの制限とスパムチェックが残るコードコンポーネントです。
- [Webflow サイトにウェイトリストフォームを追加する方法](https://ikiform.com/ja/guides/waitlist/webflow.md): Webflow の Form Block の送信先を Ikiform にし、非表示フィールドで登録に流入元のタグを付け、短いスクリプトですべてのフォームで Webflow の成功表示を残します。
- [Carrd サイトにウェイトリストを追加する方法](https://ikiform.com/ja/guides/waitlist/carrd.md): Carrd のページでウェイトリストの登録を集める方法。Pro Plus では UTM を記録する Send to URL フォーム、Pro Standard ではハニーポット付きの埋め込み HTML フォームを使います。
- [プレーンな HTML でランディングページにウェイトリストフォームを追加する方法](https://ikiform.com/ja/guides/waitlist/html.md): ビルド不要でプレーンな HTML だけのウェイトリストページ。JavaScript がオフでも動き、読み込めばその場でお礼を表示し、必要なときはフォールバックします。
- [Astro でウェイトリストを作る](https://ikiform.com/ja/guides/waitlist/astro.md): 静的なランディングページに Astro のウェイトリストを。Action が登録を転送し、スクリプトがそれを呼び、オンデマンドの 1 ページが JavaScript なしの送信を受け止めます。
- [TanStack Start でウェイトリストを作る](https://ikiform.com/ja/guides/waitlist/tanstack-start.md): TanStack Start のウェイトリスト。1 つのサーバールートが通常のフォーム送信と fetch の両方に応え、validateSearch が流入元と結果を URL で運びます。
- [React Router でウェイトリストを作る](https://ikiform.com/ja/guides/waitlist/react-router.md): 全ページのフッターに置く React Router のウェイトリスト。fetcher が 1 つのルート Action に送信し、登録ごとにページを記録し、JavaScript なしでも動きます。
- [SvelteKit でウェイトリストを作る](https://ikiform.com/ja/guides/waitlist/sveltekit.md): SvelteKit 3 のウェイトリスト。フックが最初の ?ref= を Cookie に保存し、名前付きのフォーム Action が登録を転送し、再訪者には登録済みと表示します。
- [Nuxt でウェイトリストを作る](https://ikiform.com/ja/guides/waitlist/nuxt.md): プリレンダーしたランディングページに Nuxt のウェイトリストを。1 つの Nitro ルートが $fetch と通常のフォーム送信を受け、Zod で確認し、JavaScript なしならリダイレクトします。

## [バックエンドなしで静的サイトにお問い合わせフォームを追加する](https://ikiform.com/ja/guides/contact-form-static-site.md)

サーバーなしで静的サイトに動くお問い合わせフォームを追加します。POST の送り先、スパム、メールでの返信、各ホストとフレームワーク向けのコードまで。

- [GitHub Pages のサイトにお問い合わせフォームを追加する](https://ikiform.com/ja/guides/contact-form-static-site/github-pages.md): GitHub Pages ではサーバーコードが動かず、フォームの POST は 405 Not Allowed になります。フォームバックエンドに送信し、プロジェクトサイトのリダイレクトを正しく設定しましょう。
- [Vercel でホストしたお問い合わせフォームの 405 エラーを直す](https://ikiform.com/ja/guides/contact-form-static-site/vercel.md): Vercel の静的ページはフォームの POST に 405 Method Not Allowed を返します。その理由と、代わりにバックエンドへフォームを送る方法を説明します。
- [Netlify Forms を使わずに Netlify にお問い合わせフォームを追加する](https://ikiform.com/ja/guides/contact-form-static-site/netlify.md): Netlify Forms を使わずに、Netlify のサイトでお問い合わせフォームを運用します。ビルド時の検出なし、React からの JSON 送信、デプロイプレビュー用の別フォーム。
- [Cloudflare Pages のサイトにお問い合わせフォームを追加する](https://ikiform.com/ja/guides/contact-form-static-site/cloudflare-pages.md): Function を書かずに Cloudflare Pages にお問い合わせフォームを追加します。フォームバックエンドに送信し、_headers でヘッダーを設定し、自分の Turnstile キーを使います。
- [Amazon S3 の静的ウェブサイトにお問い合わせフォームを追加する](https://ikiform.com/ja/guides/contact-form-static-site/aws-s3.md): S3 のウェブサイトエンドポイントは平文 HTTP の GET と HEAD しか受け付けません。お問い合わせフォームはフォームバックエンドに送信し、リダイレクトは CloudFront で正しく扱います。
- [ポートフォリオサイトにお問い合わせフォームを追加する](https://ikiform.com/ja/guides/contact-form-static-site/portfolio-website.md): 初回の打ち合わせで聞くことを尋ねるポートフォリオのお問い合わせフォーム。案件、予算、時期、リンクを、サーバーなしで受け取り、受信トレイから返信できます。

## [HTML フォームの送信内容を自分のメールに届ける](https://ikiform.com/ja/guides/send-form-to-email.md)

メールサーバーなしで、すべての送信データを受信トレイに届けます。mailto: と PHP の mail() がうまくいかない理由と、スパムを除外して返信もできる構成を解説します。

- [PHP なしで HTML フォームをメールに送る](https://ikiform.com/ja/guides/send-form-to-email/without-php.md): mail() を呼ぶ contact.php スクリプトを、ホストされたエンドポイントに送信するフォームに置き換えます。フィールド名、サンクスページ、返信はそのままです。
- [Web サイトのフォームを Gmail に送る（mailto: がうまくいかない理由も）](https://ikiform.com/ja/guides/send-form-to-email/gmail.md): mailto: リンクもアプリパスワードも Apps Script も使わずに、フォームの送信データを Gmail で受け取り、ラベルを付け、迷惑メールを避け、Gmail から返信します。
- [1 つのフォームを複数のメールアドレスに送る](https://ikiform.com/ja/guides/send-form-to-email/multiple-recipients.md): 1 つのフォームをチーム全員にメールで送ったり、トピックごとに適切な担当者に振り分けたり。ただし、誰に送るかをフォーム自身には決めさせません。
- [フォームの送信データに受信トレイから直接返信する](https://ikiform.com/ja/guides/send-form-to-email/reply-to.md): フォームの通知メールで Reply を押すと、フォームに入力した人宛てになるようにします。使えるフィールド名、_replyto を使う場面、返信が迷子になる理由を説明します。
- [キーをクライアントに置かない EmailJS の代替](https://ikiform.com/ja/guides/send-form-to-email/emailjs-alternative.md): お問い合わせフォームを EmailJS から移行。ブラウザー側のメールキーのリスク、コードの変更点、自動返信など失うものを解説します。
- [メールを送る Next.js のお問い合わせフォーム](https://ikiform.com/ja/guides/send-form-to-email/nextjs.md): Server Action で Next.js のフォームをメールで送る 2 つの方法を公平に比較します。Resend や Nodemailer で自分で送るか、フォームバックエンドに転送するかです。

## [お問い合わせフォームのスパムを止める方法](https://ikiform.com/ja/guides/spam-protection.md)

本物の訪問者に負担をかけない層でお問い合わせフォームのスパムを止めます。ハニーポット、時間、内容のスコア、レート制限、必要なときだけの人間確認です。

- [ボットだけが埋めて人は埋めないハニーポットフィールドを追加する方法](https://ikiform.com/ja/guides/spam-protection/honeypot.md): スクリーンリーダー、キーボード、自動入力の邪魔をせずにボットを捕まえるハニーポットを、各スタックのサーバー側チェックとあわせてどんなフォームにも追加します。
- [HTML フォームに Cloudflare Turnstile を追加する方法](https://ikiform.com/ja/guides/spam-protection/cloudflare-turnstile.md): プレーンな HTML フォームに Cloudflare Turnstile を追加します。ウィジェット、サーバー側の siteverify、テスト用キー、自前のキーやサーバーなしで動かす方法まで。
- [CAPTCHA なしでフォームスパムを防ぐ方法](https://ikiform.com/ja/guides/spam-protection/without-captcha.md): CAPTCHA をまったく使わずにフォームスパムの大半を防ぐ方法。ハニーポット、署名付きの表示時刻、内容のスコア、レート制限を単独ではなく合算して使います。
- [Web サイトのフォーム向け reCAPTCHA の代替](https://ikiform.com/ja/guides/spam-protection/recaptcha-alternatives.md): Turnstile や hCaptcha から Proof of Work、CAPTCHA なしまで、フォーム向け reCAPTCHA の代替を比較し、小さく安全な変更で乗り換えます。
- [フォーム送信にレート制限をかける方法](https://ikiform.com/ja/guides/spam-protection/rate-limiting.md): 共有ストアで訪問者ごとにフォーム送信のレート制限をかけ、Retry-After 付きの 429 を返し、1 つの IP を共有するオフィスを締め出さないようにします。
- [静的サイトのお問い合わせフォームでスパムを防ぐ方法](https://ikiform.com/ja/guides/spam-protection/static-site.md): シークレットを保持できず送信数も数えられない静的サイトのフォームでも、ハニーポットのパーシャル、安全なスクリプト、サーバー側のチェックでスパムを防ぎます。
- [Webflow フォームのスパムを止める方法](https://ikiform.com/ja/guides/spam-protection/webflow.md): Webflow 独自のスパム設定が働かない、フォームバックエンドに送信する Webflow フォームを、画面外のハニーポットと人間確認で守ります。
- [Turnstile を使った Next.js フォームのスパム対策](https://ikiform.com/ja/guides/spam-protection/nextjs.md): Next.js のフォームをスパムから守ります。ハニーポット、サーバーアクションで確認する Turnstile、Vercel・Netlify・Cloudflare での IP ごとの制限、それに合わせた CSP。
- [Turnstile を使った Astro フォームのスパム対策](https://ikiform.com/ja/guides/spam-protection/astro.md): Action で Astro のフォームをスパムから守ります。ハニーポット、astro:env のシークレットで確認する Turnstile、IP ごとの制限、Astro 組み込みの CSP。
- [Turnstile を使った TanStack Start フォームのスパム対策](https://ikiform.com/ja/guides/spam-protection/tanstack-start.md): TanStack Start のフォームをスパムから守る方法。クライアント IP 用の関数ミドルウェア、トークンバケット、サーバー関数での Turnstile 検証、CSP。
- [Turnstile を使った React Router フォームのスパム対策](https://ikiform.com/ja/guides/spam-protection/react-router.md): React Router のフォームをスパムから守る方法。Turnstile 付きのルート Action、cf-connecting-ip をキーにした Workers のレート制限、.server モジュール、CSP ヘッダー。
- [Turnstile を使った SvelteKit フォームのスパム対策](https://ikiform.com/ja/guides/spam-protection/sveltekit.md): SvelteKit のフォームをスパムから守る方法。getClientAddress を使うフォーム Action、IP ごとの制限、use:enhance の裏の Turnstile、それを許可する CSP。
- [Turnstile を使った Nuxt フォームのスパム対策](https://ikiform.com/ja/guides/spam-protection/nuxt.md): Nuxt のフォームをスパムから守る方法。Turnstile 付きの Nitro サーバールート、Nitro ストレージでの IP ごとの制限、runtimeConfig のシークレット、routeRules で設定する CSP。

## [サイトビルダーのフォームの限界を超える](https://ikiform.com/ja/guides/website-builder-forms.md)

Webflow、Netlify、Carrd、Framer のフォームが上限や機能不足に当たったら、デザインしたフォームはそのままに、送信先をフォームバックエンドに変えましょう。

- [Webflow のフォーム送信の上限：その中身と乗り越え方](https://ikiform.com/ja/guides/website-builder-forms/webflow-submission-limit.md): Webflow の無料 Starter プランはサイトごとに 50 件で送信の受け付けが止まり、エクスポートしたサイトでは一切処理されないので、Form Block の送信先を Ikiform に向けましょう。
- [Netlify Forms の上限：100 件を超えると何が起きるか、そして抜け出し方](https://ikiform.com/ja/guides/website-builder-forms/netlify-forms-limit.md): Netlify の旧プランはサイトごとにフォーム送信を計測して自動でアップグレードし、クレジットプランはサイトを一時停止することがあるので、フォームをバックエンドに移しましょう。
- [Carrd のフォーム：送信データをフォームバックエンドに送る](https://ikiform.com/ja/guides/website-builder-forms/carrd-forms.md): Carrd のお問い合わせフォームはメールで届けるだけで、カスタムフォームには Pro Plus が必要です。すべての送信を保存するには、Plus なら Send to URL、Standard なら HTML の埋め込みを使います。
- [Framer のフォーム：フォームバックエンドを追加すべきときと、その方法](https://ikiform.com/ja/guides/website-builder-forms/framer-forms.md): Framer のフォームはメール、Sheets、Webhook に送れます。保存とフィルタリング、チームへの通知、送信先の追加がほしいなら Ikiform を Webhook にします。

## [ウェブサイトやアプリにフィードバックフォームを追加する](https://ikiform.com/ja/guides/feedback-form.md)

どのページにもアプリ内にもフィードバックフォームを設置。評価、コメント、送信元ページ、スパム対策、低評価時の通知まで。

- [ページ、ブラウザー、手順を記録するバグ報告フォームを追加する](https://ikiform.com/ja/guides/feedback-form/bug-report.md): 手順と深刻度は本人に尋ね、URL、ブラウザー、ビューポート、直近のエラーはページが自動で追加するバグ報告フォームです。
- [数えて、順位をつけて、返答できる機能要望を集める](https://ikiform.com/ja/guides/feedback-form/feature-request.md): 解決策ではなく課題を尋ね、要望をテーマ別に保存し、件数ではなく人数で数え、リリース時にメールで知らせる機能要望フォームです。
- [React アプリにフローティングのフィードバックウィジェットを作る](https://ikiform.com/ja/guides/feedback-form/react-feedback-widget.md): React アプリ用のフローティングのフィードバックボタン。小さなパネルを開き、回答ごとに画面、アプリのバージョン、アカウントを送り、下書きを失いません。
- [ベータテスターのフィードバックをビルドごとに集める](https://ikiform.com/ja/guides/feedback-form/beta-tester-feedback.md): テスターとビルドごとの個別リンク、2 つの評価スケール、各ビルドが良くなったかがわかる週次サマリーを備えたベータ版フィードバックフォームです。
- [自分のサイトで NPS アンケートを実施する：メールのリンクからスコアまで](https://ikiform.com/ja/guides/feedback-form/nps-survey.md): メールに 0〜10 のスコアを載せ、スコアに応じて変わる追加質問を自分のページで尋ね、スクリプトで NPS を計算する NPS アンケートを実施します。
- [SaaS の解約フローに解約アンケートを追加する](https://ikiform.com/ja/guides/feedback-form/cancellation-survey.md): SaaS の解約フローで解約理由を尋ね、スキップはワンクリックのまま、理由を Stripe と Ikiform に保存し、解約を決して遅らせない方法。
- [Next.js でアプリ内フィードバックフォームを作る](https://ikiform.com/ja/guides/feedback-form/nextjs.md): Next.js のアプリ内フィードバックフォーム。サーバーアクションがセッションを読み、リクエストからページを取り、ユーザー情報を付けて評価を転送します。
- [Astro でアプリ内フィードバックフォームを作る](https://ikiform.com/ja/guides/feedback-form/astro.md): Astro のアプリ内フィードバックフォーム。ユーザーはミドルウェアの locals から、ページはリクエストから、画面はルートのパターンから取得するアクションを作ります。
- [TanStack Start でアプリ内フィードバックフォームを作る](https://ikiform.com/ja/guides/feedback-form/tanstack-start.md): TanStack Start のアプリ内フィードバックフォーム。セッションのミドルウェア付きの POST サーバー関数、文脈としてのルート ID、リクエストヘッダーから読むページを組み合わせます。
- [React Router でアプリ内フィードバックフォームを作る](https://ikiform.com/ja/guides/feedback-form/react-router.md): React Router 8 のフィードバックフォーム。リソースルートの action が Cookie セッションを読み、レイアウトの fetcher が送信し、JS なしの送信は元のページにリダイレクトします。
- [SvelteKit でアプリ内フィードバックフォームを作る](https://ikiform.com/ja/guides/feedback-form/sveltekit.md): SvelteKit のアプリ内フィードバックフォーム。レイアウトのフォームが 1 つのフォームアクションに送信し、アクションがサーバー側で locals のユーザーとリクエストのページを追加します。
- [Nuxt でアプリ内フィードバックフォームを作る](https://ikiform.com/ja/guides/feedback-form/nuxt.md): Nuxt のアプリ内フィードバックフォーム。ユーザーのセッションを読み、Referer からページを取得し、JavaScript の読み込み前でも動くサーバールートを使います。

## [すぐに手元に届くリード獲得フォームを作る](https://ikiform.com/ja/guides/lead-capture.md)

自分のサイトに置くリード獲得フォームです。返信先付きでメールを送り、チームチャットに通知し、CRM に流し込むので、見込み客がまだいるうちに返信できます。

- [商談の予約までつなげるデモ依頼フォームを作る](https://ikiform.com/ja/guides/lead-capture/demo-request.md): リードを保存してから、名前とメールアドレスを入力済みの状態で訪問者を Cal.com や Calendly に送るデモ予約フォームです。
- [ファイルアップロードなしで見積もり依頼フォームを作る](https://ikiform.com/ja/guides/lead-capture/quote-request.md): 資料をアップロードではなく共有リンクで受け取り、すべての依頼に期限を付け、リンクの多いリードがスパムにならないようにする見積もり依頼フォームです。
- [サービス業向けの相談申し込みフォームを作る](https://ikiform.com/ja/guides/lead-capture/consultation-request.md): 会計士、弁護士、コーチ、クリニック向けの相談申し込みフォームです。連絡方法と時間を尋ね、デリケートな詳細は電話のときに回します。
- [エージェンシーやフリーランス向けのプロジェクト問い合わせフォームを作る](https://ikiform.com/ja/guides/lead-capture/project-inquiry.md): スタジオやフリーランス向けのプロジェクト依頼フォームです。誰かが概要を読む前に、予算と時期で問い合わせを有望、検討、対象外に振り分けます。
- [フォームのリードを HubSpot や Pipedrive に送る](https://ikiform.com/ja/guides/lead-capture/leads-to-crm.md): 署名付きの Ikiform の Webhook を、HubSpot の連絡先 upsert や Pipedrive の人物とリードの呼び出しに変換し、配信がリトライされても連絡先が重複しないようにします。
- [Next.js で見込み客を選別するリードフォームを作る](https://ikiform.com/ja/guides/lead-capture/nextjs.md): Next.js App Router のリードフォームです。サーバーアクションで Zod による検証を行い、ファーストタッチの UTM を Cookie に保持し、条件に合うリードをカレンダーに送ります。
- [Astro で見込み客を選別するリードフォームを作る](https://ikiform.com/ja/guides/lead-capture/astro.md): Actions で作る Astro のリードフォームです。Zod による検証、静的サイトでのファーストタッチの UTM、オンデマンドの問い合わせページ、日程調整ツールへのリダイレクトを扱います。
- [TanStack Start で見込み客を選別するリードフォームを作る](https://ikiform.com/ja/guides/lead-capture/tanstack-start.md): TanStack Start のリードフォームです。ファーストタッチの UTM を記録するグローバルなリクエストミドルウェア、Zod を使うサーバー関数、日程調整ツールへの throw によるリダイレクトを組み合わせます。
- [React Router で見込み客を選別するリードフォームを作る](https://ikiform.com/ja/guides/lead-capture/react-router.md): React Router フレームワークモードのリードフォーム。署名付きのファーストタッチ Cookie を設定するルートのミドルウェア、検証するルートの action、日程調整ツールへのリダイレクトを組み合わせます。
- [SvelteKit で見込み客を選別するリードフォームを作る](https://ikiform.com/ja/guides/lead-capture/sveltekit.md): SvelteKit のリードフォーム。handle フックでファーストタッチの UTM を記録し、フォームアクションで Valibot による検証を行い、redirect() で条件に合うリードをカレンダーに送ります。
- [Nuxt で見込み客を選別するリードフォームを作る](https://ikiform.com/ja/guides/lead-capture/nuxt.md): Nuxt のリードフォーム。サーバーミドルウェアが初回接触の UTM を記録し、Zod で検証する 1 つのサーバールートが fetch とプレーンな送信の両方に応え、有望なリードは商談を予約します。

## [Mailchimp の埋め込みを使わないニュースレター登録フォーム](https://ikiform.com/ja/guides/newsletter-signup.md)

自分のマークアップでニュースレター登録フォームを作り、同意を記録し、ボットの登録を防ぎ、購読者を Kit、MailerLite、beehiiv など任意のツールに渡します。

- [自作のニュースレターフォームでダブルオプトインを行う](https://ikiform.com/ja/guides/newsletter-signup/double-opt-in.md): Ikiform は確認メールを送らないので、ダブルオプトインはメールツールで行います。中継が各登録を未確認として追加し、ツールがリンクを送ります。
- [サーバーなしで、静的サイトにメール登録フォームを置く](https://ikiform.com/ja/guides/newsletter-signup/static-site.md): Hugo、Jekyll、Eleventy、Astro の静的サイトにニュースレター登録フォームを追加し、メールツールの API キーをページに入れず、確認はツールで行います。
- [自作のニュースレターフォームの登録を Kit に送る](https://ikiform.com/ja/guides/newsletter-signup/kit.md): 購読者を作成し、特典メールのために Kit のフォームに追加し、設置場所のタグを付けるリレーで、自作のニュースレターフォームを Kit につなぎます。
- [自作のニュースレターフォームの登録を MailerLite に送る](https://ikiform.com/ja/guides/newsletter-signup/mailerlite.md): 自作の登録フォームを MailerLite につなぎます。リレーが新しい読者をダブルオプトインのために未確認として追加し、購読者に二度確認を求めることはありません。
- [自作のニュースレターフォームの登録を beehiiv に送る](https://ikiform.com/ja/guides/newsletter-signup/beehiiv.md): 自作の登録フォームを beehiiv につなぎます。リレーがダブルオプトインをオンにし、設置場所を UTM ソースに、ページをリファラーにして各購読を作成します。
- [Next.js でニュースレター登録フォームを作る](https://ikiform.com/ja/guides/newsletter-signup/nextjs.md): Next.js のフッターのニュースレターフォームです。同意のチェックと Turnstile を行うサーバーアクションが Ikiform に送信し、ルートハンドラーが読者を Kit に追加します。
- [Astro でニュースレター登録フォームを作る](https://ikiform.com/ja/guides/newsletter-signup/astro.md): プリレンダーされたページのままで使える Astro のニュースレターフォームです。Astro Action が同意を確認して Ikiform に送信し、エンドポイントが読者を MailerLite に追加します。
- [TanStack Start でニュースレター登録フォームを作る](https://ikiform.com/ja/guides/newsletter-signup/tanstack-start.md): TanStack Start のニュースレターフォームです。ページ内での登録にはサーバー関数を、JavaScript なしの予備にはサーバールートを使い、本物の登録を beehiiv に送ります。
- [React Router でニュースレター登録フォームを作る](https://ikiform.com/ja/guides/newsletter-signup/react-router.md): React Router のフッターのニュースレターフォームです。useFetcher が JavaScript なしでも動く /newsletter ルートに送信し、リソースルートが MailerLite に登録を渡します。
- [SvelteKit でニュースレター登録フォームを作る](https://ikiform.com/ja/guides/newsletter-signup/sveltekit.md): レイアウトに置く SvelteKit 3 のニュースレターフォームです。同意と IP ごとの制限を確認するフォームアクション、ページにとどまる use:enhance、Kit 向けの Webhook のルートを組み合わせます。
- [Nuxt でニュースレター登録フォームを作る](https://ikiform.com/ja/guides/newsletter-signup/nuxt.md): JavaScript の有無にかかわらず動く Nuxt のニュースレターフォームです。Turnstile をチェックするサーバールートが Ikiform に送信し、Nitro のルートが beehiiv に登録を渡します。

## [HTML フォームの送信の仕組み](https://ikiform.com/ja/guides/html-form-submission.md)

フォームが送信されたときにブラウザーが行うこと。どのフィールドを送り、どうエンコードし、サーバーは何を返すべきか、そして Ikiform がどう応答するかを解説します。

- [ページを再読み込みせずに HTML フォームを送信する](https://ikiform.com/ja/guides/html-form-submission/without-page-reload.md): fetch と FormData でフォームを送り、訪問者をページにとどめる。フィールドのエラー、読み込み状態、リトライ、スクリプト失敗時のフォールバック付き。
- [フォーム送信後にサンクスページへリダイレクトする](https://ikiform.com/ja/guides/html-form-submission/redirect-after-submit.md): フォーム送信後に訪問者を自分のサンクスページへ送る方法。303 リダイレクト、_redirect フィールド、許可されるドメイン、再読み込みの挙動を解説します。
- [HTML フォームの action 属性を解説](https://ikiform.com/ja/guides/html-form-submission/action-attribute.md): フォームの action 属性の役割、相対値や空の値の解決のされ方、formaction で 1 つのフォームを 2 か所に送る方法、静的ホストが 405 を返す理由を解説します。
- [ブラウザーとサーバーでの HTML フォームのバリデーション](https://ikiform.com/ja/guides/html-form-submission/validation.md): required、type、pattern、min でフォームを検証し、:user-invalid でエラーをスタイリングし、同じルールをフィールド定義でサーバー側にも適用します。

## [自分のサイトで作るイベントの参加登録と出欠フォーム](https://ikiform.com/ja/guides/event-registration.md)

自分のイベントページで出欠を受け付けます。フォーム、同伴者の上限、正確な人数集計、満員時の締め切り、受付リストまで、チケットアプリなしで。

- [自分で作った結婚式サイトに置く出欠フォーム](https://ikiform.com/ja/guides/event-registration/wedding-rsvp.md): 自作の結婚式サイト用の出欠フォーム。招待ごとに 1 回答、名前のあるゲストごとに料理を選び、締め切りと未回答者のリストも用意します。
- [Eventbrite を使わない、無料コミュニティイベントの参加登録](https://ikiform.com/ja/guides/event-registration/without-eventbrite.md): 無料のコミュニティイベントの参加登録を自分のサイトで運営します。セッションの選択、自分のツールからの確認メール、部屋ごとの人数、受付リストまで。
- [イベントやフェスティバル向け、シフトを選べるボランティア募集フォーム](https://ikiform.com/ja/guides/event-registration/volunteer-signup.md): シフトを選べるボランティア募集フォーム。当日の電話番号を集め、人手が足りないシフトを示してシフト表を作るスクリプト付き。

## [フォームの Webhook 署名を検証する](https://ikiform.com/ja/guides/webhook-signature-verification.md)

フォームの Webhook が本当に Ikiform から来たかを確認する方法。Standard Webhooks の HMAC-SHA256 方式、テストベクター、生のボディ、タイムスタンプ、シークレットのローテーションを解説します。

- [Node.js で Webhook の署名を検証する](https://ikiform.com/ja/guides/webhook-signature-verification/nodejs.md): Node.js で Ikiform の Webhook 署名を検証する方法。Express と Fastify での生のボディ、SDK、standardwebhooks パッケージ、テスト済みの node:crypto 版。
- [Python で Webhook の署名を検証する](https://ikiform.com/ja/guides/webhook-signature-verification/python.md): Flask、FastAPI、Django で Ikiform の Webhook 署名を検証する方法。standardwebhooks パッケージか標準ライブラリを使い、pytest のテストも付けます。
- [Go で Webhook の署名を検証する](https://ikiform.com/ja/guides/webhook-signature-verification/go.md): Go の net/http で Ikiform の Webhook 署名を検証する方法。ボディを 1 回だけ読み、crypto/hmac で確認してテストするか、Standard Webhooks ライブラリを使います。
- [PHP と Laravel で Webhook 署名を検証する](https://ikiform.com/ja/guides/webhook-signature-verification/php.md): Ikiform の Webhook 署名を、素の PHP では hash_hmac と hash_equals で、Laravel では Standard Webhooks ライブラリと CSRF の除外で検証します。
- [Ruby と Rails で Webhook 署名を検証する](https://ikiform.com/ja/guides/webhook-signature-verification/ruby.md): Ikiform の Webhook 署名を、Sinatra では OpenSSL と Minitest のテストで、Rails では standardwebhooks gem と request.raw_post で検証します。