IoT hands on using AWS Lamba - Spring Boot - RaspberryPi GrovePi

Started playing with the GrovePi Starter kit for RaspberryPi.
I chose GrovePi  this as there is no complex wiring, have a look at how nicely it fits the Raspberry pi .

I got involved  and able to get some sensor data easily using GrovePi Software, checkout
projects in
https://github.com/DexterInd/GrovePi

Here is the tutorial on the first project ..
https://www.dexterindustries.com/GrovePi/projects-for-the-raspberry-pi/raspberry-pi-led-tutorial/

Journey starts ...

After that I did couple of others , like home weather display and twitter feed .
I got excited now I want to do more , I want to do analytics . So  was thinking about gathering data from sensors- temperature , humidity  , sound and light readings and send it to thecloud for doing analytics . Python was new to me , but want to use it any way as I can learn a new language.It was easy and I wasn't stuck  with any thing .It was fun learning as well .
Go Python !

Data Layer 

Now I have to push data to a Data layer . Why not use an instance in  Google Cloud (they are giving 300$ in free credit!) .Rest API in cloud will be based on Java and Spring Boot .
Data will be stored in redis , as I don't want to store a lot of data . Just last 100 readings
or so and get the current and average readings from  the sensors ( this project info is in http://ajaxrocks.blogspot.com/2017/07/fun-with-iot.html ) for this but current integration is only for PubNub

Alexa Skill

While all this was going on , I see Alexa app demos . So I started looking into that
as well . Started building a sample app , using AWS Lambda's .. hey!! ..always want to get my hands on server-less programming as well . Alexa sample app Tutorial used node js .. this is good , I can sharpen my node js skills . Okay I built the sample app .. It was so much fun , the sample app used Facts as an array (that are  hardcoded ) . When you invoke it using Alexa , it chooses one of the Fact
randomly . Fun part is you change all the facts and then keep asking facts !!  . See programming can be fun

Picture Time ..

Concept is actually the time triggered to take 

picture instead of LED blink

Messaging using PubNub

While all this was going on , I learnt about PubNub in DevNetCreate conference
It provides Infrastructure as a Service for doing messaging . they have SDK for almost all the languages I use .Cool , now I can invoke the GroveSensors ( Light on ! ) using PubNub message . Tried it it worked great .. hey .. Next part if you haven't already guessed I can use Alexa to invoke it .. Yeah !

Rewiring to use API 

All set now I invoke , node js call to PubNub worked great .Deployed to AWS , now it just doesn't want to work !! Hmmmm... may be I am doing something wrong .. setup security , network interfaces .. still not working .. Don't know what the real reason was .Why waste time on this , let me set this up as a rest api in google cloud and use Alexa skill ( node js) to call that api... hey that can work .... setup the api .. changed the alexa app and everything worked like a charm

Shoutout to Alexa SDK, Google Cloud , PubNub , Raspberry Pi and Grove Pi ... Thanks Guys

Architecture

Learn it  ,Use it , Hack it  

This project was fun , it also helped understand technologies involved with IOT better .
Learn  new languages in a very pragmatic way . I have all the code I used in the github links
, so play with them , hack them for your use case , make them better ..

github links

Code for AWS Lambda ( Node js)
https://github.com/arun2dot0/AlexaNodeJS.git
Code for API  ( I setup in google cloud)
https://github.com/arun2dot0/metrics-rest-service-redis.git
Code for Raspberry pi ( Python )
https://github.com/arun2dot0/PubNubPython.git

Simple framework to Test your REST API

REST api testing made easy .

I am constantly involved in developing backend services for team and
worked on simple framework to test the services. Here is thought behind the framework .

Http Responses Validation

Services provide a response to indicate if the request was successful .
Usual Check  is HTTP Status  =200 . Also usually  part of JSON response is used to validate
eg  "status":"OK" . Framework adapts to these conditions and would validate the response for all request . More test can be easily added on top of base validation

Set URL , HTTP Headers once 

Base URL and the HTTP Headers to be setup can be setup once
and can be reused for all the tests .

Use Mustache templates to define HTTP Post and Put Payload

payload for POST and PUT are usually JSON and this can be easily setup as templates
This is the one from my example
{
  "firstName":"{{firstName}}",
  "lastName":"{{lastName}}",
  "phone":"{{phone}}",
  "email":"{{email}}"
}
Data for the template can be driven from JSON.
Framework converts   JSON -> Java Object  and Object is used to populate the template .


Example of JSON data to populate the above template
{
   "firstName":"Arun",
   "lastName":"Selvamami",
   "phone":"000-000-000",
   "email":"arun2dot0@gmail.com"
}

Easily setup for multiple environments 

You can rerun the test for other environments by setting up different data
and changing the Base url

framework is powered by RestAssured , hamcrest and mustache

Check out the code at https://github.com/arun2dot0/TestRest

AngularJS

AngularJS has been attracting a lot of attention for all the good reasons , this article is to look at angular  features and compare it to other frameworks .

Two-Way Binding

Let's look at the best and the dominating factor on why you should look at AngularJS . Its the two way binding . Most Javascript frameworks adapt the Model-View paradigm and the View is rendered from the model when the page is rendered . But what happens after that when the model changes or view gets updates? there are callbacks that the UI developers have to work with to make sure that the View is in sync with the model and the model gets updated with changes in View .  But AngularJS provides this capability by default without any callbacks the Two-way binding is provided by default ( for Code - Have a look at the example provided under Directive )

Simple JS

All the code for angular js doesn't require you to understand any new syntax or framework  . Its all fully Javascript. So you will already understand most of the  code even without knowing angular

Easy to adapt and get Started

Requires simple js include angular.js , angular-animation.js
Example

<html ng-app>

<body>
  <h1>Hello {{1 + 2}}</h1>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js">
</script>
</body>

</html>

Advantages

1.   Reduce boilerplate
2.   Use default structure that is self explanatory
3.   Easy to test 

Directive

Directives are the AngularJS way of dealing with DOM manipulation and providing  the two-way binding , they are also responsible for  rendering and providing reusable UI widgets. They can be used for simple things like reusing HTML snippets or to more complex things like modifying the behavior of existing elements (like ng-show, ng-class) or integrating with third-party components like charts . Let's look at an example of ng-repeat
Example

<div ng-repeat=‘item in cart.items’>
          <span ng-bind=‘item.name’></span>
          <button ng-click=‘cart.delete($index)’>delete</button>
  </div>
 javascript

 var myApp = angular.module(‘coolApp’,[]);
 myApp.controller(‘CartCtrl’ , function () {
                                              this.items =[{ name:’Choclate’},
                                                                  { name:’bread’},
                                                                   { name:’Cofee’}];
 this.delete = function(index) {
                                              this.items.splice(index,1);
                       };
 });

The delete function just changes the model without any updates to the View, why ? because there is no need to do this , the view is automatically updated based on changes to the model . This is the power of two-way binding 

Databinding

Databinding is achieved in javascript by using the double curly brackets -  {{}}   . 

Best way to understand this is by an example

Example

hello.js 
   this.greeting =‘Hello!’;

hello.html 
   {{greeter.greetings}}
   <input ng-model=‘greeter.greetings'>

ng-cloak can be used to avoid unset values on load , can also be done by ng-bind

Controller (ng-controller)

Controller is a specialized Directive ng-controller and does the following

1.  Expose model to View
2.  Expose functions to handle UX
3.  Update model to change the view
4.  Instantiate once per use in templates
5.  Can request $scope

$scope - can be nested , without proper $scope read can be propagated to the nested levels however write is always local to the method . To avoid this use $scope

 myapp.Controller(‘GreetCtrl’ , function ( $scope ) {

                                                       $scope.greeter = { greeting:’Hi’}

                                                  });

$watch(expression,callback )  - executes callback when expression changes 

$apply - used when the model changes outside the angular control

Filters

Mainly used for formatting the output and  the built in filters for currency and date

Example

{{invoice.total | currency}}

custom filters can be added using 

myApp.filter( ‘myfilter’ , function() { …});

Server Interaction

basically done by using $http or by $resource  (for REST) , there are also other options

1. Restangular
2. Angular Fire
3. Breeze JS

Example

$http.get(‘/someurl’);
$http.get(‘/someurl’).success( function ( data,status,header,config)  { ….})
                                 .error( function ( data,status,header,config)  { ….}). 

 - specifies where angular is work on the view

$routeProvider  for configuration specific to url  , following can be configured

1.  Controller
2.  Template
3.  URL 
4. custom values