Learn Streamlit: Creative ML Web Application building

Karthikeyan Rathinam
2 min readAug 23, 2024

--

Streamlit is a popular open-source framework that allows you to build interactive web applications for machine learning and data science projects. It provides an easy and intuitive way to create user interfaces and share your work with others. Here’s a step-by-step tutorial to help you get started with Streamlit:

Step 1: Installation

To begin, you need to install Streamlit. Open your command prompt or terminal and run the following command:

pip install streamlit

Step 2: Create a Streamlit App

Create a new Python file, for example, app.py, and open it in your preferred code editor. Import the Streamlit library at the top of your file:


import streamlit as st

Step 3: Basic Structure

A Streamlit app typically consists of several components, such as text, buttons, input widgets, and data visualizations. Let's start by adding some basic structure to our app. Add the following code to your app.py file:

# Add a title

st.title("My First Streamlit App")

# Add text

st.write("Welcome to my app!")

# Add a header

st.header("Data Analysis")

# Add data

data = [1, 2, 3, 4, 5]
st.write("Data:", data)

Step 4: Run the App
Save the file and run it from the command prompt or terminal using the following command:

streamlit run app.py

You should see a local web server started, and your app will open in a new browser tab.

Step 5: Adding Interactive Elements
One of the main advantages of Streamlit is its ability to add interactive elements to your app. Let's explore a few examples:

# Add a checkbox
checkbox = st.checkbox("Show/Hide Data")
if checkbox:
st.write("Data:", data)
# Add a selectbox
option = st.selectbox("Select a number", [1, 2, 3, 4, 5])
st.write("You selected:", option)

# Add a slider
slider = st.slider("Select a range", 0, 10, (3, 7))
st.write("Range:", slider)

Save the file and run the app again. You should now see a checkbox, selectbox, and slider in your app. Try interacting with them to see the changes.

Step 6: Data Visualization

Streamlit provides various ways to visualize data. Here's an example using the popular Matplotlib library:

import matplotlib.pyplot as plt
import numpy as np

# Generate random data
x = np.random.randn(100)
y = np.cumsum(x)

# Plot the data
st.line_chart(y)

Save the file and run the app. You should see a line chart displaying the random data.

Step 7: Deploying the App

Streamlit makes it easy to deploy your app to the web. You can host it on platforms like Streamlit Sharing, Heroku, or AWS. Refer to the Streamlit documentation for detailed instructions on deployment.

This tutorial provides a basic introduction to building Streamlit apps. As you progress, you can explore advanced features like caching, session state, custom styling, and integrating with machine learning models.

Remember to refer to the Streamlit documentation (https://docs.streamlit.io/) for more information and examples. Happy coding with Streamlit!

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

--

--

No responses yet

Write a response