Building and Deploying a DialogFlow Chatbot on Google Cloud

 

Introduction

In this blog post, I’ll walk you through my journey of building a restaurant chatbot using DialogFlow and deploying it on Google Cloud Platform.

I wanted to understand conversational AI, especially concepts like large language models (LLMs). While exploring, I realized that Dialogflow provides a great starting point to experiment.

Getting Started with DialogFlow

After reading “The Definitive Guide to Conversational AI with DialogFlow and Google Cloud,” I decided to get hands-on experience. I followed this helpful tutorial as my starting point -https://youtu.be/2e5pQqBvGco?si=bpD5si5nfs8SxeVd

Technical Stack

For this project, I used:

  • Frontend: Basic HTML/CSS/JavaScript (generated with ChatGPT)
  • Backend: FastAPI
  • Database: MySQL
  • Development Tools: Ngrok for local testing

Building the Chatbot

Key Steps:

  1. Create a New Agent: Start by creating a new project in Dialogflow, which acts as your agent.

2. Core Concepts: Understand and implement Dialogflow’s primary components:

  • Intents: Define how the chatbot should respond to user inputs.
  • Entities: Extract specific information from user messages.
  • Contexts: Manage conversation flow.
  • Fulfillments: Write backend logic to handle user queries dynamically.

3. Backend Development:

  • Built using FastAPI.
  • Connected to Dialogflow for testing via Ngrok.
  • Used MySQL as the database.

4. Frontend: A simple, functional UI generated using ChatGPT for display. Include the code snippet given in dialogflow’s integration section in web demo.

Deployment Process

Step 1: Migrating the Database to Google Cloud

  1. Log into Google Cloud Console
  2. Create a new MySQL instance
  3. Export your local database to an SQL file
  4. Upload the SQL file to a Google Cloud Storage bucket
  5. Import the database from the bucket to your Cloud SQL instance
  6. Update your connection settings with:
  • New host IP (Cloud SQL public IP)
  • Cloud database username
  • Cloud database password

Step 2: Deploying the Frontend

  1. Push your code to a GitHub repository
  2. Visit Vercel and create a new project
  3. Connect your GitHub repository
  4. Deploy the frontend through Vercel’s automated process

Step 3: Connecting DialogFlow to Cloud Backend

  1. Create a new Cloud Run Service
  2. Requirements:
  • Add requirements.txt file
  • Include a Procfile (if not using Docker)
  1. Deploy from your GitHub repository
  2. Copy the Cloud Run service URL
  3. Update your DialogFlow fulfillment webhook URL with the Cloud Run endpoint

What’s Next?

In the next blog, I’ll delve deeper into Dialogflow’s core concepts: intents, entities, fulfillments, and contexts, to help you create smarter AI agents. Stay tuned!

You can check out the live chatbot here: Restaurant Website. The source code is available on GitHub: peeplika/Resturant-AI-Agent

Comments

Post a Comment

Popular Posts