Agent skill

organizing-streamlit-code

Organizing Streamlit code for maintainability. Use when structuring apps with separate modules and utilities. Covers separation of concerns, keeping UI code clean, and import patterns.

Stars 145
Forks 10

Install this agent skill to your Project

npx add-skill https://github.com/streamlit/agent-skills/tree/main/developing-with-streamlit/skills/organizing-streamlit-code

SKILL.md

Streamlit code organization

For most simple apps, keep everything in one file—it's cleaner and more straightforward. The app file should read like a normal Python script for data processing, with a few Streamlit commands sprinkled in.

Name the main file streamlit_app.py (Streamlit's default).

When to split

Keep in one file (most apps):

  • Apps under ~1000 lines
  • One-off scripts and prototypes
  • Apps where logic is straightforward

Consider splitting when:

  • Data processing is complex (50+ lines of non-UI code)
  • Multiple pages share logic
  • You want to test business logic separately

If splitting makes sense, here's how to organize it.

Directory structure

my-app/
├── streamlit_app.py      # Main entry point
├── app_pages/            # Page UI modules
│   ├── dashboard.py
│   └── settings.py
└── utils/                # Business logic & helpers
    ├── data.py
    └── api.py

Separating UI from logic

When you do split, keep Streamlit files focused on UI and move complex logic to utility modules:

python
# streamlit_app.py - UI-focused
import streamlit as st
from utils.data import load_sales_data, compute_metrics

st.title("Sales Dashboard")

start = st.date_input("Start")
end = st.date_input("End")

data = load_sales_data(start, end)
metrics = compute_metrics(data)

st.metric("Revenue", f"${metrics['revenue']:,.0f}")
st.dataframe(data)

Avoid if name == "main"

Streamlit apps run the entire file on each interaction. Don't use the main guard in Streamlit files.

python
# BAD - don't do this in streamlit_app.py or pages
if __name__ == "__main__":
    main()

# GOOD - just put the code directly
import streamlit as st

st.title("My App")

The main guard is fine in utility modules for quick testing:

python
# utils/data.py
def load_data(path):
    ...

# Optional: test this module directly with `python utils/data.py`
if __name__ == "__main__":
    print(load_data("test.csv"))

References

Expand your agent's capabilities with these related and highly-rated skills.

streamlit/agent-skills

template-skill

Replace with description of the skill and when to use it.

145 10
Explore
streamlit/agent-skills

developing-with-streamlit

**[REQUIRED]** Use for ALL Streamlit tasks: creating, editing, debugging, beautifying, styling, theming, optimizing, or deploying Streamlit applications. Also required for building custom components (inline or packaged), using st.components.v2, or any HTML/JS/CSS component work. Triggers: streamlit, st., dashboard, app.py, beautify, style, CSS, color, background, theme, button, widget styling, custom component, st.components, packaged component, pyproject.toml, asset_dir, CCv2, HTML/JS component.

145 10
Explore
streamlit/agent-skills

building-streamlit-chat-ui

Building chat interfaces in Streamlit. Use when creating conversational UIs, chatbots, or AI assistants. Covers st.chat_message, st.chat_input, message history, and streaming responses.

145 10
Explore
streamlit/agent-skills

building-streamlit-multipage-apps

Building multi-page Streamlit apps. Use when creating apps with multiple pages, setting up navigation, or managing state across pages.

145 10
Explore
streamlit/agent-skills

displaying-streamlit-data

Displaying charts, dataframes, and metrics in Streamlit. Use when visualizing data, configuring dataframe columns, or adding sparklines to metrics. Covers native charts, Altair, and column configuration.

145 10
Explore
streamlit/agent-skills

creating-streamlit-themes

Creating and customizing Streamlit themes. Use when changing app colors, fonts, or appearance, or aligning apps to brand guidelines. Covers config.toml configuration, design principles, and CSS avoidance.

145 10
Explore

Didn't find tool you were looking for?

Be as detailed as possible for better results