Fading Coder

One Final Commit for the Last Sprint

Home > Notes > Content

Building and Deploying Web Applications with Streamlit

Notes 2

Streamlit enables rapid development of web applications using Python, requiring no frontend expertise. It transforms Python scripts into shareable web pages in minutes, supporting free deployment.

Install Streamlit using pip:

pip install streamlit

Verify installation by running:

streamlit hello

Navigate to the provided local URL in you're browser to confirm.

To run an application, create a Python file and execute:

streamlit run app.py

This launches a local server, typically at http://localhost:8501.

Import Streamlit in your script:

import streamlit as st

Display text with st.write():

st.write('Hello World!')

Create haedings using st.title():

st.title('Application Title')

Markdown is supported directly:

"# Main Heading"
"## Subheading"
"""
```python
print('Code block')

"""


Render images with `st.image()`:
```python
st.image('image.jpg', width=500)

Display data tables. Static tables use st.table():

import pandas as pd
data = {'Name': ['Alice', 'Bob'], 'Score': [85, 92]}
st.table(data)

Interactive tables use st.dataframe():

df = pd.DataFrame(data)
st.dataframe(df)

Add separators with st.divider():

st.divider()

Use Python variables and control sturctures:

x = 15
y = 25
st.write(x * y)

if x > 10:
    st.write('x is greater than 10')

for i in range(5):
    st.write(i)

Create input fields. Text input:

username = st.text_input('Enter your name:')
if username:
    st.write(f'Welcome, {username}')

Pasword input:

password = st.text_input('Password:', type='password')

Numeric input:

age = st.number_input('Age:', value=25, min_value=0, max_value=120, step=1)

Multi-line text area:

feedback = st.text_area('Comments:')

Interactive elements. Checkbox:

agreed = st.checkbox('I agree to the terms')
if agreed:
    st.write('Terms accepted')

Radio buttons:

choice = st.radio('Select option:', ['Option A', 'Option B'], index=0)

Single-select dropdown:

item = st.selectbox('Choose an item:', ['Item 1', 'Item 2', 'Item 3'])

Multi-select dropdown:

selected = st.multiselect('Select items:', ['A', 'B', 'C'])
for s in selected:
    st.write(s)

Slider:

value = st.slider('Adjust value:', min_value=0, max_value=100, value=50, step=5)

Button:

clicked = st.button('Submit')
if clicked:
    st.write('Button pressed')

File uploader:

file = st.file_uploader('Upload a file:', type=['csv', 'txt'])
if file:
    st.write(f'Uploaded: {file.name}')

Layout components. Sidebar:

with st.sidebar:
    query = st.text_input('Search:')

Columns:

col1, col2 = st.columns(2)
with col1:
    st.write('Column 1')
with col2:
    st.write('Column 2')

Tabs:

tab_a, tab_b = st.tabs(['Tab A', 'Tab B'])
with tab_a:
    st.write('Content A')
with tab_b:
    st.write('Content B')

Expander:

with st.expander('Details'):
    st.write('Hidden content')

Charts, such as line charts:

import numpy as np
chart_data = np.random.randn(20, 3)
st.line_chart(chart_data)

Multi-page applications are created by adding a pages directory in the project root. Place additional Python files in this folder to automatically genearte navigation.

Deploy applications via Streamlit Community Cloud. Push your code to a GitHub repository, then visit share.streamlit.io to connect the repository and deploy. Configure the main file path and optional custom subdomain.

Related Articles

Designing Alertmanager Templates for Prometheus Notifications

How to craft Alertmanager templates to format alert messages, improving clarity and presentation. Alertmanager uses Go’s text/template engine with additional helper functions. Alerting rules referenc...

Deploying a Maven Web Application to Tomcat 9 Using the Tomcat Manager

Tomcat 9 does not provide a dedicated Maven plugin. The Tomcat Manager interface, however, is backward-compatible, so the Tomcat 7 Maven Plugin can be used to deploy to Tomcat 9. This guide shows two...

Skipping Errors in MySQL Asynchronous Replication

When a replica halts because the SQL thread encounters an error, you can resume replication by skipping the problematic event(s). Two common approaches are available. Methods to Skip Errors 1) Skip a...

Leave a Comment

Anonymous

◎Feel free to join the discussion and share your thoughts.