Introduction to Streamlit for Machine Learning Web App
Streamlit is an open-source Python library that makes it easy to build beautiful custom web-apps for machine learning and data science.
Data scientists run the data science process to arrive at a solution, creativity, and a model. They create a product and at the end of this process, they have to share their product with their stakeholders in order to collaborate or get feedback. Stakeholders can be customers, colleagues, or anyone else, anyone located in another city or perhaps another country.
To share the model, it is necessary to deploy it over the web. Deploying the model is the most important part, you can build a good model and accomplish the successful data science process. However, you should show this work to others in a beautiful presentation.
With Streamlit, you can create your own interactive environment, you can create a web app with powerful content for your colleagues or customers you want to show your work. You can get values from users and change the result interactively according to their inputs. Streamlit is an absolute tool that brings your idea to the internet. It is very easy to install and create a web app with Streamlit.
In Streamlit, you mainly use markdown and python. HTML and CCS are also supported. You can create a good-looking visual web app. You can design your app, deploy your model, and someone can test your model.
Installing the Streamlit
You just need to type pip install streamlit into your terminal and it is ready to use. (If you don’t have pip, install pip first.)
pip install streamlitThen we just need a python file (py extension) for an app. We will write the codes on this file for a web app. We will build our app on this file. It can be created and edited with a text editor but requires a python interpreter to run. py files are often used for programming web servers and other administrative computer systems.
Let’s create our first demo app;
First, we will create a python file, I will do this on the terminal. I go to the relevant directory where my model is located (if we want to deploy a model, we have to do it in the relevant directory. This is not required for this demo.). I create a py file with touch demo_app.py.
Then type streamlit run demo_app.py in the relevant directory in the terminal and run it. Python file works even if it is empty and gives you a URL. Our Streamlit web app is ready, it’s all that easy.
Click on the URL (it doesn’t matter which one), this link will open in your browser.
We have a web app. We can fill this now. I will open the demo_app.py, in Jupyter Notebook to overwrite.
We will write something in the python file (demo_app.py) and the web app will change at the same time each time we save the file.
First, we need to import Streamlit. Then we write our first code st.title (“Web App”) and save the file (ctrl + s or command + s) and the web app asks you “Stream file changed rerun or rerun always.”. Click the rerun always so it doesn’t warn us every time and also changes the view.
Now we can add some interactivity and creativity to your web app. Below are some examples.
We can write title and text;
st.title('Web App')
st.text('Hello Streamlit')We can write headers like that;
st.header('This is a header')
st.subheader('This is a subheader')We can use markdown and its features on streamlit;
st.markdown('This is a normal Markdown')
st.markdown('# This is a bold Markdown')
st.markdown('## This is a thin-bold Markdown')
st.markdown('* This is a Markdown with point')
st.markdown('** This is a small bold Markdown **')We can make colorful our text;
st.success('Successful')
st.markdown('`This is a markdown`')
st.info("This is an information")
st.warning('This is a warning')
st.error('This is an error')
After these codes we get;
We can add many interactive elements such as buttons, sliders, selection boxes to select or reference values.
We can add single-select box. It will make dropdown menu;
st.selectbox('Your Occupation', ['Programmer', 'Data Scientist'])We can add multi-select box. It will make dropdown menu;
st.multiselect('Where do you work', ('London','Istanbul','Berlin'))We can add buttons,
st.button('Simple Button')We can add sliders and some features,
st.slider('What is your level', 0,40, step = 5)
As you can see there is no need for HTML or CSS but you can add some extra features if you want.
html_temp = """
<div style="background-color:tomato;padding:1.5px">
<h1 style="color:white;text-align:center;">Demo Web App </h1>
</div><br>"""
st.markdown(html_temp,unsafe_allow_html=True)
st.title('This is for a good design')
st.markdown('<style>h1{color: red;}</style>', unsafe_allow_html=True)
We can also add images and graphics;
#images
from PIL import Image
im = Image.open("winter.jpg")
st.image(im, width=700, caption="Winter")#Graphs
import matplotlib.pyplot as plt
import numpy as nparr = np.random.normal(1, 1, size=100)
fig, ax = plt.subplots()
ax.hist(arr, bins=20)st.pyplot(fig)
Python libraries are supported. You may get this error message if there is no library on your computer, then you just need to install that library on the computer.
There are many items in Streamlit that help you build a good web app. You can add many features depending on your creativity and needs. Videos, sounds, emojis, charts, graphics, etc. It is the fastest and most practical way to create a web app for machine learning.
Just go to Streamlit web page and check the documentation, get your needs.
In our next post, we will deploy a model in AWS EC2.
