MITB Banner

A Beginners Guide To Streamlit – Convert Python Code Into An App

Share

streamlit

Data scientists mould data in various ways to unearth insights from it. And since these outcomes are used for decision-making, it is paramount for data scientists to write production-level code well. However, sometimes, the practices data scientists implement are tedious to utilise in production. 

Data scientists often write code to evaluate the data by exploratory data analysis, check several data points, and outliers. These algorithms are only good for getting an idea about how data is spread, but are mostly purposeless in production.

Besides, the algorithms come back from the production team to data scientists for making changes in them to add features or optimise the code for improved efficiency. Such practices are cumbersome and ineffective in this highly competitive marketplace. 

Now, with an app framework called Streamlit, data scientists can build machine learning tools right from the beginning of the project. Utilising Streamlit, data scientists can visualise their code output while analysing data. They can build ML tools that can be utilised to analyse data through clicks and sliding bars.

To demonstrate its capabilities, we have made a simple tool to visualise through bar graph using Streamlit.

We downloaded the data from Kaggle, which contains information about football players from the FIFA database. 

In this small project, we will select two players of different teams and visualise their ranking, overall, and age in bar graphs. 

Here are the steps to make you script to tool with Streamlit framework:

We have used sublime to write the Python code and used the anaconda terminal to run the Python file using streamlit run. This will open a server on your browser, where you can interact with the user interface.

Begin with installing and importing the Streamlit.

pip install streamlit
import streamlit as st

Note: We also imported other required libraries such as pandas, matplotlib, numpy.

Now just like any other data analysis project, you can proceed while utilising Streamlit methods.

While you can read the csv file into a pandas dataframe, it is recommended to do it with the below code when you are using Streamlit.

df = st.cache(pd.read_csv)("new_data.csv")

After reading the csv file, visualise the dataframe with the below code:

is_check = st.checkbox("Display Data")
if is_check:
    st.write(df)

Note: If in case, it doesn’t show the data, you can refresh the tab.

dataset

Now, to create a field to input values, add this code in the Python file and refresh your tab.

teams = st.sidebar.multiselect("Enter clubs", df['club'].unique())
st.write("Your input clubs", teams)

You will witness a field, where you can select from the drop-down, or type in the names of teams.

Clubs

Here, we have entered two teams: Manchester United and Manchester City

Next, to enter the attributes we want to compare we will input the variables.

variables = st.sidebar.multiselect("Enter the variables", df.columns)
st.write("You selected these variables", variables)

Variables

Using the team name and variables we provided, we can further subset the data to only focus on the information we need

selected_club_data = df[(df['club'].isin(teams))]
two_clubs_data = selected_club_data[variables]
club_data_is_check = st.checkbox("Display the data of selected clubs")
if club_data_is_check:
    st.write(two_clubs_data)

Dataset of clubs

Eventually, we can input the name of the players to visualise their attributes.

selected_players = st.sidebar.multiselect('Select players to compare', two_clubs_data.name.unique())
st.write("The players are", selected_players)

players

Now, we can further trim down the data to get details of only these two selected players

plot_data = two_clubs_data[(two_clubs_data['name']).isin(selected_players)]
st.write(plot_data)

Visualising the ranking of the two players

st.bar_chart(plot_data.name)

Ranking

Finally, to visualise through a bar graph.

n = 2
values = plot_data.values
value1 = values[0][1:]
value2 = values[1][1:]
index = np.arange(2)
width = 0.3
p1 = plt.bar(index, value1, width)
p2 = plt.bar(index+width, value2, width)
plt.xlabel("Variables")
plt.ylabel("Value")
plt.xticks(index, ('Potential', 'age'))
plt.legend(values[:,0])
st.pyplot()

visualisation

We can further add more variables and players to make the visualisation complex by making little tweaks in the Python code, but this will help you get started with the Streamlit. 

You can read the documentation and implement other methods for making an intuitive machine learning tool here.

Share
Picture of Rohit Yadav

Rohit Yadav

Rohit is a technology journalist and technophile who likes to communicate the latest trends around cutting-edge technologies in a way that is straightforward to assimilate. In a nutshell, he is deciphering technology. Email: rohit.yadav@analyticsindiamag.com
Related Posts

CORPORATE TRAINING PROGRAMS ON GENERATIVE AI

Generative AI Skilling for Enterprises

Our customized corporate training program on Generative AI provides a unique opportunity to empower, retain, and advance your talent.

Upcoming Large format Conference

May 30 and 31, 2024 | 📍 Bangalore, India

Download the easiest way to
stay informed

Subscribe to The Belamy: Our Weekly Newsletter

Biggest AI stories, delivered to your inbox every week.

AI Courses & Careers

Become a Certified Generative AI Engineer

AI Forum for India

Our Discord Community for AI Ecosystem, In collaboration with NVIDIA. 

Flagship Events

Rising 2024 | DE&I in Tech Summit

April 4 and 5, 2024 | 📍 Hilton Convention Center, Manyata Tech Park, Bangalore

MachineCon GCC Summit 2024

June 28 2024 | 📍Bangalore, India

MachineCon USA 2024

26 July 2024 | 583 Park Avenue, New York

Cypher India 2024

September 25-27, 2024 | 📍Bangalore, India

Cypher USA 2024

Nov 21-22 2024 | 📍Santa Clara Convention Center, California, USA

Data Engineering Summit 2024

May 30 and 31, 2024 | 📍 Bangalore, India

Subscribe to Our Newsletter

The Belamy, our weekly Newsletter is a rage. Just enter your email below.