Streamlit: Whip up a Web App In Minutes

Prashun chauhan
Fasal Engineering
Published in
6 min readMar 7, 2023

Streamlit is an open-source Python library that isused to make data apps without any knowledge of frontend service. The best part is if you only know the python programming language, you can make a clean app with many dashboards.

Isn’t it handy for someone in the data science field without experience in frontend? There is an unexplored web app creator Streamlit for data science and machine learning that can create a web app in a very short time. I had made one and this article let’s explore and understand the code to build a Streamlit app.

This is how ReactJS users react after seeing the Streamlit app :

React user reaction after seeing the Streamlit web app

If you need to build a data science or machine learning application and are comfortable with Python, Streamlit may be the better choice. If you need to build a general-purpose web application and are comfortable with JavaScript, ReactJS may be the better choice.

One of the most significant advantages of Streamlit is how fast it is to get started. With just a few lines of code, you can have a functioning web app up and running. Streamlit handles all the details of web development for you, so you can focus on writing your application’s logic and presentation.

Look how easy it is to build a app here :

# Step 1: create a python file like main.py
# Step 2: install the streamlit using pip
!pip install streamlit
# Step 3: import streamlit
import streamlit as st
# Step 4: give the title for your app
st.title('My first web-app')
# Step 5: run the main.py using
streamlit run main.py

When you run these commands, you will use these URLs to see the app:

Although the app appears in your browser, you can continue building it in real time because the changes in your Python script will automatically appear on your app page (just use rerun in the app settings to see these changes).

And here is what your Web-app looks like:

App Homepage

Streamlit turns data scripts into shareable web apps in minutes.
All in pure Python. No frontend experience is required.

App Description:

For my project, I wanted to build an app (Data Retrieval app) that will retrieve data from different databases based on the input given by the user and filter the data based on the user's requirements. Finally, the user can download the data in CSV format. The app has different filter conditions on the sidebar and the results will be displayed on the main page.

Some basic streamlit commands which were used in making the app:

  1. With st.write() method, you can write anything in the application wherever you want. Also, it can be used when you make graphs using plotly, Vega-Altair, matplotlib, etc.
st.write('welcome to the app')

2. st.sidebar() used for selecting some options that help in moving the app according to that selection. The sidebar has different options like radio, st.selectbox(), st.checkbox(), etc. You can add as many widgets in the sidebar using these features.

choice = st.sidebar.radio("Select the required one from here",
('A','B','C'))

3. There is a different command to take input from the user in the streamlit as shown below:

1. st.text_input()
2. st.number_input()
3. st.text_area()
4. st.date_input()

4. Also you can submit your input using st. button() method.

5. There are a lot of different elements of the streamlit that can be used while developing an app like slider, file_uploader, image, etc.

Let’s see a small demo of all the commands used in a small app called the Data Retrieval app:

Streamlit app used to retrieve data from different sources

Below code snippet demonstarted how Streamlit was used to develop the UI of the “Data Retrieval” app:

import streamlit as st
from streamlit_pandas_profiling import st_profile_report
st.title('Data Retrieval')

choice = st.sidebar.radio("Select the required one from here",
('Sensor Data crop specific','Sensor Data using plotId',
'Sensor or forecast data using lat_long (3rdparty)',
'Weather forecast Data', 'Analyse your dataset'))

if choice == 'Sensor Data crop specific':

sensor_data_calc(choice)
elif choice == 'Sensor Data using plotId':
sensor_data_calc(choice)
elif choice == 'Analyse your dataset':
report = data_analyzer()
st_profile_report(report)
elif choice == 'Sensor or forecast data using lat_long (3rdparty)':
get_api_data_calc()

elif choice == 'Weather forecast Data':
weather_forecast_calc(choice)

elif choice == 'GDD calculation' or choice =='GDD calculation using plotId':
gdd_calc(choice)

Examples of interactive data visualizations:

Here is an example of how to create a basic line chart using matplotlib in a Streamlit app:

import streamlit as st
import matplotlib.pyplot as plt
import numpy as np

# Generate some random data
x = np.arange(0, 10, 0.1)
y = np.sin(x)

# Create a Matplotlib figure
fig, ax = plt.subplots()

# Add a line plot to the figure
ax.plot(x, y)

# Set the chart title and axis labels
ax.set_title('Sine Wave')
ax.set_xlabel('x')
ax.set_ylabel('y')

# Display the chart in the Streamlit app
st.pyplot(fig)

Here is a general example of how to create an interactive scatter plot using plotly in a Streamlit app:

import streamlit as st
import plotly.express as px
import pandas as pd

# Load some sample data
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/iris.csv')

# Create a Plotly scatter plot
fig = px.scatter(df, x='sepal_width', y='sepal_length', color='species')

# Set the chart title
fig.update_layout(title='Iris Dataset')

# Display the chart in the Streamlit app
st.plotly_chart(fig)

# Load some sample data
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/iris.csv')

# Create a Plotly scatter plot
fig = px.scatter(df, x='sepal_width', y='sepal_length', color='species')

# Set the chart title
fig.update_layout(title='Iris Dataset')

# Display the chart in the Streamlit app
st.plotly_chart(fig)

Deployment of the app:

Not too long ago, deploying even a straightforward web app to the cloud required vast app containerization knowledge and tools, and of course money. These days, the process has become as painless as uploading a couple of files to the web and running a few command lines.

To deploy a Streamlit app, there are a few different options available:

  1. Streamlit Sharing: Streamlit provides its own hosting platform, Streamlit Cloud, which is a free service that allows you to deploy and share your Streamlit app with others. To use Streamlit Sharing, you need to sign up for an account and follow the instructions to deploy your app. Connect your repository link and deploy the app. For more details, you can follow this https://streamlit.io/cloud
  2. Heroku: Heroku is a cloud platform that allows you to deploy, manage, and scale web applications. It offers a free plan that allows you to deploy your Streamlit app with limited resources. To deploy a Streamlit app on Heroku, you must create a new app, configure the required environment variables, and deploy your app using Git.
  3. AWS: Amazon Web Services (AWS) provides a wide range of services for deploying and managing web applications. You can deploy your Streamlit app on AWS using Elastic Beanstalk, which is a platform for deploying and scaling web applications. To deploy a Streamlit app on Elastic Beanstalk, you need to create a new Elastic Beanstalk environment, upload your app code, and configure the required environment variables.
    For ref: https://aws.amazon.com/elasticbeanstalk/
  4. Google Cloud Platform: Google Cloud Platform (GCP) offers several services for deploying and managing web applications, including App Engine and Compute Engine. You can deploy your Streamlit app on GCP using App Engine, which is a platform for deploying and scaling web applications. To deploy a Streamlit app on App Engine, you need to create a new App Engine application, upload your app code, and configure the required environment variables.
    Ref: https://docs.streamlit.io/knowledge-base/tutorials/databases/gcs

Conclusion:

Finally, Streamlit is an open-source and actively developed tool, with a large and growing community of users. This means that you can always find help and support when you need it, and that new features and improvements are being added all the time.

In conclusion, Streamlit is a powerful and flexible web framework that is perfect for data scientists and machine learning engineers. With its simple API, fast development time, and strong support for data visualization, Streamlit makes it easy to build sophisticated web applications that help you explore, understand, and communicate your data.

--

--