Build a Simple Chat App with Gradio and Ollama

Introduction

In the Ollama post, we ran open-source LLMs from the terminal or a notebook.
A chat app is often easier for demos and workshops: type a question in the browser, get an answer back.
This post follows the workshop materials in Workshop_Simple_Chatbot:
- Frontend: Gradio (Python UI in the browser)
- Backend: Ollama (local LLM, for example gemma3:1b or gemma3:4b)

Browser (Gradio UI)  -->  Python app  -->  Ollama  -->  Local LLM
     localhost:7860                         localhost:11434

Prerequisites

Python 3.9+ (we use 3.10 with conda)
Ollama installed and available in your PATH
A terminal and a web browser

Step by Step guide

Step 1: Clone the workshop repo

$ git clone https://github.com/vuminhtue/Workshop_Simple_Chatbot.git
$ cd Workshop_Simple_Chatbot

Step 2: Create a conda environment and install dependencies

$ conda create -n mychat python=3.10 pip -y
$ conda activate mychat
$ pip install -r requirements.txt

requirements.txt includes gradio, requests, and the ollama Python package.

Step 3: Start Ollama and pull a model

In a separate terminal, make sure Ollama is running:

$ ollama serve

Pull a small model for the demo (faster on a laptop):

$ ollama pull gemma3:1b
# optional larger model
$ ollama pull gemma3:4b

Optional environment variables (defaults are fine for local use):
- OLLAMA_API_URL — default http://localhost:11434
- OLLAMA_MODEL — default gemma3:1b

Step 4: Warm up with a tiny Gradio app

app.py is a “Hello” demo so you can confirm Gradio works before wiring the LLM.

import gradio as gr

def hello(name):
    return "Hello " + name + "!"

def main():
    demo = gr.Interface(
        fn=hello,
        inputs=gr.Textbox(lines=2),
        outputs=gr.Textbox(lines=10),
    )
    demo.launch()

if __name__ == "__main__":
    main()

$ python app.py

Open http://localhost:7860. Type a name and you should see Hello <name>!.

Step 5: Run the Ollama chat app

chatapp.py is the real chatbot:
- Sends the conversation to Ollama
- Keeps a simple memory list so follow-up questions have context
- Lets you set temperature and pick a model

import gradio as gr
import ollama

MEMORY = []

def to_text(content):
    if isinstance(content, str):
        return content
    if isinstance(content, dict):
        if "text" in content:
            return str(content["text"])
        return str(content)
    if isinstance(content, list):
        return " ".join(
            str(part["text"]) if isinstance(part, dict) and "text" in part else str(part)
            for part in content
        )
    return str(content)


def chatbot(question, temperature=0.1, model="gemma3:1b"):
    messages = []
    for item in MEMORY:
        messages.append(
            {
                "role": item["role"],
                "content": to_text(item["content"]),
            }
        )

    messages.append({"role": "user", "content": to_text(question)})

    response = ollama.chat(
        model=model,
        messages=messages,
        options=ollama.Options(temperature=temperature),
    )

    answer = response["message"]["content"]
    MEMORY.append({"role": "user", "content": to_text(question)})
    MEMORY.append({"role": "assistant", "content": to_text(answer)})
    return answer


def main():
    demo = gr.Interface(
        fn=chatbot,
        inputs=[
            gr.Textbox(
                label="Question",
                lines=2,
                placeholder="Type your message here...",
            ),
            gr.Slider(
                label="Temperature",
                minimum=0.0,
                maximum=1.0,
                step=0.01,
                value=0.7,
            ),
            gr.Dropdown(
                label="Model",
                choices=["gemma3:1b", "gemma3:4b"],
                value="gemma3:1b",
            ),
        ],
        outputs=gr.Textbox(label="Response", lines=20),
        title="Ollama Chatbot",
        description=(
            "A simple chatbot interface using Ollama models "
            "with adjustable temperature and model selection."
        ),
    )
    demo.launch()


if __name__ == "__main__":
    main()

$ python chatapp.py

Open http://localhost:7860 again.
Ask a question, try a follow-up (memory should help), and compare gemma3:1b vs gemma3:4b or different temperatures.

What the UI controls mean

Question: your user message
Temperature: higher → more creative / random; lower → more focused / deterministic
Model: which local Ollama model answers (must already be pulled)

Tips

Keep ollama serve running while you use the Gradio app.
If the UI loads but answers fail, check that the selected model appears in ollama list.
On a laptop, start with gemma3:1b; use larger models when you have more RAM/GPU.
Restarting the Python process clears MEMORY (conversation history lives in the app process, not on disk).

Summary

Gradio gives you a browser UI with a few lines of Python.
Ollama serves the LLM locally — no cloud API key required for this workshop.
Full materials: github.com/vuminhtue/Workshop_Simple_Chatbot.
Next ideas: add a “Clear chat” button, stream tokens, or connect this UI to a RAG backend so the bot answers from your own documents.