MLOPS-building a deep learning project from end to end (part-2)

credits — valohai.com

In the previous part, we have completed building the pipelines and executing them using DVC. Now we will move toward the deployment part, before that we need a web app through which a user can interact with it. For creating the web app we will be needing HTML, CSS and js for that head to my GitHub repo inside web apps you find ‘static’, ‘template’ and ‘uploads’ directory for the same.

Content

1. Creating web app using flask
2. Deploying the app on Heroku using GitHub actions

1. Creating web app using flask

Now we will create an API using flask so it can receive the input through the web app and return the proper prediction. For building, refer to the below code.

import os
os.environ["CUDA_VISIBLE_DEVICES"]="-1" 
from flask import Flask,render_template,url_for,request
from werkzeug.utils import secure_filename
from keras.models import load_model
#from keras.preprocessing.image import image
import numpy as np
import os
from tensorflow.compat.v1 import ConfigProto
from tensorflow.compat.v1 import InteractiveSession
#from tensorflow.keras.preprocessing import image
from PIL import Image
import cv2
app = Flask(__name__)
app.config['upimg'] = os.path.join('uploads')
model1 = load_model("saved_models/trained.h5")
def img_predict(pat,model):
    
    load_img = cv2.imread(pat)
    load_img = cv2.resize(np.float32(load_img),(225,225))
    imgg = np.array(load_img)
    #load_img = image.load_img(pat,target_size=(140,140))
    #imgg = image.img_to_array(load_img)
    imgg = np.expand_dims(imgg, axis = 0)
    pred = model.predict(imgg)
    #pred = pred[0]
    pred = np.argmax(pred)
    return str(pred)
@app.route("/")
def home():
    return render_template('new.html')
@app.route("/predict", methods = ['POST', 'GET'] )
def predict():
    if request.method == 'POST':
        fil = request.files['file']
        bas_path = os.path.dirname(__file__)
        fil_path = os.path.join('webapps','uploads',secure_filename(fil.filename))
        
        if not os.path.exists('uploads'):
            os.mkdir('webapps/uploads')
        
        fil.save(fil_path)
        
       
        preds = img_predict(fil_path, model1)
        
        if preds == '0':
            opp = 'Its Bulbasaur!'
        
        elif preds == '1':
           opp = 'Its Charmander!'
        
        else:
            opp = 'Its Squirtle!'
        
        return opp
    return None
    
    
if __name__ =='__main__':
    app.run(debug = True)

Once you run this you get the following link shown in the below picture

1.0-after running the flask app

copy the URL and paste it into any of the browser and press ‘enter’, you will be redirected to the page shown below.

1.2-after going to flask URL

So now our web app is running on our local system we need to deploy it in Heroku using GitHub actions which we will be doing in the next part.

2. Deploying the app on Heroku using GitHub actions

For the deployment purpose we need another config file, so for that run the following commands.

mkdir .github\workflows
type null >> .github\workflows\ci-cd.yaml

Here as I am using windows os so I have used ‘type null’ for Linux use ‘touch’ also for path use ‘/’ for Linux.
Inside ‘ci-cd.yaml’ file paste the following configs as shown below.

name: Python-DL-MLOPS
on:
  push:
    branches:
    - main
  pull_request:
    branches:
    - main
jobs:
  build:
runs-on: ubuntu-latest
steps:
    - uses: actions/checkout@v2
      with:
        fetch-depth: 0
    - name: Set up Python 3.7
      uses: actions/setup-python@v2
      with:
        python-version: 3.7
    - name: Install dependencies
      run: |
        python -m pip install --upgrade pip
       
        if [ -f requirements.txt ]; then pip install -r requirements.txt; fi
#- name: Deploy to Heroku
#      env:
#        HEROKU_API_TOKEN: ${{ secrets.HEROKU_API_TOKEN }}
#        HEROKU_APP_NAME: ${{ secrets.HEROKU_APP_NAME }}
#      if: github.ref == 'refs/heads/main' && job.status == #'success'
#      run: |
#        git remote add heroku #https://heroku:$HEROKU_API_TOKEN@git.heroku.com/$HEROKU_APP_NAME.git
#        git push heroku HEAD:main -f

In the above file,
1. name: is the name of the deployment
2. on push, pull: is the branch on which all the files are pushed/pulled
3. jobs, build: are the states in the deployment pipeline
4. runs-on: os which it will use
5. steps: steps involved in the deployment pipeline
6. uses, with: what other dependencies it requires along with another
7. name: name of individual step inside the pipeline
8. run: what command to execute
9. env: environment credential/tokens for Heroku

