README.md

---
title: Gradio Example Template
emoji: 💬
colorFrom: indigo
colorTo: purple
sdk: gradio
sdk_version: 5.9.1
app_file: app.py
pinned: false
license: mit
short_description: Example on using Langfuse to trace Gradio applications.
---

# Build a LLM Chat UI with 🤗 Gradio and trace it with 🪢 Langfuse

This is a Gradio example template that showcases how to integrate a Gradio application with Langfuse for LLM Observability and Evaluation. Check out [this cookbook](https://langfuse.com/docs/integrations/other/gradio) for a step-by-step explanation of the code. 

## What is Langfuse?

[Langfuse](https://langfuse.com) is an open-source LLM engineering platform that helps build reliable LLM applications via LLM Application Observability, Evaluation, Experiments, and Prompt Management. 

Langfuse can either be [self-hosted](https://langfuse.com/self-hosting), used via the [Langfuse Cloud](https://cloud.langfuse.com) or deplyoed on Hugging Face Spaces. The [Langfuse Hugging Face Space](https://huggingface.co./spaces/langfuse/langfuse-template-space) allows you to get up and running with a deployed version of Langfuse with just a few clicks. Within a few minutes, you'll have this default Langfuse dashboard deployed and ready for you to connect to from your local machine.

<a  href="https://huggingface.co./spaces/langfuse/langfuse-template-space">
    <img src="https://huggingface.co./datasets/huggingface/badges/resolve/main/deploy-to-spaces-lg.svg" />
</a>

## What is Gradio?

[Gradio](https://github.com/gradio-app/gradio) is an open-source Python library that enables quick creation of web interfaces in Hugging Face for machine learning models, APIs, and Python functions. It allows developers to wrap any Python function with an interactive UI that can be easily shared or embedded, making it ideal for demos, prototypes, and ML model deployment. See [docs](https://www.gradio.app/docs) for more details.

## Features of this Template

This template will show you how to

1. Build a simple chat interface in Python and rendering it using [Gradio `Chatbot`](https://www.gradio.app/docs/gradio/chatbot)
2. Add [Langfuse Tracing](https://langfuse.com/docs/tracing) to the chatbot
3. Implement additional Langfuse tracing features used frequently in chat applications: [chat sessions](https://langfuse.com/docs/tracing-features/sessions), [user feedback](https://langfuse.com/docs/scores/user-feedback)

## Troubleshooting

1. Make sure your notebook runs locally in app mode using `python app.py`
2. Check that all required packages are listed in `requirements.txt`
3. Check Space logs for any Python errors

For more help, open a support thread on [GitHub discussions](https://langfuse.com/discussions) or [open an issue](https://github.com/langfuse/langfuse/issues).

🙏 Thank you to [@tkmamidi](https://github.com/tkmamidi) for the original implementation and contributions to this notebook.