Getting Started with Streamlit: Build Python Frontends in Minutes
Written by Jens on
Streamlit is a Python library that makes it incredibly easy to build interactive web apps directly from Python scripts.
It is especially popular among data scientists, analysts, and machine learning engineers who want to quickly create frontends for data exploration, visualization, and reporting — without needing any HTML, CSS, or JavaScript.
Streamlit: A Quick Overview
What is Streamlit?
- Turns Python scripts into shareable web applications with minimal code.
- Provides UI elements like charts, tables, forms, maps, and widgets.
- Integrates smoothly with libraries like Pandas, NumPy, Matplotlib, Plotly, and Altair.
- Enables real-time interaction with sliders, checkboxes, and input fields.
When is Streamlit used?
- Prototyping data-driven dashboards quickly.
- Sharing machine learning models with non-technical users.
- Creating internal tools for teams (data entry, monitoring).
- Teaching and demonstrating concepts interactively.
Basic Streamlit Elements: Displaying Text, Data, and Charts
import streamlit as st
import pandas as pd
import numpy as np
st.title("My First Streamlit App")
st.write("Hello, world! 👋")
# Displaying data
df = pd.DataFrame({
"Numbers": [1, 2, 3],
"Squares": [1, 4, 9]
})
st.table(df)
# Simple chart
st.line_chart(np.random.randn(20, 2))
- st.title(“…”), st.header(“…”), st.subheader(“…”) → Text headings
- st.write(“…”) → Display text, variables, or even Markdown
- st.table(df) and st.dataframe(df) → Display data tables
- st.line_chart(), st.bar_chart(), st.map() → Quick visualizations
Advanced Components: Sidebars, Navigation, Widgets and Progress Bars
import streamlit as st
import time
# Sidebar for navigation
st.sidebar.title("Settings")
option = st.sidebar.selectbox("Choose a dataset:", ["Sales", "Marketing", "HR"])
# Interactive widgets
age = st.slider("Select your age:", 0, 100, 25)
st.write("Selected age:", age)
# File upload
uploaded_file = st.file_uploader("Upload a CSV", type="csv")
if uploaded_file:
import pandas as pd
df = pd.read_csv(uploaded_file)
st.dataframe(df)
# Progress bar
progress = st.progress(0)
for i in range(100):
time.sleep(0.01)
progress.progress(i + 1)
More Features: Forms, Caching, Session State, Layouts, and Deployments
- Forms: Group input fields with st.form() and st.form_submit_button().
- Caching: Use @st.cache_data or @st.cache_resource to improve performance.
- Session State: Store variables across user interactions (st.session_state).
- Layouts & Columns: Organize apps into multiple columns with st.columns().
- Deployments: Easily deploy apps via Streamlit Cloud or Docker.
Best Practices for Streamlit Apps
- Keep scripts modular → Separate logic (data loading, preprocessing, visualization).
- Use caching wisely → Cache expensive operations (e.g., reading a large dataset).
- Add sidebars for configuration → Keeps the main UI clean.
- Start simple, then refine → Begin with basic widgets, then add advanced features.
- Think about performance → Minimize unnecessary recomputations.
- Document your app → Use headers and markdown to guide users.
- Deploy and share → Use Streamlit Cloud or your own server for team access.
Streamlit Cheatsheet
| Category | Function | Description |
|---|---|---|
| Text & Titles | st.title(“Title”) | Large page title |
| st.header(“Header”) | Section header | |
| st.subheader(“Subheader”) | Subsection header | |
| st.write(“Text or variable”) | Display text, numbers, Markdown, or data | |
| Data Display | st.table(df) | Static table |
| st.dataframe(df) | Interactive scrollable table | |
| st.json(obj) | Display JSON nicely | |
| Charts | st.line_chart(data) | Quick line chart |
| st.bar_chart(data) | Quick bar chart | |
| st.area_chart(data) | Quick area chart | |
| st.map(df) | Plot locations on a map (lat/lon) | |
| Widgets (Inputs) | st.button(“Click me”) | Button trigger |
| st.checkbox(“Check me”) | True/False toggle | |
| st.radio(“Pick one”, options) | Single-choice selection | |
| st.selectbox(“Pick one”, options) | Dropdown menu | |
| st.multiselect(“Pick many”, options) | Multi-select dropdown | |
| st.slider(“Range”, min, max, value) | Slider for numeric input | |
| st.text_input(“Enter text”) | Single-line text input | |
| st.text_area(“Enter text”) | Multi-line text input | |
| st.file_uploader(“Upload file”) | Upload files | |
| Layout & Navigation | st.sidebar.xxx | Add any element to sidebar |
| st.columns([2,1]) | Create columns with width ratio | |
| st.expander(“Details”) | Collapsible section | |
| Status & Progress | st.progress(i) | Progress bar |
| st.spinner(“Loading…”) | Loading indicator | |
| st.success(“Done!”) | Green success message | |
| st.error(“Error!”) | Red error message | |
| st.warning(“Warning!”) | Yellow warning message | |
| st.info(“Info”) | Blue info message | |
| Performance | @st.cache_data | Cache data (e.g., file loading) |
| @st.cache_resource | Cache models/resources |
Conclusion
Streamlit is the fastest way to build a Python-based frontend for data apps. Whether you’re exploring datasets, showcasing machine learning models, or creating interactive dashboards, Streamlit makes it simple and fun.
💡 If you know Python, you can build and share powerful apps in minutes — no web development experience required.
Appendix: Code Example
import streamlit as st
import pandas as pd
import time
# ------------------------------
# Data loading (with caching)
# ------------------------------
@st.cache_data
def load_sample_data():
# Simulate an expensive operation
time.sleep(1)
return pd.DataFrame({
"Name": ["Alice", "Bob", "Charlie"],
"Age": [25, 30, 35]
})
# ------------------------------
# UI Components
# ------------------------------
def render_title():
st.title("🚀 Best Practices Streamlit App")
def render_form():
with st.form("user_form"):
name = st.text_input("Enter your name:")
age = st.number_input("Enter your age:", min_value=0, max_value=120)
submitted = st.form_submit_button("Submit")
if submitted:
if not name:
st.error("❌ Please enter your name.")
else:
st.session_state["user"] = {"name": name, "age": age}
st.success(f"✅ Hello {name}, you are {age} years old.")
def render_data_section():
st.header("📊 Sample Data")
df = load_sample_data()
st.dataframe(df)
def render_user_section():
if "user" in st.session_state:
st.header("🙋 User Info")
user = st.session_state["user"]
st.write(f"Name: **{user['name']}**")
st.write(f"Age: **{user['age']}**")
# ------------------------------
# Main app logic
# ------------------------------
def main():
render_title()
render_form()
render_user_section()
render_data_section()
if __name__ == "__main__":
main()
Comments