Welcome to our 8th blog post! Today, we'll be uploading and deploying our Show and Tell model on a local server, uploading an image and getting the caption.

 

In order to create a web application, we'll be using a Python microframework called Flask. Flask is a well-known and well-documented micro web framework which acts as a backend for any website. Many large websites like Pinterest, LinkedIn, etc. use Flask in their backend.

 

Flask mainly revolves around a python file, which contains all the routing logic, and for our purpose will also contain the model loading and prediction logic. It has a bunch of helper html files, called templates. These templates are basically individual web pages on the website, and can be assigned to specific routes in the python file.

 

This is how the main folder looks:

And here's how the file structure looks:

 

In order to start the server, we simply execute the main.py file.

We go to the site as shown in the image (http://127.0.0.1:5000/) (you can also use "localhost:5000" without the quotes).

We upload the file of our choice and it displays the caption. We tried it on a couple of images:

 

 

When we press the "Upload" button on the homepage, the code sends a POST request along with an image to the flask server. The server then takes the image, puts it in storage, evaluates the model over said image, and displays the output prediction. The source html is programmatically written to display the image as well as the top 3 captions along with their predictions.

 

This was manually uploading the images to the server. What the MKR1000 can do is connect to the Flask server via WiFi, send a POST request containing the image that it has stored in its SD card, wait for the evaluation, get the caption back in a string format.

 

Here's the Github repo.

 

That's all for this blog. The next blog will be all about the speaker setup, configuration and testing.

Thanks for reading this blog, the next one will be up in no time!