> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cookbook.dev/llms.txt
> Use this file to discover all available pages before exploring further.
# React Integration
> Integrate Ask Cookbook with React applications
Use our React component to integrate Ask Cookbook into your React applications.
## Installation
Install the package using your preferred package manager:
```bash theme={null}
npm install @cookbookdev/docsbot
```
```bash theme={null}
yarn add @cookbookdev/docsbot
```
```bash theme={null}
pnpm install @cookbookdev/docsbot
```
## Usage
Import and add the component to a parent component, such as your app's root or layout:
```jsx theme={null}
import AskCookbook from "@cookbookdev/docsbot";
export default function App() {
return (
<>
{/* Your other components */}
);
}
```
## Props
Your API key for Ask Cookbook. Contact [tyler@cookbook.dev](mailto:tyler@cookbook.dev) to get your key.
If `true`, the modal will be always open (useful for showcase purposes).
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:
```jsx theme={null}
// app/layout.js or pages/_app.js
import AskCookbook from "@cookbookdev/docsbot";
export default function RootLayout({ children }) {
return (
{children}
);
}
```
Having trouble with the integration? Contact us at [tyler@cookbook.dev](mailto:tyler@cookbook.dev) for help.