Zero-backend form handling for modern web applications.

PostDrop

Zero-backend form handling for modern web applications.

PostDrop allows you to submit HTML forms directly to the PostDrop API without writing any backend code. Simply collect your form data, call submitForm(), and handle the response.

---

Installation

npm install postdrop

---

Quick Start

import{submitForm}from"postdrop";asyncfunctionhandleSubmit(e){e.preventDefault();constformData=newFormData(e.currentTarget);constres=awaitsubmitForm({publicKey: "YOUR_PUBLIC_KEY",
formData,});if(res.success){console.log("Form submitted successfully!");}else{console.log(res.message);}}

---

API

submitForm(options)

Submits a form to the PostDrop API.

Parameters

Property	Type	Required	Description
publicKey	string	✅	Your PostDrop Project Public Key.
formData	FormData	✅	A FormData object containing all form fields.

Example

import{submitForm}from"postdrop";constformData=newFormData(formElement);constresponse=awaitsubmitForm({publicKey: "YOUR_PUBLIC_KEY",
formData,});

---

Response

The function always resolves with the following object.

Success Response

{success: true,status: 201,message: "Form submitted successfully."}

Error Response

{success: false,status: 400,message: "Invalid Public Key."}

---

Response Fields

Field	Type	Description
success	boolean	Indicates whether the request was successful.
status	number	HTTP status code returned by the server.
message	string	Human-readable message describing the result.

---

Handling Responses

A typical implementation looks like this:

constres=awaitsubmitForm({publicKey: "YOUR_PUBLIC_KEY",
formData,});if(res.success){// Form submitted successfullyconsole.log(res.message);// Reset formform.reset();}else{// Handle errorconsole.error(res.message);}

---

Requirements

• Modern browser with fetch support.
• A valid PostDrop Project Public Key.
• Form data must be provided as a native FormData object.

---

Example (React)

import{submitForm}from"postdrop";functionContactForm(){asyncfunctionhandleSubmit(e){e.preventDefault();constformData=newFormData(e.currentTarget);constres=awaitsubmitForm({publicKey: "YOUR_PUBLIC_KEY",
formData,});if(res.success){alert("Message sent successfully!");e.currentTarget.reset();}else{alert(res.message);}}return(<formonSubmit={handleSubmit}><inputtype="text"name="name"placeholder="Name"required/><inputtype="email"name="email"placeholder="Email"required/><textareaname="message"placeholder="Message"required/><buttontype="submit">
Send
</button></form>);}

---

Error Handling

The package does not throw for API validation errors.

Instead, check the success property:

constres=awaitsubmitForm({publicKey: "YOUR_PUBLIC_KEY",
formData,});if(!res.success){console.error(`Request failed (${res.status})`);console.error(res.message);}

---

TypeScript Support

The package includes TypeScript definitions.

import{submitForm}from"postdrop";constresponse=awaitsubmitForm({publicKey: "YOUR_PUBLIC_KEY",
formData,});console.log(response.success);console.log(response.status);console.log(response.message);

---

Spam Protection (Recommended)

PostDrop supports honeypot spam protection using a hidden field.

Simply add a hidden input named postdrop_honeypot to your form.

React

<inputtype="text"name="postdrop_honeypot"style={{display: "none"}}tabIndex={-1}autoComplete="off"/>

Leave this field empty.

Legitimate users will never interact with this field, while many automated bots will fill it in. If a value is detected, PostDrop automatically rejects the submission as spam.

Documentation

For complete documentation, dashboard setup, and advanced features such as:

• Email Notifications
• Auto Responses
• Spam Protection
• Custom Domains
• Form Entries
• Analytics

visit the official PostDrop documentation.

---

License

MIT