This is the first of series of blog posts on my short adventure on making a great AI powered application — Shazam for Pets — from an old fashion and so 2001 Web 2.0 Java application.
As a Java developer I maintain my skills in order to be competitive on the market. When I heard all those buzz words about containers: Docker, Kubernetes, and modernizing your application for ☁️ I decided to give it a try. In February 2018 I participated in the Index Conference 2018 in San Francisco🌉. At the conference I demoed a small Code for Good Quiz for which I modernized JPetStore — an old fashioned Java EE application — with Kubernetes and AI.
JPetStore is a traditional Java Enterprise Edition application that demonstrates the best practices on deploying the JAVA EE application with the latest standards. I got my hands on its version with Spring and MySQL DB.
Freeman: The Pet Store Demo is the reference application for J2EE that showcases the main features of the J2EE platform. It’s part of the Blueprints program that seeks to provide best practice guidelines for J2EE application development.
Implicit in the Java Pet Store is a set of components that can be reused in other contexts. For example, the Java Pet Store includes a shopping cart, a mailer, and inventory components. It’s our intention that this reference application can be used as a framework for building real-world applications. In addition, recommendations about typical design decisions need to be made, such as JSP versus servlets, stateful versus stateless session beans, and container- versus bean-managed persistence.
Then I followed these simple steps to modernize infrastructure of the application. I containerized it and brought it to the cloud, and I added an AI powered mobile App as the new UX:
Step one — Dockerizing the application;
Step two — deploying it with Kubernetes;
Step three — the new UX with AI — the Android app with IBM Watson;
This blog post describes in steps what I have done.
Step one — Dockerizing the application
I have found a nice recipe for Dockerizing the jPetStore app.
In short I created an account on docker.io — blumareks. I added my image of jpetstore to the repository there, so it can be referenced in the next steps.
Check my github repo for the details: https://github.com/blumareks/2018-petstore
I have changed the files responsible for the push to the registry — docker-compose.yml
After that I was able to build and run my docker image using Docker for Mac:
$ docker-compose build
$ docker-compose up -d
* to stop it and remove the images (rm) just write:
docker-compose stop
docker-compose rm -f
When I tested that everything works I was ready to push the images to the Docker repository:
$ docker-compose push
And they are here: https://cloud.docker.com/app/blumareks/repository/list
Running my image on my local machine even in the cool Docker wasn’t the thing I wanted. I wanted to deploy it on the ☁️ and have it taken care of. So I learned that people are using Kubernetes for that. So I decided to do what is fashionable — the Silicon Valley way 🌁
Step two — deploying it with Kubernetes
Running Docker images is just great experience. Now I am ready to deploy the application to the IBM Cloud.
Before you begin, you must have a Pay-As-You-Go or Subscription IBM Cloud http://bluemix.net account to create a free cluster.
To create a free Kubernetes cluster
a. From the IBM Cloud Catalog go to Containers category, click Containers in Kubernetes Clusters.
b. Read up on clusters, then click Create. Enter a Cluster Name.
c. The default cluster type is free. Next time, you can create a standard cluster and define additional customizations, like the number of worker nodes.
d. Click Create Cluster. The details for the cluster open, but the worker node in the cluster takes a few minutes to provision. You can see the status of the worker node in the Worker nodes tab. When the status reaches Ready, your worker node is ready to be used.
To set up the cluster took some time (well you might look in the step three). When it was done — my cluster was ready.
The really easy for the Kubernetes beginners way is to use the GUI provided by IBM Cloud. If you click on the name of your cluster you will be shown the next page with its details. Just follow directions to open the dashboard the item “Access” on your menu on the left as shown here:
When everything is ready — you might open the dashboard.
You would need the Token for that:
$ kubectl config view -o jsonpath=’{.users[0].user.auth-provider.config.id-token}’
$ kubectl proxy
Copy the token, and use it in the login screen.
I needed to create mysql-pod, mysql-service, and openliberty-pod (the most atomic elements in the Kubernetes are “pods”).
I simply clicked the create button and provided link to those 3 files in the following order:
a. shazam4pets-mysql-pod.yaml
b. shazam4pets-mysql-service.yaml
c. shazam4pets-openliberty-rc.yaml
Picture: Adding the YAML files.
The files were using the Docker images we created earlier. Their listings (WATCH OUT SPACES ARE IMPORTANT — seriously 🥇) comes in my repo ^^
a. shazam4pets-mysql-pod.yaml
b. shazam4pets-mysql-service.yaml
We are ready to access it from our new UX. More details on the previous two steps are in my GitHub repo: https://github.com/blumareks/2018-petstore
Step three — the new UX with AI — the Android app with IBM Watson;I was inspired by Shazam application for music. Alike with Shazam for music one could point a smart phone on a pet, take a picture and get the name / breed of an animal, with the price quote from our pet store.
How to do it? First I need to classify what is on the picture. The IBM Watson Visual Recognition service is pretty awesome in classification of the animals. There is a quite robust classification of dogs, with their breeds. There are other animals classifiers as well. I need an http://bluemix.net IBM Cloud account, and I need to provision the Watson Visual Recognition service for that. That is easy.
Some time ago I have created a selfie app for Android (you can get the https://github.com/blumareks/cloudinary-watson/tree/master/lab2 ← Smart Selfie app here), so I reused the same code tailoring it for the purpose of our Shazam for pets AI powered app. The Android app GitHub is here: https://github.com/blumareks/2018-petstore-android
In addition to the IBM Watson Visual Recognition, I added https://console.bluemix.net/catalog/services/text-to-speech →IBM Watson Text to Speech service — so kids could get the information faster without reading it (they love Voice UI I noticed).
Finally you need to copy the above mentioned credentials from those Watson services, and paste them in the credentials.xml file of this Android app.
Please visit my GitHub repo to learn more and see the videos on how to do it: https://github.com/blumareks/2018-petstore
Please follow me on the twitter: https://twitter.com/blumareks
