Predictive Hacks

How to Create a Simple Streamlit App + How to Deploy it on Heroku

streamlit app

Streamlit is our favorite way to create python web apps due to its simplicity. You can build beautiful and complex apps without any front‑end experience. In this post, we will create a mini cryptocurrency dashboard that will show the closing price over time.

To install Streamlit:

pip install streamlit

The python code

The best pipeline of creating a web app with Streamlit is to first develop your code in something like Jupyter Notebook and then transfer it to a Streamlit python file. Having said that, let’s develop our code which is to get the data and plot the closing price of a cryptocurrency.

There are many ways to get the price of a currency but in this post, we will use pandas_datareader. To install it, run the following:

pip install pandas-datareader

Now, let’s start coding. We want 2 things, set the date range and the cryptocurrency name and then plot its closing price.

import pandas as pd
import numpy as np
import pandas_datareader as web
import datetime as dt


start = dt.datetime(2020,1,1)
end = dt.datetime.now()

df = web.DataReader('XRP-USD', 'yahoo', start, end)
df

The Pandas Datareader takes as input the name of the currency(XRP), the range, and the source(yahoo).

df['Adj Close'].plot()

Transform the code into a Streamlit App

Now it’s the fun part. Before we start, you should open this streamlit cheat sheet that I’m always using when I’m building an app.

The first step is to think of a title and what inputs we will need. In our example, we only need 3 things. The name of the currency, and the start and end date. Then if the user presses the submit button It should show a plot. So, inside a .py(let’s call t app.py) file add the following.

import pandas as pd
import pandas_datareader as web
import datetime as dt
import numpy as np
import streamlit as st




st.title('Crypto price over time.')


with st.form(key='my_form'):
    crypto=st.selectbox('Select Cryptocurrency', ['BTC','ETH','XRP','BCH'])
    start=st.date_input('Start')
    end=st.date_input('End')
    submit_button = st.form_submit_button(label='Submit')

if submit_button:
    df = web.DataReader(f'{crypto}-USD', 'yahoo', start, end)

    st.line_chart(df['Adj Close'])

Our app is ready! Let’s explain a bit what we did.

After the import of the libraries(don’t forget to import streamlit) we added a title by using the st.title function. Then we created a form. As you can see in the cheatsheet, you can use many types of input but in our example, we added a select box having a selection of currencies, 2 date inputs for the start and end of the date range, and of course, a submit button.

Next, we are checking if the submit button is clicked and we added the rest of the code with a small change, we are using streamlit’s line_chart instead of pandas plot.

To start our app we are running the following in the terminal:

streamlit run app.py

The output should be the following:

That means that our app is running in http://localhost:8501. Let’s have a look.

Bonus: How to deploy a Streamlit App on Heroku

Heroku is a great service to start working with web apps or APIs because you can deploy them for free. If you don’t know anything about Heroku or deployments I encourage you to read the Practical Guide: Build And Deploy A Machine Learning Web App.

Firstly, you need to create a setup.sh file with the following code inside:

mkdir -p ~/.streamlit/
echo "\
[server]\n\
headless = true\n\
port = $PORT\n\
enableCORS = false\n\
\n\
[theme]\n\
base = 'light'\n\
\n\
" > ~/.streamlit/config.toml

In this file, you can change also the theme of the app. You can find out more in Streamlit’s documentation. For this app, I’m using the light theme.

Next, we just need to create a Procfile having the following

web: sh setup.sh && streamlit run app.py

Finally, you need a requirements.txt file having the libraries that we are using in our project.

numpy == 1.19.5

pandas == 1.3.3

pandas_datareader == 0.10.0

streamlit == 1.1.0

Now you are ready to deploy your Streamlit app to Heroku. You should create an app on Heroku’s website and then initialize and push the code in Heroku as mentioned in the Practical Guide.

Summing it up

Streamlit is my favorite way to create Python web apps. It’s fast, easy, and looks professional. In this post, we created a mini cryptocurrency dashboard in just a few lines of code.

Sharing ideas and knowledge as data scientists now became easier with services like Heroku that let us deploy our apps for free. Combining our knowledge, Streamlit and Heroku you can even make money freelancing or you can create a beautiful portfolio of apps to show to your next job interview.

You can read the How To Create An Instagram Profile Analyzer App Using Python And Streamlit post if you want to see a more complex example of Streamlit.

Share This Post

Share on facebook
Share on linkedin
Share on twitter
Share on email

Leave a Comment

Subscribe To Our Newsletter

Get updates and learn from the best

More To Explore

Python

Image Captioning with HuggingFace

Image captioning with AI is a fascinating application of artificial intelligence (AI) that involves generating textual descriptions for images automatically.

Python

Intro to Chatbots with HuggingFace

In this tutorial, we will show you how to use the Transformers library from HuggingFace to build chatbot pipelines. Let’s