Agentation Setup

Steps

1. Check if already installed
   • Look for

     agentation

     in package.json dependencies
   • If not found, run

     npm install agentation

     (or pnpm/yarn based on lockfile)
2. Check if already configured
   • Search for

     <Agentation

     or

     import { Agentation }

     in src/ or app/
   • If found, report that Agentation is already set up and exit
3. Detect framework
   • Next.js App Router: has

     app/layout.tsx

     or

     app/layout.js

   • Next.js Pages Router: has

     pages/_app.tsx

     or

     pages/_app.js

4. Add the component
   For Next.js App Router, add to the root layout:
   tsx

   import { Agentation } from "agentation";
   
   // Add inside the body, after children:
   {process.env.NODE_ENV === "development" && <Agentation />}

   For Next.js Pages Router, add to _app:
   tsx

   import { Agentation } from "agentation";
   
   // Add after Component:
   {process.env.NODE_ENV === "development" && <Agentation />}

5. Confirm setup
   • Tell the user to run their dev server and look for the Agentation toolbar (floating button in bottom-right corner)

Notes

• The

  NODE_ENV

  check ensures Agentation only loads in development
• Agentation requires React 18
• No additional configuration needed — it works out of the box