Next.js

Install and configure reactuse for Next.js.

npx create-next-app@latest

Edit tsconfig.json file

Make sure your tsconfig.json includes the following paths configuration:

{
  "compilerOptions": {
    //...
    "baseUrl": ".",
    "paths": {
      "@/*": ["./*"]
    }
    //...
  }
}

Run the CLI

Run the useverse init command to setup your project:

npx useverse@latest init

This will create a configuration file reactuse.json in your project.

Add hooks

You can now start adding hooks to your project:

npx useverse@latest add useBoolean

The command above will add the useBoolean hook to your project. You can then import it like this:

'use client';

import { useBoolean } from '@/shared/hooks';

const Home = () => {
  const [on, toggle] = useBoolean();

  return (
    <div>
      <button onClick={() => toggle()}>Click me</button>
      <p>{on.toString()}</p>
    </div>
  );
};

export default Home;