Featured image for Streamlit AI App: Build and Deploy in 30 Minutes (2026)
Tutorials · · 10 min read

Streamlit AI App: Build and Deploy in 30 Minutes (2026)

Learn how to build and deploy an AI chatbot with Streamlit and Python. Complete step-by-step tutorial from zero to production-ready AI app.

StreamlitPythonAIchatbotOpenAIdeploymenttutorial

Building AI-powered applications used to require a team of frontend developers, backend engineers, and months of work. Last week, I built and deployed a fully functional AI chatbot during my lunch break.

That’s not an exaggeration—Streamlit AI apps have changed the game for anyone who knows Python but doesn’t want to wrestle with web development. If you can write a Python script, you can build an interactive AI application and have it live on the internet in 30 minutes or less.

In this tutorial, I’ll walk you through building a complete AI chatbot from scratch using Streamlit and OpenAI’s GPT-5.2. By the end, you’ll have a working app deployed to the cloud that anyone can use.

No HTML. No CSS. No JavaScript. Just Python and a bit of magic.

What Is Streamlit?

Streamlit is an open-source Python library that transforms Python scripts into interactive web applications. It was created specifically for data scientists and ML engineers who want to share their work without becoming full-stack developers.

Here’s what makes it special: you write pure Python, and Streamlit handles everything else. User input? A single line of code. Charts and graphs? Another line. Chat interfaces? Streamlit’s got you covered.

When I first discovered Streamlit, I was skeptical. I’d spent years fighting with Flask templates and React components just to build simple demo interfaces. The idea that I could skip all that seemed too good to be true. But after building my first app in about 20 minutes, I was hooked.

Why Streamlit for AI Apps?

There are other ways to build AI interfaces—Flask, FastAPI, Gradio, Panel—but Streamlit excels for a few reasons:

Dead simple syntax. Most Streamlit elements are single function calls. Want a button? st.button("Click me"). Want a text input? st.text_input("Enter something"). The learning curve is almost nonexistent if you know Python.

Built-in chat components. Streamlit’s st.chat_message and st.chat_input are designed specifically for conversational AI. You’re not hacking together a chat interface from generic components.

Session state management. AI chats need memory—you need to remember what was said before. Streamlit’s session state makes this trivial instead of a major architectural headache.

Free deployment. Streamlit Community Cloud lets you deploy public apps for free. No credit card, no complicated cloud setup.

Prerequisites and Setup

Let’s get your environment ready. You’ll need:

  • Python 3.9 or higher (I recommend 3.11 for best compatibility)
  • A code editor (VS Code, PyCharm, whatever you prefer)
  • An OpenAI API key (get one at platform.openai.com)

Creating Your Project

Open your terminal and set up a new project:

# Create project directory
mkdir streamlit-ai-chat
cd streamlit-ai-chat

# Create virtual environment
python -m venv venv

# Activate it
# On Mac/Linux:
source venv/bin/activate
# On Windows:
venv\Scripts\activate

# Install dependencies
pip install streamlit openai python-dotenv

Create a requirements.txt file (you’ll need this for deployment):

streamlit>=1.28.0
openai>=1.12.0
python-dotenv>=1.0.0

Finally, create a .env file for your API key:

OPENAI_API_KEY=sk-your-api-key-here

Important: Never commit your .env file to Git. Add it to your .gitignore immediately.

Core Streamlit Concepts for AI Apps

Before we dive into building, let’s understand the key concepts that make AI apps work in Streamlit.

The Execution Model

Here’s something that trips up newcomers: Streamlit re-runs your entire script from top to bottom every time something changes—a button click, a text input, anything. This is different from traditional web apps where only specific handlers fire.

This means you need to think carefully about what runs on every interaction. Expensive operations (like API calls) need to be managed carefully.

Session State: Your App’s Memory

Session state is how you persist data between script reruns. For a chatbot, this is where conversation history lives.

import streamlit as st

# Initialize session state
if "messages" not in st.session_state:
    st.session_state.messages = []

This pattern checks if messages exists and creates an empty list if it doesn’t. The key insight: this only runs once per session, not on every rerun.

Chat Components

Streamlit provides purpose-built components for conversational interfaces:

# Display a chat message
with st.chat_message("user"):
    st.write("Hello, AI!")

with st.chat_message("assistant"):
    st.write("Hello! How can I help you today?")

# Get user input
user_input = st.chat_input("Type your message...")

The st.chat_message context manager creates properly styled chat bubbles with avatars. The st.chat_input creates a text input fixed at the bottom of the page—exactly what users expect from a chat interface.

Building Your First AI Chatbot

Let’s build a complete, working chatbot. Create a file called app.py:

import streamlit as st
from openai import OpenAI
import os
from dotenv import load_dotenv

