@sekizlipenguen/connection

A powerful and customizable HTTP client for React Native, React, and Web. This library supports Android, iOS, and Web, providing a seamless experience for handling API requests.

---

Installation

Install the library using npm or yarn:

npm install @sekizlipenguen/connection

yarn add @sekizlipenguen/connection

---

Features

• Supports both fetch and XMLHttpRequest (XHR) as connection types.
• Global configuration for timeout and headers.
• Event-driven progress handling for uploads.
• Fully compatible with React Native 0.60+ and Web.
• Lightweight and easy to use.

---

Usage

Basic Example (GET Request)

import connection from "@sekizlipenguen/connection";

// GET request example
connection.get("https://example.com/api/data").then((response) => {
  console.log(response.data);
}).catch((error) => {
  console.error(error);
});

// Using async/await
async function fetchData() {
  try {
    const response = await connection.get("https://example.com/api/data");
    console.log(response.data);
  } catch (error) {
    console.error(error);
  }
}

fetchData();

POST Request Example

connection.post("https://example.com/api/data", {
  firstName: "John",
  lastName: "Doe",
}).then((response) => {
  console.log(response.data);
}).catch((error) => {
  console.error(error);
});

---

API Methods

Method	Description
get	Sends a GET request
post	Sends a POST request
put	Sends a PUT request
patch	Sends a PATCH request
delete	Sends a DELETE request

Each method accepts the following parameters:

• url: The API endpoint.
• data (optional): The payload for POST, PUT, PATCH requests.
• config (optional): Configuration object (e.g., headers, timeout).

---

Global Configuration

You can set global configurations such as timeout and headers using setConfig.

connection.setConfig({
  timeout: 10000, // 10 seconds
  headers: {
    "Authorization": "Bearer token",
    "Content-Type": "application/json",
  },
});

---

Config Options

Option	Type	Default	Description
connectType	`'fetch'	'xhr'`	'fetch'
headers	Record<string, any>	{}	HTTP headers for the request.
timeout	number	5000 ms	Request timeout in milliseconds.
progress	(event: ProgressEvent)	null	Upload progress callback (for XHR only).

---

Advanced Example

Custom Headers and Timeout

connection.get("https://example.com/api/data", {
  headers: {
    "Authorization": "Bearer token",
  },
  timeout: 10000, // 10 seconds
});

Handling Progress Events (File Upload)

connection.post("https://example.com/api/upload", fileData, {
  headers: {
    "Content-Type": "multipart/form-data",
  },
  progress: (event) => {
    const percentCompleted = Math.round((event.loaded * 100) / event.total);
    console.log(`Upload progress: ${percentCompleted}%`);
  },
});

---

TypeScript Support

This library provides TypeScript definitions for better type safety and autocompletion.

Example

import connection, {Config, ReturnTypeConfig} from "@sekizlipenguen/connection";

const config: Config = {
    headers: {
        "Authorization": "Bearer token",
    },
    timeout: 10000,
};

async function fetchData() {
    try {
        const response: ReturnTypeConfig = await connection.get("https://example.com/api/data", config);
        console.log(response.data);
    } catch (error) {
        console.error(error);
    }
}

fetchData();

---

License

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