> ## Documentation Index
> Fetch the complete documentation index at: https://use-any-hook-d92674ab.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Usage

> Now we can see an example of how to use **use-any-hook** package.

**First:** Import your desired hook.

```javascript component.tsx theme={null}
import { useDebounce } from "use-any-hook";
```

**Second:** Use it the rgiht way as the [documentation](/hooks/use-debounce).

```javascript theme={null}
function MyComponent() {
  const [searchTerm, setSearchTerm] = useState("");
  const debouncedSearchTerm = useDebounce(searchTerm, 1000);

  const handleSearch = async () => {
    const response = await fetch(
      `https://dummyjson.com/products/search?q=${debouncedSearchTerm}`
    );
  };

  useEffect(() => {
    handleSearch();
    // This will be called after (1000ms = 1second) from your last keypress
  }, [debouncedSearchTerm]);

  return (
    <input
      type="text"
      value={searchTerm}
      onChange={(e) => setSearchTerm(e.target.value)}
    />
  );
}
```