Skip to content

PostDropcom/Postdrop-cdn

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 

Repository files navigation

PostDrop CDN 🚀

The official JavaScript client for PostDrop — a lightweight form backend that lets you receive form submissions without building APIs or configuring SMTP servers.

🌐 Website | 📖 Documentation | 🚀 Get Started

Why PostDrop?

Building a backend just to receive a contact form shouldn't be necessary.

PostDrop handles everything for you:

  • 📩 Receive submissions directly in your inbox
  • ⚡ No backend required
  • 🛡️ Built-in spam protection
  • 🔄 AJAX form submission
  • 📊 View submissions in your dashboard
  • 🎨 Custom success & error messages
  • 🌍 Works with any HTML website
  • ⚛️ Supports React, Next.js, Vite and other frontend frameworks

Perfect For

  • Portfolio Websites
  • Landing Pages
  • Static HTML Sites
  • Personal Blogs
  • Startup MVPs
  • SaaS Landing Pages
  • Frontend-only Projects
  • Indie Hackers

Installation

Add the CDN inside the <head> tag.

<script src="https://cdn.jsdelivr.net/gh/PostDropcom/Postdrop-cdn@main/postdrop.js"></script>

Quick Start

⚠️ Important

PostDrop automatically looks for a form with the ID postdrop-form.

Your form must have:

  • id="postdrop-form"
  • data-public-id="YOUR_PUBLIC_ID"

If the form ID is different, the PostDrop CDN will not detect or submit your form.

<form
    id="postdrop-form"
    data-public-id="YOUR_PUBLIC_ID">

    <input
        type="text"
        name="name"
        placeholder="Your Name"
        required>

    <input
        type="email"
        name="email"
        placeholder="Your Email"
        required>

    <textarea
        name="message"
        placeholder="Your Message"
        required></textarea>

    <button type="submit">
        Send Message
    </button>

</form>

That's it.

PostDrop automatically submits the form, validates the request, blocks spam, stores submissions in your dashboard, and forwards them to your inbox.


Features

  • ✅ Zero dependencies
  • ✅ Lightweight CDN
  • ✅ Works without jQuery
  • ✅ AJAX form submission
  • ✅ No page reload
  • ✅ Loading button state
  • ✅ Success message support
  • ✅ Error message support
  • ✅ Custom success message
  • ✅ Custom success color
  • ✅ Custom error color
  • ✅ Redirect after successful submission
  • ✅ Honeypot spam protection
  • ✅ Multiple forms support
  • ✅ Email notifications
  • ✅ Dashboard to manage entries

Optional Configuration

Customize the behaviour using hidden inputs.

Feature Field
Success Message postdrop_success_message
Success Color postdrop_success_color
Error Color postdrop_error_color
Redirect URL postdrop_redirect_url
Honeypot postdrop_honeypot

Example:

<input
    type="hidden"
    name="postdrop_success_message"
    value="🎉 Message sent successfully!">

<input
    type="hidden"
    name="postdrop_success_color"
    value="#10b981">

<input
    type="hidden"
    name="postdrop_error_color"
    value="#ef4444">

Spam Protection

PostDrop includes built-in honeypot spam protection.

Simply include this hidden field inside your form.

<input
    type="text"
    name="postdrop_honeypot"
    style="display:none"
    tabindex="-1"
    autocomplete="off">

Bots will usually fill this field while real users won't.


Documentation

Complete documentation, examples and guides are available here:

👉 https://postdrop.online/docs


Need React or Next.js?

PostDrop also supports:

  • React
  • Next.js
  • Vite
  • Vanilla JavaScript
  • Fetch API
  • Static HTML

Visit the documentation for framework-specific examples.


License

MIT License © PostDrop

About

The easiest headless form backend API for frontend devs. Receive form submissions directly in your inbox without building backend APIs.

Topics

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages