Deploying your ML models on the web, sharing them, and making the awesome web interface part 1

Photo by Taras Shypka on Unsplash

After building a machine learning model on some problem you might want to share it with other friends to let them see what it can do and for projects.

For deploying our models the Streamlit platform helps us for creating the beautiful app interface and deploying it on a web machine

Installing Streamlit

for installing Streamlit you can install it with pip with command

pip install streamlit

for checking if the Streamlit is installed correctly and working perfectly fine on your machine you can check it with a command in your CMD

streamlit hello 

if you are getting the above screen as output you have installed Streamlit perfectly on your system :)

Getting started with building your application

here I am gonna assume you already have the model downloaded on your machine

here I am using a model from emotion detection (Kaggle) competition for detecting the sentiment of a statement (https://www.kaggle.com/c/tweet-emotion-detection/overview)

before proceeding further I am encouraging you to create a git repository and make Streamlit account ( https://share.streamlit.io/)

after initializing the repo and opening it in your favorite ide let’s start creating the app

we are gonna have different types of files for a different purpose

1. app.py — this for launching our app and the first introductory section
2. intro.py — for creating a good intro for our app
3. functionality.py — this is where the whole functionality of our app will go
4. about.py — for mentioning ourselves as creators and sharing more information about the model

create above files in advanced in your ide

Editing app.py

let’s first create our app.py file

here we are first importing Streamlit.

setting up the sidebar to make our application look nice

st.title this function helps us for giving titles on the main screen of the app

here st.sidebar.selectbox this function gets displayed on the sidebar of our application giving it a more classy look we can define a tuple of our option along with the question where we want to go

Editing introduction.py

setting up introduction.py

import streamlit as st 
# creating run_intro() function 
def run_intro():
     st.image("https://images.unsplash.com/photo-1587483166702-               bf9aa66bd791?   ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-  1.2.1&auto=format&fit=crop&w=1170&q=80", use_column_width=True)
     
     st.markdown("""
       ## emotion detection based on text 
       
       ### select run_app for continue to demo 
  
       ### select about for going to about section
      """)

here in introduction.py, we are creating run_intro()

with st.image we can show any image on our app screen choose your fav URL and display the image on our application screen

with st.markdown we can display text in markdown format on our screen

just for checking we are on the right track we are gonna comment out our if-else ladder after line 15

Editing about.py

You can do similar code for about.py and create about section of your app 😃

Checking our progress

in your project terminal type command

streamlit run app.py

after running this command it will show you the output shown below open the local URL shown in your terminal on your browser

after running and opening the URL in your browser you should have some screen that looks like

we are gonna cover the functionality part of the application in the next part of this 😄

thanks for reading my blog :) follow for more say hi to me in comments it gives me encouragement for writing more blogs :) have a good day :)

Mlearning.ai Submission Suggestions