> ## Documentation Index
> Fetch the complete documentation index at: https://docs.zopio.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# NUQS

> A powerful library for managing URL search parameters in your application. It provides a simple and efficient way to handle state management through URL search parameters.

### Installation

To install NUQS, simply run the following command:

```sh Terminal theme={"system"}
pnpm add nuqs
```

### Usage

Here is an example of how to use NUQS for URL search parameter state management:

```tsx my-component.tsx theme={"system"}
import { useSearchParams } from 'nuqs';

function MyComponent() {
  const [searchParams, setSearchParams] = useSearchParams();

  const handleInputChange = (event) => {
    setSearchParams({ query: event.target.value });
  };

  return (
    <div>
      <input
        type="text"
        value={searchParams.query || ''}
        onChange={handleInputChange}
      />
      <p>Search Query: {searchParams.query}</p>
    </div>
  );
}
```

In this example, the `useSearchParams` hook from NUQS is used to manage the state of the search query through URL search parameters. The `setSearchParams` function updates the URL search parameters whenever the input value changes.

### Benefits

* <Icon icon="check" iconType="solid" /> **Simplified State Management**: NUQS simplifies state management by using URL search parameters, making it easy to share and persist state across different parts of your application.
* <Icon icon="check" iconType="solid" /> **SEO-Friendly**: By using URL search parameters, NUQS helps improve the SEO of your application by making the state accessible through the URL.
* <Icon icon="check" iconType="solid" /> **Easy Integration**: NUQS is easy to integrate into your existing React application, providing a seamless experience for managing URL search parameters.

For more information and detailed documentation, visit the [NUQS website](https://nuqs.47ng.com/).