# 🚀 dpost - The Ultimate Form Submission Library for React

Welcome to **dpost**! 🌟 A powerful, flexible, and user-friendly library designed to streamline form submissions in your React applications using Axios. With `dpost`, sending data to your backend has never been easier! 🎉

## 🌟 Features

- **Seamless Form Handling**: Get started with minimal setup—just wrap your forms!
- **Multiple Data Types**: Easily support various content types like `multipart/form-data`, `application/json`, and more.
- **Customizable Headers**: Tailor your requests with custom headers as needed.
- **React Compatibility**: Built specifically for React applications.
- **Built-in Error Handling**: Comprehensive error logging for hassle-free debugging.

## 📚 Table of Contents

- [Installation](#installation)
- [Usage](#usage)
  - [Basic Example](#basic-example)
  - [Advanced Example](#advanced-example)
- [API](#api)
- [License](#license)
- [Author](#author)

## 🛠️ Installation

You can easily install `dpost` using npm or yarn:

```bash
npm install dpost

or

yarn add dpost

🚀 Usage

Basic Example

Here's how you can use dpost in your React component to handle a signup form:

import React from 'react';
import dpost from 'dpost'; // Import the dpost library

const App = () => {
  const handleSignupFormSubmit = dpost('http://localhost:8000/signup');

  return (
    <div>
      <h2>🎉 Signup Form</h2>
      {handleSignupFormSubmit(
        <form>
          <input type="text" name="name" placeholder="Name" required />
          <input type="password" name="password" placeholder="Password" required />
          <input type="tel" name="phone" placeholder="Phone" required />
          <input type="text" name="address" placeholder="Address" required />
          <input type="number" name="age" placeholder="Age" required />
          <input type="file" name="file" required />
          <input type="file" name="image" accept="image/*" required />
          <input type="file" name="video" accept="video/*" required />
          <button type="submit">Submit</button>
        </form>
      )}
    </div>
  );
};

export default App;

Advanced Example

Customize your requests with headers and different content types:

import React from 'react';
import dpost from 'dpost';

const App = () => {
  const handleSignupFormSubmit = dpost('http://localhost:8000/signup'); 
  const handleSimpleFormSubmit = dpost('http://localhost:8000/simple');

  return (
    <div>
      <h2>🎉 Signup Form</h2>
      {handleSignupFormSubmit(
        <form>
          <input type="text" name="name" placeholder="Name" required />
          <input type="file" name="file" required />
          <input type="file" name="image" accept="image/*" required />
          <input type="file" name="video" accept="video/*" required />
          <button type="submit">Submit</button>
        </form>
      )}

      <h2>🔍 Simple Form</h2>
      {handleSimpleFormSubmit(
        <form>
          <input type="text" name="name" placeholder="Name" required />
          <input type="number" name="age" placeholder="Age" required />
          <button type="submit">Submit</button>
        </form>
      )}
    </div>
  );
};

export default App;

🛠️ API

dpost(url, customHeaders)

• Parameters:

  • url (string): The endpoint URL where the form data will be submitted.
  • customHeaders (object): Optional custom headers for the request.

• Returns: A function that takes a form JSX element and returns the same element with a submission handler.

📜 License

This project is licensed under the MIT License - see the LICENSE file for details.

👤 Author

MR GAURI SHANKAR KHADGA
LinkedIn Profile

Thank you for considering dpost! If you have any questions or suggestions, feel free to reach out. Happy coding! 💻✨