Have you been puzzled by tons of videos, blogs and other resources on the internet and don't know where and how to deploy your AI models?
Won't it be nice if you could have a template where you just insert your trained model files, edit some promo text and Voila, it's done.
Well, look no further because this repository makes it as easy for you as it sounds!
NOTE: For now, we are exclusively focused on image classification models built using tensorflow/pytorch. Later we would expand to models dealing with text and speech data as well as training using MXNet or a julia environment
Open GitHub
Log in with your credentials. [ Create an account if you have not done it already]
Open the terminal/command prompt on your system
Move to a suitable location where you want to keep the project files locally
Example: cd Desktop/projects
git clone --depth 1 https://github.com/smaranjitghose/img_ai_app_boilerplate.git
cd img_ai_app_boilerplate
pip install -r requirements.txt
model
sub-directory cd model
start .
Paste your Keras.h5
model files there
Shoot up your favorite code editor/IDE (I prefer VSCode).
code .
[Type this in the terminal to open VSCode if you already have it installed]
Now open the file img_classifier.py
.
Search for the variable labels
in the code and set its' value as per the labels of the dataset used for training your model.
[say if you are doing Cats Vs Dogs classification, then labels = {0: "Cats", 1: "Dogs"}
]
NOTE: This is totally dependent on your model training
Update the value of the variable model
with the path of your model file.
[say model = tensorflow.keras.models.load_model('model/catsvsdogs.h5')
]
Save the changes.
Continuing with changes to the User Interface or the frontend of our app please follow the steps mentioned below:
Open app.py
.
Search for st.title
and update the Title of the app as per your application's needs.
[say st.title('Our Cats vs Dogs Classifier')
]
Now search for variable page_title
and update it with the same. This will tweak the SEO.
[say page_title="Cats Vs Dogs",
]
If you have some affiliation or maybe the app is made completely by you (perhaps with a group of your friends/colleagues) as a pet project, you can reflect that in the app by searching for st.subheader
and updating it
[say st.subheader("By John Doe and Jane Doe")
]
^^ Delete any or all code that you won't use from the above
Search for the function call display_team("Your Awesome Name", "./assets/profile_pic.png","Your Awesome Affliation","hello@youareawesome.com"
and update the following parameters as per your own discretion:
assets/images/
For adding multiple members, you can call the same function multiple times. For example:
display_team("John Doe","./assets/john_doe.png","Stanford University","contact@johndoe.com")
display_team("Jane Doe","./assets/jane_doe.png","Harvard University","contact@janedoe.com")
Login in to Firebase, using your Gmail ID.
Click on the Get Started
button which will, take you to your console.
Click on Add project
. Once you do so, a 3 Step process will start.
Enter the name of your project. (Pro tip: Keep the same name as the name of your App. It would make it easier to identify.)
The next step is pretty self explanatory and you may/may not choose to enable google analytics.
If you choose to enable google analytics, then you will have to select or create a Google Analytics account.
If you choose not to, then a Create project
button will appear instead of Continue.
Once you click on Create project
, you will land on Firebase Console.
Once you land on the Firebase Console, click on the Create Web App
icon.
Give the name of your web app and unless required, do not select the Hosting option and click next
.
Copy the code which appears and store in a config.txt
file for later use.
Click on Continue to Console
.
Once on Console, click on the Storage
Option on the left panel and then click on Get Started
.
Click Next
and then select a server closest to your location.
Once the Storage is initiated, click on the Rules
tab and change:
allow read, write: if request.auth != null;
to allow read, write;
in the code snippet which appears on the screen.
Note: This is only for testing purposes and in real life scenarios refrain from doing this.
This change basically allows us the upload and download the images without authenticating every time.
With this you have set up the Storage successfully. You can manage your app's cloud server from here.
Click on the Realtime Database
Option on the left panel.
Once on the page, click on Create Database
button.
When you click the button, there will be a prompt to set the Security rules. It is recommended to start in locked mode so as to ensure security of the data.
With this you have set up the Database successfully. Now whenever a user writes a feedback, you can check it here in this database. Since this database stores data in terms of JSON
files, you can also export the JSON file and use it in whichever way you like.
Since everything is set up in the Firebase Console, the only thing left to do is to link the services to your app. You can do it this way:
Open firebase_bro.py
Remember the config.txt
file which we created earlier? Open it up and copy the contents of firebaseConfig
into config
variable inside firebase_bro.py
.
Save the File.
Voila! You have Successfully set up Firebase into your app!
If you do not want to use firebase please feel free to:
Remove the firebase_bro.py
file from the current working directory
Delete the following lines from the app.py
file:
import firebase_bro
.
firebase_bro.send_img(image)
line inside the Home
block of the if else condition.
firebase_bro.send_feedback(first_name, last_name, user_email, feedback)
line inside the Feedback
block of the if else condition.
Also remove firebase
and all the lines below the comment For Handling firebase and pyrebase dependency issues
in the requirements.txt
REMEMBER: The current version of the app only supports jpg, png and jpeg images as input
Now, we are all set to test our prototype!
Open the terminal/command prompt and type
$ streamlit run app.py
Give it a few seconds to start on your local server, load Tensorflow and other cool stuff the app requires in order to function properly.
Upload Your Image, Click on Predict, Verify the working
NOTE: If you face any difficulties please raise an issue and let me know
Congrats! You have successfully deployed your models
If you wish to share this as a prototype for others to try or showcase it to your friends and collegeues, please follow these steps:
my_app
( DO NOT ADD LICENSE, README, CODE OF CONDUCT, GITIGNORE files at this moment)Depending upon your preference, you can make the repository private or public
Open the Terminal/Command Prompt once again
Make new folder having the same name as the github repository name
mkdir my_app
cp -a ./img_ai_app_boilerplate/. ./my_app/
cd my_app
rm -r Guides\
rm LICSENSE CODE_OF_CONDUCT.md CONTRIBUTING.md README.MD
rm -r assets\readme_assets\
git init
git remote add origin https://github.com/your_github_username/my_app.git
git add .
git commit -m "v.0.0.1"
git push origin main
Once successsfull, close the terminal.
Go to GitHub and locate the repository to check if the changes are reflected
Now Add your own custom:
Now as per your choice of hosting, please refer the following guides: