https://github.com/abhishek72340/chatbot-flow-builder
The Chatbot Flow Builder designed to help users visually create and manage chatbot workflows.
https://github.com/abhishek72340/chatbot-flow-builder
dnd reactflow reactjs
Last synced: about 2 months ago
JSON representation
The Chatbot Flow Builder designed to help users visually create and manage chatbot workflows.
- Host: GitHub
- URL: https://github.com/abhishek72340/chatbot-flow-builder
- Owner: abhishek72340
- Created: 2024-05-19T11:57:21.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2024-05-19T21:50:41.000Z (about 2 years ago)
- Last Synced: 2026-01-03T10:30:10.949Z (5 months ago)
- Topics: dnd, reactflow, reactjs
- Language: JavaScript
- Homepage: https://chatbot--flow-builder.vercel.app/
- Size: 57.6 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Chatbot flow builder
## Features
- **Drag and Drop Interface:** Easily add and connect nodes to build chatbot workflows.
- **Customizable Nodes:** Edit node properties and labels to tailor the chatbot's responses.
- **Visual Workflow Editor:** Use a visual editor to manage and organize conversation paths.
- **Integration with React Flow:** Seamlessly integrates with React Flow for an enhanced user experience.
- **React DnD for Interactivity:** Utilizes React DnD for smooth drag-and-drop functionality.
## Installation
1. Clone the repository:
```bash
git clone https://github.com/yourusername/chatbot-flow-builder.git
cd chatbot-flow-builder
```
2. Install dependencies:
```bash
npm install
```
3. Start the development server:
```bash
npm run dev
```
## Usage
1. **Connect Nodes:** Drag and drop nodes onto the canvas and connect them to define the conversation flow.
2. **Edit Node Properties:** Click on a node to open the settings panel and customize the node's properties.
3. **Save Workflow:** Once the workflow is complete, save your configuration for future use.