How I Built a Donation Website in 8 Hours (And Why)
Source: Dev.to
The Mission
Yesterday, I built hoki.help – a donation platform for HoKi NÖ, a children’s hospice organization in Lower Austria. HoKi supports families with seriously ill children, from diagnosis through illness to bereavement support, completely free of charge.
Tech Stack
| Component | Technology |
|---|---|
| Framework | Next.js 14 (App Router) |
| Styling | Tailwind CSS |
| Payments | Stripe Checkout |
| Database | Neon (Serverless Postgres) |
| Hosting | Vercel |
| Domain | hoki.help |
Features Built in ~8 Hours
- ✅ Responsive landing page (mobile‑first)
- ✅ Donation widget (€10 / €25 / €50 / €100 + custom amounts)
- ✅ One‑time and monthly recurring donations
- ✅ Anonymous donation option
- ✅ Stripe Checkout integration
- ✅ Webhook handling for donation tracking
- ✅ Donation barometer (shows progress after €500)
- ✅ Legal pages (Impressum, Privacy Policy – GDPR compliant)
- ✅ FAQ section with Schema.org structured data
- ✅ SEO optimization
Why Use Stripe Checkout for PCI Compliance?
Stripe Checkout is secure, trusted, and supports Apple Pay / Google Pay out of the box, so we don’t need to handle PCI compliance ourselves. We only store aggregate donation statistics (total amount, count). Neon’s serverless Postgres in Frankfurt keeps the data within the EU, and I already use it for other projects.
Donation Experience
Donations should be frictionless: no registration, no passwords—just donate and go. Donors can choose to remain anonymous; their name isn’t stored or shared with the charity—only Stripe sees it for payment processing.
🔗 hoki.help – 100 % of donations go to HoKi NÖ. I cover all hosting costs through my company.
Have questions about the implementation? Drop a comment below!
Built with ❤️ for the children and families supported by HoKi NÖ.