# Load environment variables
load_dotenv()

# Initialize OpenAI client
client = OpenAI(api_key=os.getenv("OPENAI_API_KEY"))

# Page configuration
st.set_page_config(
    page_title="AI Chat Assistant",
    page_icon="🤖",
    layout="centered"
)

st.title("🤖 AI Chat Assistant")
st.caption("Powered by GPT-5.2")

# Initialize chat history
if "messages" not in st.session_state:
    st.session_state.messages = []

# Display chat history
for message in st.session_state.messages:
    with st.chat_message(message["role"]):
        st.markdown(message["content"])

# Chat input
if prompt := st.chat_input("What would you like to know?"):
    # Add user message to history
    st.session_state.messages.append({"role": "user", "content": prompt})
    
    # Display user message
    with st.chat_message("user"):
        st.markdown(prompt)
    
    # Generate AI response
    with st.chat_message("assistant"):
        with st.spinner("Thinking..."):
            response = client.chat.completions.create(
                model="gpt-5.2",
                messages=[
                    {"role": "system", "content": "You are a helpful assistant."},
                    *st.session_state.messages
                ],
                temperature=0.7
            )
            assistant_message = response.choices[0].message.content
            st.markdown(assistant_message)
    
    # Add assistant message to history
    st.session_state.messages.append({"role": "assistant", "content": assistant_message})

Run it locally:

streamlit run app.py

Your browser opens automatically to http://localhost:8501, and you’ve got a working AI chatbot. That’s it. Seriously.

When I showed this to a colleague who’d spent weeks building a similar app with React and Node.js, his reaction was… let’s say he had some regrets about his technology choices.

Understanding the Code

Let’s break down what’s happening:

  1. Initialization: We load the API key and configure the page

  2. Session state check: if "messages" not in st.session_state ensures we only create the messages list once

  3. History display: The for loop renders all previous messages every time the script runs

  4. Input handling: if prompt := st.chat_input(...) uses Python’s walrus operator—it assigns and checks in one step

  5. API call: We send the full conversation history to OpenAI, maintaining context

  6. State update: Both user and assistant messages get appended to the history

Adding Advanced Features

Our basic chatbot works, but let’s make it more robust and feature-rich.

System Prompt Customization

Give users control over the AI’s personality:

# Add to the sidebar
with st.sidebar:
    st.header("Settings")
    
    system_prompt = st.text_area(
        "System Prompt",
        value="You are a helpful, friendly AI assistant.",
        help="Define how the AI should behave"
    )
    
    temperature = st.slider(
        "Creativity",
        min_value=0.0,
        max_value=2.0,
        value=0.7,
        step=0.1,
        help="Higher = more creative, Lower = more focused"
    )

Then update the API call to use these values:

response = client.chat.completions.create(
    model="gpt-5.2",
    messages=[
        {"role": "system", "content": system_prompt},
        *st.session_state.messages
    ],
    temperature=temperature
)

Clear Chat Button

Users need a way to start fresh:

with st.sidebar:
    if st.button("🗑️ Clear Chat", use_container_width=True):
        st.session_state.messages = []
        st.rerun()

Error Handling

Production apps need to handle failures gracefully:

try:
    response = client.chat.completions.create(
        model="gpt-5.2",
        messages=[
            {"role": "system", "content": system_prompt},
            *st.session_state.messages
        ],
        temperature=temperature
    )
    assistant_message = response.choices[0].message.content
    st.markdown(assistant_message)
    
except Exception as e:
    st.error(f"Something went wrong: {str(e)}")
    assistant_message = "I'm sorry, I encountered an error. Please try again."
    st.markdown(assistant_message)

Streaming Responses

For a better user experience, stream responses instead of waiting for the complete answer:

with st.chat_message("assistant"):
    message_placeholder = st.empty()
    full_response = ""
    
    stream = client.chat.completions.create(
        model="gpt-5.2",
        messages=[
            {"role": "system", "content": system_prompt},
            *st.session_state.messages
        ],
        temperature=temperature,
        stream=True
    )
    
    for chunk in stream:
        if chunk.choices[0].delta.content:
            full_response += chunk.choices[0].delta.content
            message_placeholder.markdown(full_response + "▌")
    
    message_placeholder.markdown(full_response)
    assistant_message = full_response

This creates the familiar “typing” effect where text appears progressively.

Deploying to Streamlit Cloud

Your app works locally. Now let’s put it on the internet.

Prepare for Deployment

  1. Create requirements.txt (if you haven’t already):
streamlit>=1.28.0
openai>=1.12.0

Note: We don’t need python-dotenv for deployment—Streamlit Cloud handles secrets differently.

  1. Remove the dotenv code from your app:
