Build your Coming Soon page with AI in under 5 minutes

Build a pre-launch landing page with a live countdown timer, a working email waitlist that captures real signups (with per-IP rate limiting and duplicate-aware DB), and a social-proof counter that updates as people sign up — generated from a single prompt.

仕組み

ステップ 1

アイデアを入力

作りたいものを自然な文章で入力してください。

ステップ 2

AIがビルド

FloopFloopが本番対応コードを即座に生成します。

ステップ 3

デプロイして公開

数分以内に専用サブドメインでプロジェクトが公開されます。

開発者を採用する代わりにAIでビルドする理由

FloopFloop従来の開発者
リリースまでの時間5分未満2〜8週間
費用$0から$5,000〜$50,000以上
メンテナンスプランに含まれる継続的な保守契約

試してみてください

以下のプロンプトをコピーしてFloopFloopに貼り付けてお使いください。

Build a coming-soon page for an AI dev tool launching on September 1, 2026. Dark theme with a violet → cyan gradient headline, big mono countdown timer (days/hours/minutes/seconds), single email field above the fold. Three teaser cards below: 'Faster than you'd expect', 'Private by default', 'Built for one thing'. Social-proof counter underneath showing waitlist size. Twitter, GitHub, LinkedIn, and mailto: footer links.

Create a stealth-mode waitlist page for a B2B SaaS. Magazine-style headline ('Something quietly excellent is on the way.'), countdown to the public-beta date, email capture with a hidden source field set from `?from=` so we can group signups by campaign in SQL. No mention of the actual product features — that's the point.

Design a 'notify me when this is back in stock' page for a limited-drop ecommerce. Big timer counts to the restock date (configurable from `LAUNCH_DATE_ISO` in /lib/launch-config.ts). Single email field. After submit, the form shows 'You're in. We'll email the moment we restock.' Earthy palette (warm browns + cream).

Build a pre-launch page for a paid newsletter. Dark theme but with a serif-italic headline instead of mono. Countdown to the first issue. Email-capture form. A two-sentence 'About the author' section under the timer. No social links, no teaser cards — keep it monolithic.

よくある質問

Where do the email signups actually go?
Every signup is inserted into a `waitlist_subscribers` table in the project's Postgres schema (email, source tag, referrer, IP-hash for rate limiting). The operator triages with `SELECT * FROM waitlist_subscribers ORDER BY created_at DESC`. Email is UNIQUE so double-submits are caught at the DB and the user gets a friendly 'you're already on the list' instead of a duplicate error.
Does the page send a confirmation email?
No — the template can't send email (the codegen scanner blocks every transactional-mail library). The success state says 'you're on the list, we'll be in touch at launch' instead of promising email. The captured address is stored so the operator can send a single launch-day blast from their own ESP.
How do I change the launch date?
One edit in /src/lib/launch-config.ts — set `LAUNCH_DATE_ISO` to a new ISO-8601 timestamp and `LAUNCH_DATE_LABEL` to the human-readable form. The countdown, the hero badge, and the OG metadata all read from that file. No other files touched.
What happens when the countdown hits zero?
The four-cell timer is replaced with a 'We've launched' badge. The waitlist form stays mounted so late-arrivals can still drop their email — most operators forget to flip the page on launch day, and turning the waitlist off automatically would lose those signups.
Is the social-proof counter ('Join 247 founders waiting') real?
Yes — it's a live COUNT(*) on the waitlist_subscribers table, rendered server-side on every page request. Hidden entirely when fewer than 5 people have signed up (lying about an empty waitlist burns trust the instant the first real signer Googles you).
Can I track which channels are driving signups?
Yes. The form has a hidden `source` field that accepts a short campaign tag (a-z, 0-9, dashes, underscores). Pass `?source=ph-launch` or `?source=twitter` in your share URLs, the form reads it at submit, and you can pull `SELECT source, COUNT(*) FROM waitlist_subscribers GROUP BY source` to see what's working.
Is it dark-mode-only?
Default is dark — that's the genre convention. A light-mode palette is provided in globals.css for operators who want a brighter pre-launch identity; flip the `forcedTheme` prop on ThemeProvider in src/app/layout.tsx and the light variables take over.

関連ビルダー

他のカテゴリを探す

ビルドを始めますか?

今すぐプロジェクトのビルドを開始しましょう — コーディング不要。

ビルドを始める