@enesusta/url-query-builder v1.0.0

url-query-builder builds a URL query with objects instead of the key-value model.

☕️ Features

• Small and lightweight ( Only 313 Byte )
• %100 Code Coverage

🕺 Install

by using npm:

$ npm i @enesusta/url-query-builder

by using yarn:

$ yarn add @enesusta/url-query-builder

url-query-builder supports either CommonJS modules and ECMAScript modules. It means that you can use it either in browser or Node.js.

Examples

Node.js

const UrlQueryBuilder = require('@enesusta/url-query-builder');

const host = "https://superiorapi.com/human";
const entry = {
    name: "Enes",
    age: 22
};

const builder = new UrlQueryBuilder(entry);
const query = host + builder.build();

console.log(query); // https://superiorapi.com/human?name=Enes&age=22

React

You can use it with ECMAScript modules as well.

Let's look at the example listed below that demonstrates how behaves url-query-builder as a state object.

import React, {useState} from 'react'
import UrlQueryBuilder from '@enesusta/url-query-builder';

export const Example = () => {
    const [query, setQuery] = useState({name: "enes", age: 22});
    const q = new UrlQueryBuilder(query);
    const host = "https://mysuperiorapi.com/human";

    const nameHandler = e => {
        setQuery({...query, name: e.target.value});
    }

    const ageHandler = e => {
        setQuery({...query, age: e.target.value});
    }

    return (
        <div>
            <input type="text" onChange={nameHandler}/>
            <input type="text" onChange={ageHandler}/> <br/> <br />
            Object is {JSON.stringify(query)}; <br /> <br />              
            Query is {host + q.build()}
        </div>
    );
};

Made with

• Rollup

License

MIT © enesusta