# Remove these lines:
# from dotenv import load_dotenv
# load_dotenv()

# Change the client initialization to:
client = OpenAI(api_key=st.secrets["OPENAI_API_KEY"])
  1. Push to GitHub:
git init
git add .
git commit -m "Initial commit"
git remote add origin https://github.com/yourusername/streamlit-ai-chat.git
git push -u origin main

Deploy on Streamlit Cloud

  1. Go to share.streamlit.io
  2. Click “New app”
  3. Connect your GitHub account
  4. Select your repository and the app.py file
  5. In “Advanced settings,” add your secret:
    • Key: OPENAI_API_KEY
    • Value: Your actual API key

Click “Deploy” and wait a few minutes. Your app is now live at https://yourusername-yourrepo-main-xxxxx.streamlit.app.

I’ve deployed dozens of apps this way, and the simplicity never gets old. Compare this to configuring AWS, Docker containers, nginx, SSL certificates… Streamlit Cloud is a revelation for quick deployments.

Alternative Deployment Options

Streamlit Cloud is great for public apps, but you have other options:

Docker Containerization

For more control or private deployments:

FROM python:3.11-slim

WORKDIR /app

COPY requirements.txt .
RUN pip install -r requirements.txt

COPY . .

EXPOSE 8501

CMD ["streamlit", "run", "app.py", "--server.port=8501", "--server.address=0.0.0.0"]

Build and run:

docker build -t my-streamlit-app .
docker run -p 8501:8501 -e OPENAI_API_KEY=your-key my-streamlit-app

Hugging Face Spaces

Upload your app folder to a Hugging Face Space configured for Streamlit. It’s free and gives you access to Hugging Face’s ecosystem.

Cloud Providers

For enterprise deployments, AWS (ECS/Fargate), Google Cloud Run, and Azure Container Apps all work well with dockerized Streamlit apps.

Using Other AI Models

OpenAI isn’t your only option. Here’s how to use Claude:

from anthropic import Anthropic

client = Anthropic(api_key=st.secrets["ANTHROPIC_API_KEY"])

response = client.messages.create(
    model="claude-sonnet-4.5",
    max_tokens=1024,
    messages=st.session_state.messages
)
assistant_message = response.content[0].text

Or Google’s Gemini:

import google.generativeai as genai

genai.configure(api_key=st.secrets["GOOGLE_API_KEY"])
model = genai.GenerativeModel('gemini-3.0-pro')

response = model.generate_content(prompt)
assistant_message = response.text

For detailed API tutorials, see our OpenAI API guide and Claude API tutorial.

Frequently Asked Questions

Is Streamlit free to use?

The Streamlit library is completely free and open-source. Streamlit Community Cloud offers free deployment for public apps. For private apps or enterprise features, paid plans are available.

How does Streamlit compare to Gradio?

Both are excellent for building AI demos quickly. Gradio is slightly more ML-focused with built-in support for model inputs/outputs. Streamlit is more general-purpose and offers more flexibility for custom interfaces. I use Streamlit when I need more control over the UI.

Can I use Streamlit for production applications?

Yes, with caveats. Streamlit is great for internal tools, demos, and moderate traffic. For high-scale production with thousands of concurrent users, you might want a traditional web framework. That said, many companies run successful internal tools on Streamlit.

How do I handle secrets in production?

Use Streamlit’s secrets management (st.secrets) for Cloud deployments. For Docker/self-hosted, use environment variables. Never hardcode API keys in your source code.

Can I customize the look and feel?

Yes! Streamlit supports custom CSS, theming, and you can inject raw HTML when needed. It won’t replace a custom-designed React app, but you can make Streamlit apps look quite polished.

What’s Next?

You’ve just built and deployed an AI chatbot faster than most people configure their development environment. Here’s where to go from here:

  1. Add RAG capabilities by connecting your chatbot to a vector database—check out our RAG chatbot tutorial
  2. Explore the component library for charts, maps, data editors, and more
  3. Try multi-page apps for more complex applications
  4. Connect to databases and build full data applications

The best way to learn Streamlit is to build things. Start with a simple idea, get it working, then add features. Before you know it, you’ll be building sophisticated AI applications that would have seemed impossible a few years ago.

For more AI productivity tools that can transform your workflow, explore our guides.

Now go build something amazing—and enjoy your reclaimed lunch breaks.

Found this helpful? Share it with others.

Vibe Coder avatar

Vibe Coder

AI Engineer & Technical Writer
5+ years experience

AI Engineer with 5+ years of experience building production AI systems. Specialized in AI agents, LLMs, and developer tools. Previously built AI solutions processing millions of requests daily. Passionate about making AI accessible to every developer.

AI Agents LLMs Prompt Engineering Python TypeScript