# How to Integrate Dialogflow Messenger with React.js

> To integrate the chatbot, open the Dialogflow left-side panel, select Integrations, and choose Dialogflow Messenger under the Text Based section. Next, copy the generated code and paste it directly into your React.js app public/index.html file right before the end body tag.

Canonical: https://livedemo.ai/tutorials/how-to-integrate-dialogflow-messenger-with-react-js/
Apps: Dialogflow
Updated: 2026-10-05
Interactive demo: https://story-api.livedemo.ai/workspaces/62255d3d3304f17b8f5e2d03/stories/692a421fab56e05a00feaa65/preview?step=1

## Steps

1. Go to the left-side panel and click 'Integrations'.
2. Under the Text Based section, find and select 'Dialogflow Messenger'.
3. Tap the 'Copy' button next to the generated code.
4. Finally, go to your React.js app and paste the code in public/index.html right before the end body tag.