Now simply push the changes to the Github repo by

git add. && git commit -m "commit msg" && git push origin main

Next up, head to your github repo and you will notice a yellow dot like this

1.3- github actions

it simply shows that the deployment dependencies are installing. Then click on ‘Actions’ tab above.

Once clicked you will see the following page,

1.4-running workflow

observe the yellow point, it shows how many pushes have been done to run the workflow. Every time new changes are pushed to the repo the deployment pipelines get executed.
That is why the term ‘cd’ continuous deployment.
Click on the above workflow and you see the following

1.5-individual pipeline execution

In the ongoing build all the configs and stages mentioned inside ‘ci-cd.yaml’ is executed.
After the build is completed successfully this is what you will see

1.6-build successful

2.2 Creating a new app in Heroku

Till now we have built and executed the stages in pipelines but one last part is left which is deployment on heroku, so let’s go.

Go to URL, once here if you not signed in then you have to sign in else if you are a new user in that case it will ask you to create a new account. After that you will go to dashboard which looks like this

1.7-Hreoku dashboard

We have to create a new app for that click on the new button on the top right as shown above.

It will ask you enter any name for your app, so type any name you like, then press ‘create app’.

1.8- creating an app

Then scroll down, if you have already authenticated GitHub with Heroku you will have an option to search your repo and connect with it.

Note: If you haven’t authorized github with heroku, firstly it will ask you to do so, click on the link and enter your github credential and press ‘authenticate’.

1.9-connecting with Github repo

Type the name of your repo you want to connect with and press connect.

After connecting scroll down, you will see ‘Automatic deploys’, make sure you are on the main branch and tick the ‘wait for CI to pass before deploy

2.0-automatic deployment

Proceeding further copy the name of the app you have given, and go back to the repo navigate to settings as shown

2.1-settings

scroll down a bit and you will see a ‘secrets’ option, click on it

2.2-secrets

After clicking you will see as shown, then select ‘New repository secret’.

2.3-action secret

2.4-Entering the values

As shown in the above image enter the name as ‘HEROKU_APP_NAME’ and in value paste the Heroku app name, then click ‘add secret’.

Head by to Heroku page and navigate to profile -> account settings -> applications -> create authorization. Look at the below images and follow accordingly.

2.5-account settings

2.6-applications

2.7-creating authorization

In the description section enter any info and press ‘create’.

2.8-copying the token

Copy the token and go back to the GitHub repo and follow the same procedure as shown between the images 2.1 to 2.4. In the name section put ‘HEROKU_API_TOKEN’ and in value paste the copied Heroku token.

NOTE: the that will be generated will be different for everyone.

Heading towards the last step all we need to do is uncomment the last stage of Heroku deployment and push the changes back to the Github repo.

2.9-removing comments

Just before that, we need to create a ‘Procfile’ so that Heroku can understand which app to run for that run the following in terminal/cmd.

type nul >> Procfile

Inside the Procfile paste this snippet

web: gunicorn app:app

Now push the changes to the repo by

git add . && git commit -m "your commit message" && git push origin main

If everything goes well then you will see

3.0-after deployment on Heroku

Note: While pushing make sure you temporarily remove the ‘data’ and ‘data_set’ folders as if you push with it the slug size of your app will exceed 500Mb and your deployment fails.

Head towards the URL

https://app-name.herokuapp.com/

Here replace the ‘app-name’ in the URL with your own Heroku app name.
Once you hit that URL you will see our web app like below.

3.1-web app

And finally, we are done! it was a slightly long procedure but it’s how basically implemented. Most of the industries prefer these pipelines as it enhances efficiency and helps to keep a good track of our data and changes.

I just show a simple way of implementing it using DVC but it has many more features are there and which can be incorporated depending upon the type of project. Every project has a different architecture as per its complexity and you use various other tools accordingly.

This is just how to get started with MlOps using DVC you can also use other alternatives like MLflow and cloud platforms like AWS, GCP, Azure. But I think DVC is pretty powerful and a nice place to start with MlOps.

In case you have missed the first part go here for part-1 and this is my GitHub for complete source code. Also if you have any queries then you can contact me through Linkedin.
I really hope you liked this article and it helped to get started with MLOps!