quickx - Form and data handling Library for React + vite

🌟 Features

• Seamless form handling.
• Supports multiple data types: multipart/form-data, application/json, etc.
• Customizable headers.
• React compatibility.
• Built-in error handling.
• Easy data fetching with quickget.

🛠️ Installation

npm install quickx

🚀 Usage

Basic Example

import React from 'react';
import { quickpost } from 'quickx';

const App = () => {
  //use your api for posting data
  const handleSignupFormSubmit = quickpost('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 />
          <button type="submit">Submit</button>
        </form>
      )}
    </div>
  );
};

export default App;

Data Fetching Example

import React, { useEffect, useState } from 'react';
import { quickget } from 'quickx';

const App = () => {
  const [data, setData] = useState([]);

  const fetchData = async () => {
    const result = await quickget('https://jsonplaceholder.typicode.com/posts')();
    setData(result);
  };

  useEffect(() => {
    fetchData();
  }, []);

  return (
    <ul>
      {data.map(item => (
        <li key={item.id}>{item.title}</li>
      ))}
    </ul>
  );
};

export default App;

🛠️ API

quickpost(url, customHeaders)

• Parameters:
  • url: Endpoint for form submission.
  • customHeaders: Optional custom headers.
• Returns: Function to handle form submission.

quickget(url, customHeaders, params)

• Parameters:
  • url: API endpoint for data fetching.
  • customHeaders: Optional custom headers.
  • params: Optional URL parameters.
• Returns: Async function to fetch data.

📜 License

MIT

👤 Author

MR GAURI SHANKAR KHADGA
LinkedIn Profile

KEEP CODIN ❤️