Skip to main content
Use our React component to integrate Ask Cookbook into your React applications.

​
Installation

Install the package using your preferred package manager:
  • npm
  • yarn
  • pnpm
npm install @cookbookdev/docsbot

​
Usage

Import and add the component to a parent component, such as your app’s root or layout: 
import AskCookbook from "@cookbookdev/docsbot";

export default function App() {
  return (
    <>
      <AskCookbook apiKey="YOUR_API_KEY_HERE" />
      {/* Your other components */}
    </>
  );
}

​
Props

​
apiKey
string
required
Your API key for Ask Cookbook. Contact tyler@cookbook.dev to get your key.
​
alwaysOpen
boolean
If true, the modal will be always open (useful for showcase purposes).
​
noFastMode
boolean
If true, disables fast mode switch, forcing the chatbot into detailed mode.

​
Next.js example

For Next.js applications, add the component to your root layout: 
// app/layout.js or pages/_app.js
import AskCookbook from "@cookbookdev/docsbot";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        <AskCookbook apiKey="your-api-key-here" />
        {children}
      </body>
    </html>
  );
}
Having trouble with the integration? Contact us at tyler@cookbook.dev for help.