Shiju Varghese's Blog

Microsoft MVP For Sixth Time

Wed, 01 Jul 2015 15:00:02 GMT

I am delighted to announce that I have been awarded Microsoft Most Valuable Professional 2015 award in Microsoft Azure.This is my sixth Microsoft MVP award in a row (2010 - 2015).

On this occasion, I would like to thank Microsoft, Community leaders, MVP India Lead and finally Developers who are following my blogs and open-source projects. I would like to also thank my mother Rosy, my lovely wife Rosmi and my daughter Irene Rose.

Using Azure Event Hubs As A Message Hub For IoT Scenarios

Wed, 06 May 2015 06:14:00 GMT

When we build apps for larger IoT scenarios or working on Big Data solutions, one major challenge would be to handle millions of messages received from hundreds of systems where these messages will be subscribed by hundreds of other systems. To handle this kind of problem using our traditional enterprise messaging systems and publish-subscribe message brokers would be really a challenge as we need to handle massive amount of stream of data in a second, in which we may need to process the data and events in near real-time. Our most of the existing publish-subscribe message brokers would be failed when we deal with millions of messages in a second. Technologies like Apache Kafka solves this problem by providing a high-throughput distributed messaging system with a distributed commit log. Kafka is designed for cluster-centric design where you may need to leverage distributed coordination tools such as Apache ZooKeeper for coordinating and synchronizing the cluster nodes. This may leads to lot of operational complexity when working with larger distributed systems.

Azure Event Hubs provide easy provisioning of capacity to ingest events from millions of devices while preserving event order on a per device basis. Support for AMQP and HTTP allow many platforms to work with Event Hubs. Native client libraries also exist for popular platforms. Azure Event Hubs is a brilliant technology which can be used as Event Hub / Message Hub for your modern apps, especially for your IoT apps and Big Data solutions. Azure Event Hubs is Cloud powered managed service so that it removes the complexity for provisioning, managing, scaling of your brokered systems.

We have developed an example app for using Azure Event Hubs as a message hub for IoT (Internet of Things) scenarios. The project source is available on github at https://github.com/AccelNA/azure-guidance/tree/master/EventHub.

Here is the details for the example app:

Technologies:

Azure Event Hub
Azure App Services Web App
SignalR

Solution Architecture

Problem Domain

Build a message hub for IoT scenarios for sending millions of messages and events to the Cloud at massive scale, with low latency and high reliability.
Process the massive amounts of messages and events in near real-time.

Apps in the Demo:

Android app representing automotive vehicles.
Android app for receiving messages from IoT devices and sending it to IoT Message Hub.
Real-time web app for receiving messages from IoT Message Hub and providing real-time insight into the browser UI.

Solution Workflow

When automotive vehicles are moving towards roads, notify the GPS Coordinates to Android app for sending these events into an IoT Message Hub powered by Azure Event Hub. (For the sake of the demo, we use an Android app instead of automotive vehicles)
The Android app which receives the events from automotive vehicles, send the messages and events into IoT Message Hub.
A real-time web app running on Azure App Services Web App receives the events from IoT Message Hub and provide real-time insight on the data received.

Azure Services

Azure Event Hub – Working as the IoT Message Hub.
Azure App Services Web App – Running the real-time web app with SignalR.

Source Code

The project source including two android apps and a ASP.NET SignalR app is available here: https://github.com/AccelNA/azure-guidance/tree/master/EventHub/

Building Distributed Cloud Apps With Azure WebSites, WebJobs And Azure Service Bus Topic

Mon, 30 Mar 2015 09:24:00 GMT

In my previous blog post, Building Distributed Cloud Apps With Azure Cloud Services And Azure Service Bus Topic, I have introduced a reference Azure app for developing multi-tiered distributed apps using Azure Cloud services and Azure Service Bus Topic. In that app, we have used two Azure worker roles for running a background processing system and a Notification Hub. This app is same like the previous one, the only difference here is that we are replacing two Azure worker roles with two WebJobs and running in a Azure WebSite. In the previous system, we have used a one Azure web role and two Azure worker roles for an ordr processing demo app. Here we replace these three systems with one WebSite, which is also working as the host for two WebJobs. In short, we replace the worker role with WebJobs. The extra functionality which we have added in this version is the distributed caching with Azure Redis cache.

The project repository is available here: https://github.com/AccelNA/azure-guidance and the source code of this drop is available here: https://github.com/AccelNA/azure-guidance/tree/master/WebSite

Here is the infomration about the sample app:

Technologies:

Azure Web Sites
Azure WebJobs
Azure Service Bus Topic
Azure Notification Hub
Azure DocumentDB
Azure Redis Cache

Solution Architecture

Problem Domain

Order processing app in a distributed computing environment.
Application logic should be deployed into multiple components.
An order request from customer, should notify to multiple systems – including order processing system and a Notification Hub.
Cross platform mobile apps should be able to receive real-time push notifications from Cloud powered systems.
A RESTful API for working as backend for mobile apps.
Cost effectiveness is important for this system.

Solution Workflow

End user submits an order through a web app, which is hosted in Azure Web Site. The Web Site is also hosting two WebJobs: a WebJob for performing order processing logic and another WebJob for sending real-time mobile push notifications.
The Azure Web Site publishes a message into Azure Service Bus Topic for the subscribers of the distributed systems environment.
A WebJob running in a Azure Web Site subscribes the message from Azure Service Bus Topic , and then process the order and finally persist the data into a NoSQL Database – Azure DocumentDB.
A notification hub running in a WebJobs, subscribes the message from Azure Service Bus Topic, and then send cross platform, real-time push notifications to mobile apps running in Android, iOS and Windows Phone.
The web app hosted in Azure Web Site shows the status of orders which is processed in the WebJob which performs order processing logic.
Mobile apps are consuming REST API hosted in Azure web site.

Azure Services

Web Site– Used for running web app for receiving orders from customers. The Web Site is also hosting two WebJobs.
WebJob - WebJob - Background worker for receiving messages from Service Bus Topic and then processing the orders.
WebJob - Background worker for receiving messages from Service Bus Topic and then sends real-time push notifications to 2. cross platform mobile apps.
Service Bus – Working as a message broker
Notification Hub – Sending cross platform push notifications.
DocumentDB – NoSQL data store.
Web Site – Used for running RESTful API.
Redis Cache - Distributed caching.

Building Distributed Cloud Apps With Azure Cloud Services And Azure Service Bus Topic

Fri, 13 Mar 2015 05:56:00 GMT

We have been developing few sample apps for providing guidance on building cloud apps with Microsoft Azure. We release the first sample app for building distributed apps on Microsoft Azure. The guidance app is available on github at https://github.com/AccelNA/azure-guidance.

Here is the infomration about the sample app:

Technologies:

Azure Cloud Services
- Web Role
- Worker Role
Azure Service Bus Topic
Azure Notification Hub
Azure DocumentDB
Azure Web Sites

Solution Architecture

Problem Domain

Order processing app in a distributed computing environment.
Application logic should be deployed into multiple systems so that individual systems can separately scale-up and scale-down in Cloud.
An order request from customer, should notify to multiple systems – including mobile apps.
Cross platform mobile apps should be able to receive real-time push notifications from Cloud powered systems.
A RESTful API for working as backend for mobile apps.

Solution Workflow

End user submits an order through a web app which hosted in Azure web role.
The Azure web role publishes a message into Azure Service Bus Topic for the subscribers of the system in a distributed computing environment.
A worker processor running in a Azure worker role subscribes the message from Azure Service Bus Topic , then process the order and finally persist the data into a NoSQL Database – Azure DocumentDB.
A notification hub hosted in Azure worker role subscribes the message from Azure Service Bus Topic, then send cross platform, real-time push notifications to mobile apps running in Android, iOS and Windows Phone.
The web app hosted in Azure web role shows the status of orders which is processed in worker processor.
Mobile apps are consuming REST API hosted in Azure web site.

DocumentDB - NoSQL Database As A Service On Azure

Fri, 22 Aug 2014 06:03:00 GMT

Microsoft Azure team has announced a new NoSQL database named "DocumentDB". DocumentDB is a fully managed, massively scalable, NoSQL database as a service on the Microsoft Azure cloud platform. This is a right movement from Microsoft as the existing Table storage was not effcient comparing to other NoSQL databases available in the market. In my initial evalution, DocumentDB is the most feature rich NoSQL databse comparing to many popular NoSQL database. In DocumentDB, we can write Trigger, Stored Procedure and User Defined Function (UDF) in JavaScript.

Here's the highlight of the DocumentDB:

Elastically scalable
Shcema-free database
JavaScript as a language for writing query and transaction processing (JavaScript as a modern replacement for T-SQL)
JSON based document model
HTTP for transportation protocol.
ACID transactions with snapshot isolation
LINQ query provider for .NET

Here's the link for some resources:

Sample App With ASP.NET Web API and ReactJS

Fri, 15 Aug 2014 11:44:00 GMT

We have just started a sample app for demonstrate building apps with ReactJS and ASP.NET Web API. An early version of the app can available on github at https://github.com/shijuvar/react-aspnet . Please note that the ReactJS version of the app is not a final version, but it is an early version which will continuously refactor with a proper Flux architecture. The RESTful API written with ASP.NET Web API 2.

Why ReactJS

We have been using MVC for building web apps and REST services for long time. At server-side, MVC is really good choice for building web apps. At one day, someone else has started to use MVC for building client-side apps too and provided a MVC framework for front-end apps. Then everyone followed that convention for solving all kinds of problems in client-side apps. IMHO, using MVC for client-side apps is really bad idea and I believe that MVC doesn't scale at larger cleint-side apps. The real beauty of ReactJS is that it is keeping away from existing conventions and patterns and trying to bring some practical solutions for solving the problem around building larger front-end apps which can be easily scale-up with recommended architecture practices such as Flux.

React is a JavaScript library developed by Facebook and Instagram team, for building user interfaces. The entire front-end of Instagram web site and some parts of the Facebook web site built with ReactJS. Interestingly, you can use ReactJS with other front-end frameworks such as AngularJS and EmberJS. You can use ReactJS as the view part along with MVC frameworks. But, in practice, I don't recommend to use ReactJS with traditional MVC frameworks. ReactJS introduces Virtual DOM, which is awesome part of the ReactJS library and it enables high performance for the rendering of UI. ReactJS provides better performance for the UI rendering than MVC frameworks such as AngularJS and EmberJS. You can build re-usable UI components with the Virtual DOM abstraction and later we can compose these components on the actual DOM. For scaling front-end apps, we can use Flux architecture which is basically set of architecture practices, that provides data flows in a single direction. I have evaluated BackboneJS, EmberJS, AngularJS and React and highly recommend React for building user interfaces.

Source Code

The source code is avaialble in github at https://github.com/shijuvar/react-aspnet

Microsoft MVP On Microsoft Azure

Wed, 02 Jul 2014 06:54:00 GMT

I am delighted to announce that I have been awarded Microsoft Most Valuable Professional 2014 award in Microsoft Azure.This is my fifth Microsoft MVP award in a row. Last four years, I was received Microsoft MVP award for my contributions to ASP.NET, but this time I am honoured with Microsoft Azure MVP award.

On this occasion, I would like to thank Microsoft, Community leaders, MVP India Lead and finally Developers who are following my blog and open-source projects.

Using Azure Redis Cache As A Persistent Storage For ASP.NET Session State

Mon, 30 Jun 2014 06:41:38 GMT

In this post, I will demonstrate how to use Azure Redis Cache for storing ASP.NET session state. In Azure, In-Proc session mode does not work as our application will be working with sticky sessions on a load balancing scenario. In this context, ASP.NET session state and caching do not work so that we have to put ASP.NET state information on a persistent storage. And it is very important that we should develop the cloud apps in stateless manner so that we can easily scale our apps. In Azure, we can leverage the following storage options as a persistent storage for storing ASP.NET state information.

Azure Cache & Azure Redis Cache
Azure Table storage
SQL Azure

In this post, let’s focus on Azure Redis Cache for storing ASP.NET Session state. Azure Redis Cache is a high performance caching service on the Azure, based on the open source Redis cache. Redis has been widely used as session store by many developer communities due to its simplicity and high performance.

The information below provides how to use Azure Redis Cache for storing ASP.NET session state.

Step 1 – Create Azure Redis Cache

In the Azure portal, create a new Azure Redis Cache as shown in the below figure.

Figure 1 – Creating new Azure Redis Cache

Once you have created the Cache, you can browse the cache services from the Caches section. The figure below shows the summary of Cache in which we can take the properties such as Host Name, Port and SSL Port, and Keys which can be used for connect our client apps with Cache service. Let’s copy the properties and keys of Cache for communicate our client apps with Azure Redis Cache.

Figure 2 – Summary of the Azure Redis Cache

Step 2 – Configure the ASP.NET App with ASP.NET Session State Provider for Redis

In the previous step, we have created a Cache service on the Azure Redis Cache. Let’s configure our ASP.NET app, in order to use Azure Redis Cache for storing ASP.NET Session values. Microsoft provides an ASP.NET Session state provider for Redis which is available as a NuGet package named RedisSessionStateProvider. You can install this using Package Manager console with the following command.

PM> Install-Package Microsoft.Web.RedisSessionStateProvider –Pre

If you are using Manage NuGet packages windows, don’t forget to choose the “Include Prerelease” as the this package is currently running in the preview version. When we install the RedisSessionStateProvider package, it will automatically add the following on the web.config file for configure the Azure Redis cache as the storage for ASP.NET Session state provider.

<sessionState mode="Custom" 
                 customProvider="MySessionStateStore">
      <providers>     
        <!--
          <add name="MySessionStateStore" 
            host = "127.0.0.1" [String]
            port = "" [number]
            accessKey = "" [String]
            ssl = "false" [true|false]
            throwOnError = "true" [true|false]
            retryTimeoutInMilliseconds = "0" [number]
            databaseId = "0" [number]
            applicationName = "" [String]
          />
        -->
      <add name="MySessionStateStore" 
          type="Microsoft.Web.Redis.RedisSessionStateProvider" 
         host="127.0.0.1" accessKey="" 
          ssl="false" />
</providers>
    </sessionState></system.web>

From azure portal, let’s copy the properties and access key and put the values on the configuration. Now we can use ASP.NET Session state in a normal manner where we can store and read values from Session, which will be use Azure Redis cache as the storage mechanism for your ASP.NET apps. These apps will be easily scalable on the Azure cloud as the Session state values are storing in a persistent storage.

ASP.NET Web API/AngularJS SPA Demo App Updated (webapi-angularjs-spa v1.2.0)

Wed, 28 May 2014 07:05:37 GMT

We have released an updated version for the single page application (SPA) demo built with ASP.NET Web API 2 and AngularJS. The current version (v1.2.0) of the demo app available on github at https://github.com/MarlabsInc/webapi-angularjs-spa. The following are the new features added in the webapi-angularjs-spa v1.2.0:

Added unit tests for client-side JavaScript with Jasmine.
Added paging with ng-Table.
Role based security for both server-side and client-side.

Here are the complete set of features in the current version:

REST API with ASP.NET Web API 2.
Server-Side security with ASP.NET Identity.
Single Page Application(SPA) with AngularJS.
AngularJS factory $resource for interacting with RESTful server-side data sources.
AngularJS $http interceptors.
AngularJS directives.
Task automation with Gulp.js
Unit tests for client-side JavaScript with Jasmine.
Paging using ng-Table.
Role based security.

JavaScript Unit Tests With Jasmine

In the current release, we have included unit tests for client-side JavaScripts, written with Jasmine. This provides unit tests for AngularJS Conrollers and Services. To run the unit tests, navigate to the directory of ResourceMetadata.Web project in command prompt, and run the command gulp tests which will redirect to the page SpecRunner.html, where results of the tests can view as shown in the below figure.

Role Based Security For The SPA

The current version provides role based security for both server-side and client-side. The write opeartions for Location entity is restricted with admin user. For a normal user, UI elements for creating new Location is removed when the view templates are loading and the templates will put on the cache.

The figure below shows the UI of Location page for a normal user.

The figure below shows the UI of Location page for a admin user.

Source Code

For more information on the project and to download the source code, check out https://github.com/MarlabsInc/webapi-angularjs-spa

Pub/Sub In Node.js Apps Using Azure Service Bus Topics

Thu, 24 Apr 2014 11:59:24 GMT

In my previous post Building Distributed Node.js Apps with Azure Service Bus Queue, we have discussed how we can design distributed apps in Node.js by leveraging Microsoft Azure Service Bus Queues. Service Bus Queue provides brokered communication between apps regardless of whether hosted on Cloud or on-premises server. Service Bus Queue is designed for delivering the brokered messages to single consumer or an app. We can say that Service Bus Queue is providing a one-to-one communication infrastructure. But, in many scenarios, we may need to deliver the brokered messages to multiple consumers or apps, where we can use Azure Service Bus Topics and Subscriptions which provides a one-to-many communication with a publish/subscribe pattern. Service Bus Topics are built on the top of Service Bus Queues for working with publish/subscribe scenarios. In this post, I will take a look at Azure Service Bus Topics and Subscriptions for implementing publish/subscribe pattern in Node.js apps.

Create Azure Service Bus Topics For Publishing Messages to Subscribers

In order to working with Azure Service Bus, we need to create a Service Bus namespace from Azure portal. if you need a free trial account in Azure, you can get it from here. Let’s create a Service Bus Topics to be consumed for subscribers of our distributed application.

Creating Azure Service Bus Client

Firstly, we need to install npm module azure to working with Azure services from Node.js app.

npm install azure

The code block below creates a Service Bus client object using the Node.js module azure.

var azure = require('azure');

var config=require('./config');

var serviceBusClient = azure.createServiceBusService(

                   config.sbConnection);

We create the Service Bus client object by using createServiceBusService method of azure module. In the above code block, we pass the Service Bus connection string from a config file. The azure module can also read the environment variables AZURE_SERVICEBUS_NAMESPACE and AZURE_SERVICEBUS_ACCESS_KEY for information required to connect with Azure Service Bus where we can call createServiceBusService method without specifying the connection information. We can set the environment variables for our Node.js app in the Azure developer portal for Azure Website and Azure Cloud Services apps.

Create Azure Service Bus Topic

In the previous step, we have created the Service Bus client object. Let’s create a Topics for publishing messages for its subscribers. The createTopicIfNotExists method of Service Bus client object, will create a new Topic or returns an existing Topic.

var topic = 'orders';

function createTopic() {

    //Create topic

    serviceBusClient.createTopicIfNotExists(topic,

function (error) {

        if(!error){

            console.log('Topic created or exists.');

});

The figure below shows that we have created Topic with name “orders”.

Create Azure Service Bus Subscriptions For Topics

Azure Service Bus Subscriptions can subscribe the messages published by Azure Service Bus Topics. In order to subscribe the messages published by the Topics, we have to create Subscriptions for the Topics. We can create Azure Service Bus Subscriptions by using createSubscription method of Service Bus client object.

function createSubscription(subscriber) {

// Create subscription

serviceBusClient.createSubscription(topic, subscriber,

 function (error) {

        if (error) {

            console.log(error);

        else

            console.log('Subscriber '+ subscriber+ '

              registered for '+ topic+ ' messages');

});

Typically, these subscribers will be different apps in a distributed app environment. Let’s create couple of subscribers for the sake of the demo.

var subscription1 = 'supplier1';

var subscription2 = 'supplier2';

createSubscription(subscription1);

createSubscription(subscription2);

The figure below shows that two subscriptions registered in the Azure portal for the Topics “orders”

Publishing Messages from Azure Service Bus Topic Messages

Let’s create Topic messages to later be consumed from subscriber apps.

function sendMessage(message) {

    // Send messages for subscribers

    serviceBusClient.sendTopicMessage(topic, message,

   function(error) {

        if (error) {

            console.log(error);

        else {

            console.log('Message sent');

});

Let’s send couple of Topic messages

var orderMessage1={"OrderId":101,

"OrderDate": new Date().toDateString()};

sendMessage(JSON.stringify(orderMessage1));

var orderMessage2={"OrderId":102,

"OrderDate": new Date().toDateString()};

sendMessage(JSON.stringify(orderMessage2));

Receiving Messages from Azure Service Bus Subscriptions

Subscriber apps can receive the message from Topics by using the method receiveSubscriptionMessage. The code block below reads the messages from Topics for two times. This will read the two messages we have published from Topics in the previous steps.

function receiveMessages(subscriber) {

    // Receive the messages for subscription.

    serviceBusClient.receiveSubscriptionMessage(topic, subscriber,

 function (error1, message1) {

        if (error1) {

            console.log(error1);

        } else {

            var topicMessage1 = JSON.parse(message1.body);

            console.log('Processing Order# ' + topicMessage1.OrderId

                + ' placed on ' + topicMessage1.OrderDate+ ' from ' + subscriber);

            //call for receive next message

            serviceBusClient.receiveSubscriptionMessage(topic, subscriber,

      function (error2, message2) {

                if (error2) {

                    console.log(error2);

                } else {

                    var topicMessage2 = JSON.parse(message2.body);

                    console.log('Processing Order# ' + topicMessage2.OrderId

                        + ' placed on ' + topicMessage1.OrderDate+ ' from ' + subscriber);

});

});

Unlike Service Bus Queues, which provides brokered messages for one app, Azure Service Bus Topics and Subscriptions can be used for subscribing messages for multiple apps. In the previous steps, we have created a Topic named “orders” where we have published two messages. We have registered two subscribers for subscribing the messages from Topics. Let’s call the method receiveMessages for our two subscribers.

receiveMessages(subscription1);

receiveMessages(subscription2);

The below console window shows that two messages published from the order Topics received from the two subscribers.

Source Code

The source code for the sample code, is available at https://github.com/shijuvar/azureservicebus-demos.

Scaling Socket.IO Apps with Azure Service Bus Topics

By leveraging the Azure Service Bus Topics, we can scale out Socket.io apps to multiple processes and multiple servers. Node.js module socket.io-servicebus can be used for scale out Socket.io apps, where Service Bus Topics are working as a store model for Socket.io. The Pub/Sub nature of Azure Service Bus Topics is ideal for working as a store model for Socket.IO. For more details, check out my blog post Scaling Node.js Real-time Apps with Windows Azure Service Bus

You can follow me on twitter at @shijucv

Single Page Application Demo With Hapi.js, AngularJS And Azure Table

Wed, 23 Apr 2014 09:15:55 GMT

In my previous post Building an API in Node.js Using Hapi.js and Azure Table, we discussed about building an API in Node.js using Hapi.js as web development framework and Azure Table as the storage mechanism. This app has been updated with a Single Page Application (SPA) client, built with AngularJS. The updated app is available on github at https://github.com/shijuvar/HapiAzure.

About the Demo App

I have developed this simple app for my personal use for just adding bookmarks with priority range from 1 to 5. I mainly created this for following github repositories with a priority so tat I can look on these bookmarks and evaluate it later based on the priority.

Here’s the technology stack used for the demo app:

REST API – Node.js and Hapi.js
Data Persistence – Microsoft Azure Table
Web App – AngularJS

The following Node.js modules are using for building the REST API.

hapi – HTTP Server framework, used for building the REST API app.
azure - Windows Azure Client Library for node, used for persisting data onto Azure Table storage.
joi - Object schema validation module for Hapi.js.
node-uuid – Generating unique id for Node.

Here’s the few screenshots of the app running as a Chrome app

API Endpoints

Currently, the API provides the following endpoints:

Path	Method	Functionality
/bookmarks	Get	Returns all bookmarks information from the Azure Table storage
/bookmarks/{rowkey}	Get	Get a single bookmark data for the given rowkey of Azure Table
/bookmarks	Post	Create new bookmark item onto Azure Table
/bookmarks/{rowkey}	Put	Update an existing bookmark item
/bookmarks/{rowkey}	Delete	Delete a bookmark item from the Azure Table

In the API project, the API endpoints are defined in the app.js file of routes folder

var Joi = require("joi");

var azure = require('azure');

var BookmarkController=require('./../controllers/bookmark');

var AzureTable=require('./../lib/azuretable');

var nconf = require('nconf');

nconf.env().file({ file: 'config.json'});

var tableName = nconf.get("TABLE_NAME");

var partitionKey = nconf.get("PARTITION_KEY");

var accountName = nconf.get("STORAGE_NAME");

var accountKey = nconf.get("STORAGE_KEY");

var tableService = azure.createTableService

                       (accountName, accountKey);

var azureTable = new AzureTable(azure.createTableService(

accountName, accountKey), tableName, partitionKey);

var bookmarkController = new BookmarkController(azureTable);

var routes =

method: 'GET',

path: '/bookmarks',

config: {

    handler: bookmarkController.getBookmarks

                             .bind(bookmarkController)

},

method: 'GET',

path: '/bookmarks/{rowkey}',

config: {

    handler: bookmarkController.getBookmarkById

                             .bind(bookmarkController)

},

method: 'POST',

path: '/bookmarks',

config: {

   handler: bookmarkController.insertBookmark

                              .bind(bookmarkController),

   validate: {

       payload: {

           title: Joi.string(),

           desc: Joi.string(),

           location: Joi.string(),

           priority: Joi.number().integer().min(1).max(5)

} }

},

method: 'PUT',

path: '/bookmarks/{rowkey}',

config: {

   handler: bookmarkController.updateBookmark

                       .bind(bookmarkController),

   validate: {

       payload: {

           title: Joi.string(),

           desc: Joi.string(),

           location: Joi.string(),

           priority: Joi.number().integer().min(1).max(5)

} }

},

method: 'DELETE',

path: '/bookmarks/{rowkey}',

config: {

   handler: bookmarkController.deleteBookmark

                                .bind(bookmarkController)

];

module.exports.routes = function (server) {

    server.route(routes);

};

REST API Mapping with AngularJS

The AngularJS service $resource is used for interacting with REST API services. The Angular service $resource is designed for working REST endpoints which lets the developers easily consuming RESTful server-side data sources.

bookmarkApp.factory("bookmarkService", ["$resource",

function ($resource) {

    var baseUri='http://localhost:3000/bookmarks/';

 var Bookmarks = $resource(baseUri+':rowkey',

{ rowkey: '@RowKey' }, { 'update': { method: 'PUT'} });

  var getAllBookmarks = function () {

       return Bookmarks.query();

};

    var addNewBookmark = function (newBookmark) {

       return Bookmarks.save(newBookmark);

};

   var updateBookmark = function (bookmark) {

         return Bookmarks.update(bookmark);

};

   var getBookmarkByRowKey = function (rowKey) {

       return Bookmarks.get({rowkey:rowKey});

};

   var deleteBookmark = function (rowKey) {

     return Bookmarks.delete({rowkey:rowKey});

};

    return {

      getAll: getAllBookmarks,

       addNew: addNewBookmark,

       update: updateBookmark,

      getByKey: getBookmarkByRowKey,

       remove: deleteBookmark

};

} ]);

Data Persistence with Microsoft Azure Table Storage

The Node.js module azure uses for working Azure Table storage. The code block below provides the implementations of CRUD operations against the Azure Table storage.

"use strict";

var azure = require('azure');

var uuid = require('node-uuid');

module.exports = AzureTable;

function AzureTable(storageClient, tableName, partitionKey) {

    this.storageClient = storageClient;

    this.tableName = tableName;

    this.partitionKey = partitionKey;

    this.storageClient.createTableIfNotExists(tableName,

   function tableCreated(error) {

        if(error) {

            throw error;

});

};

AzureTable.prototype = {

    find: function (query, callback) {

        var self = this;

        self.storageClient.queryEntities(query,

       function entitiesQueried(error, entities) {

            if (error) {

                callback(error);

            } else {

                callback(null, entities);

});

},

    addItem: function (item, callback) {

        var self = this;

        item.RowKey = uuid();

        item.PartitionKey = self.partitionKey;

        self.storageClient.insertEntity(self.tableName, item,

       function entityInserted(error) {

            if (error) {

                callback(error);

            callback(null);

});

},

    updateItem: function (item, callback) {

        var self = this;

        self.storageClient.updateEntity(self.tableName, item,

       function entityUpdated(error) {

            if (error) {

                callback(error);

            callback(null);

});

},

    deleteItem: function (rowKey, callback) {

        var self = this;

        self.storageClient.deleteEntity(self.tableName

, {

                PartitionKey : self.partitionKey

                , RowKey : rowKey

            ,function entityDeleted(error) {

                if (error) {

                    callback(error);

                callback(null);

});

Source Code

The demo app is available at https://github.com/shijuvar/HapiAzure

Creating Free Trial Account in Microsoft Azure

This demo app uses Microsoft Azure Storage which need a subscription in Azure. You will get free one month trial account in Azure which also provides free $200 credits to spending on all Azure services. You will get the free trial account from here.

You can follow me on Twitter @shijucv

Building Distributed Node.js Apps with Azure Service Bus Queue

Mon, 14 Apr 2014 15:46:20 GMT

In this blog post, I will take a look at Azure Service Bus Queue for building distributed apps in Node.js. Azure Service Bus Queues provides, a queue based, brokered messaging communication between apps, which lets developers build distributed apps on the Cloud and also for hybrid Cloud environments. Azure Service Bus Queue provides First In, First Out (FIFO) messaging infrastructure. Service Bus Queues can be leveraged for communicating between apps, whether the apps are hosted on the cloud or on-premises servers.

Service Bus Queues are primarily used for distributing application logic into multiple apps. For an example, let’s say, we are building an order processing app where we are building a frontend web app for receiving orders from customers and want to move order processing logic into a backend service where we can implement the order processing logic in an asynchronous manner. In this sample scenario, we can use Azure Service Bus Queue, where we can create an order processing message into Service Bus Queue from frontend app for processing the request. From the backend order processing app, we can receives the message from Queue and can process the request in an efficient manner. This approach also enables better scalability as we can separately scale-up frontend app and backend app. For this sample scenario, we can deploy the frontend app onto Azure Web Role and backend app onto Azure Worker Role and can separately scale-up both Web Role and Worker Role apps. We can also use Service Bus Queues for hybrid Cloud scenarios where we can communicate between apps hosted on Cloud and On-premises servers.

Using Azure Service Bus Queues in Node.js Apps

In order to working with Azure Service Bus, we need to create a Service Bus namespace from Azure portal.

We can take the connection information of Service Bus namespace from the Connection Information tab in the bottom section, after choosing the Service Bus namespace.

Creating the Service Bus Client

Firstly, we need to install npm module azure to working with Azure services from Node.js app.

npm install azure

The code block below creates a Service Bus client object using the Node.js module azure.

var azure = require('azure');

var config=require('./config');

var serviceBusClient = azure.createServiceBusService(config.sbConnection);

We create the Service Bus client object by using createServiceBusService method of azure. In the above code block, we pass the Service Bus connection info from a config file. The azure module can also read the environment variables AZURE_SERVICEBUS_NAMESPACE and AZURE_SERVICEBUS_ACCESS_KEY for information required to connect with Azure Service Bus where we can call createServiceBusService method without specifying the connection information.

Creating a Services Bus Queue

The createQueueIfNotExists method of Service Bus client object, returns the queue if it is already exists, or create a new Queue if it is not exists.

var azure = require('azure');

var config=require('./config');

var queue = 'ordersqueue';

var serviceBusClient = azure.createServiceBusService(config.sbConnection);

function createQueue() {

 serviceBusClient.createQueueIfNotExists(queue,

 function(error){

    if(error){

        console.log(error);

    else

        console.log('Queue ' + queue+ ' exists');

});

Sending Messages to Services Bus Queue

The below function sendMessage sends a given message to Service Bus Queue

function sendMessage(message) {

    serviceBusClient.sendQueueMessage(queue,message,

 function(error) {

        if (error) {

            console.log(error);

        else

            console.log('Message sent to queue');

});

The following code create the queue and sending a message to Queue by calling the methods createQueue and sendMessage which we have created in the previous steps.

createQueue();

var orderMessage={

 "OrderId":101,

 "OrderDate": new Date().toDateString()

};

sendMessage(JSON.stringify(orderMessage));

We create a JSON object with properties OrderId and OrderDate and send this to the Service Bus Queue. We can send these messages to Queue for communicating with other apps where the receiver apps can read the messages from Queue and perform the application logic based on the messages we have provided.

Receiving Messages from Services Bus Queue

Typically, we will be receive the Service Bus Queue messages from a backend app. The code block below receives the messages from Service Bus Queue and extracting information from the JSON data.

var azure = require('azure');

var config=require('./config');

var queue = 'ordersqueue';

var serviceBusClient = azure.createServiceBusService(config.sbConnection);

function receiveMessages() {

    serviceBusClient.receiveQueueMessage(queue,

      function (error, message) {

        if (error) {

            console.log(error);

        } else {

            var message = JSON.parse(message.body);

            console.log('Processing Order# ' + message.OrderId

                + ' placed on ' + message.OrderDate);

});

By default, the messages will be deleted from Service Bus Queue after reading the messages. This behaviour can be changed by specifying the optional parameter isPeekLock as true as sown in the below code block.

function receiveMessages() {

    serviceBusClient.receiveQueueMessage(queue,{ isPeekLock: true },

      function (error, message) {

        if (error) {

            console.log(error);

        } else {

            var message = JSON.parse(message.body);

          console.log('Processing Order# ' + message.OrderId

                + ' placed on ' + message.OrderDate);

          serviceBusService.deleteMessage(message,

        function (deleteError){

            if(!deleteError){

                console.delete('Message deleted from Queue');

});

});

Here the message will not be automatically deleted from Queue and we can explicitly delete the messages from Queue after reading and successfully implementing the application logic.

You can follow me on Twitter @shijucv

Building an API in Node.js Using Hapi.js and Azure Table

Fri, 11 Apr 2014 06:45:31 GMT

In this post, I will demonstrate a sample REST API app in a Node.js, by using Hapi.js as the web application framework and Azure Table as the storage. The source code of the demo app available on github at https://github.com/shijuvar/HapiAzure.

The following npm modules are using for this simple REST API.

hapi – HTTP Server framework, used for building the REST API app.
azure - Windows Azure Client Library for node, used for persisting data onto Azure Table storage.
joi - Object schema validation module for Hapi.js.
node-uuid – Generating unique id for Node.

Azure Table Storage

Azure table storage, stores structured data on the Microsoft Azure cloud platform. Azure Table storage is a NoSQL kind of data store, which provides massive scalability with the ability of storing terabytes of structured data. Azure Table entity has three systems properties: RowKey for Id of the Table, PartitionKey for partitioning the Table storage and Timestamp for date information.

Hapi.js

Hapi.js is a rich web development framework for building web applications and services. Hapi is configuration-centric framework which provides validation, caching, authentication, and also supports a plugin architecture for building scalable systems. Hapi is built by WalmartLabs to power their mobile backend services.

Building the Demo App

Let’s build our sample REST API demo with Hapi and Azure Table. In this demo, we are using a Azure Table named bookmarks. For the sake of the demo, we are simply using a Partition Key mybookmarks. Let’s create a config.json file for storing configurations of Azure Table storage.

    "STORAGE_NAME": "Your-Storage-Name",

    "STORAGE_KEY": "Your-Storage-Key"

    "PARTITION_KEY": "myBookmarks",

    "TABLE_NAME": "bookmarks"

A Helper for Azure Table

Let’s build a helper object for working with Azure Table in the Node.js app. Let’s create azuretable.js into the app folder lib.

var azure = require('azure');

function AzureTable(storageClient, tableName, partitionKey) {

    this.storageClient = storageClient;

    this.tableName = tableName;

    this.partitionKey = partitionKey;

    this.storageClient.createTableIfNotExists(tableName,

       function tableCreated(error) {

        if(error) {

            throw error;

});

};

In the above code block, we are using Node.js module azure for working with Azure Table. In the constructor function, we cerate properties for storing Azure storage client object, table name and partition key. We are also create the Azure Table within the constructor function. The property storageClient represents the Azure storage client object which can be used for working with a Azure Table storage. The complete implementation of the azuretable.js for Create, Read, Update and Delete operations with Table storage, is provided below:

"use strict";

var azure = require('azure');

var uuid = require('node-uuid');

module.exports = AzureTable;

function AzureTable(storageClient, tableName, partitionKey) {

    this.storageClient = storageClient;

    this.tableName = tableName;

    this.partitionKey = partitionKey;

    this.storageClient.createTableIfNotExists(tableName,

   function tableCreated(error) {

        if(error) {

            throw error;

});

};

AzureTable.prototype = {

    find: function (query, callback) {

        var self = this;

        self.storageClient.queryEntities(query,

       function entitiesQueried(error, entities) {

            if (error) {

                callback(error);

            } else {

                callback(null, entities);

});

},

    addItem: function (item, callback) {

        var self = this;

        item.RowKey = uuid();

        item.PartitionKey = self.partitionKey;

        self.storageClient.insertEntity(self.tableName, item,

       function entityInserted(error) {

            if (error) {

                callback(error);

            callback(null);

});

},

    updateItem: function (item, callback) {

        var self = this;

        self.storageClient.updateEntity(self.tableName, item,

       function entityUpdated(error) {

            if (error) {

                callback(error);

            callback(null);

});

},

    deleteItem: function (rowKey, callback) {

        var self = this;

        self.storageClient.deleteEntity(self.tableName

, {

                PartitionKey : self.partitionKey

                , RowKey : rowKey

            ,function entityDeleted(error) {

                if (error) {

                    callback(error);

                callback(null);

});

Controller for handling CRUD operations

We have created a helper object for working with Azure Table storage. Let’s create a controller for responding to routes of the Hapi.js app. Let’s create the file bookmark.js into the folder controllers.

"use strict";

var azure = require('azure');

module.exports = BookmarkController;

function BookmarkController(azureTable) {

    this.azureTable = azureTable;

BookmarkController.prototype = {

    getBookmarks: function (request, reply) {

        var self = this;

        var query = azure.TableQuery

            .select()

            .from(self.azureTable.tableName)

            .where('PartitionKey eq ?',

                 self.azureTable.partitionKey);

        self.azureTable.find(query,

     function itemsFound(error, items) {

           reply(items);

});

},

    insertBookmark: function insertBookmark(request, reply) {

        var self = this;

        var bookmark = {

            title : request.payload.title

            , desc :  request.payload.desc

            , location: request.payload.location

            , priority: request.payload.priority

};

        self.azureTable.addItem(bookmark,

       function itemAdded(error) {

            if(error) {

                reply(error);

            else{ reply(bookmark);}

});

},

    updateBookmark: function updateBookmark(request, reply) {

        var self = this;

        var bookmark = {

            PartitionKey : self.azureTable.partitionKey

            , RowKey : request.params.rowkey

            , title : request.payload.title

            , desc :  request.payload.desc

            , location: request.payload.location

            , priority: request.payload.priority

};

        self.azureTable.updateItem(bookmark,

      function itemUpdated(error) {

            if(error) {

                reply(error);

            else{ reply(bookmark);}

});

},

    deleteBookmark: function deleteBookmark(request, reply) {

        var self = this;

        self.azureTable.deleteItem(request.params.rowkey,

        function itemDeleted(error) {

            if(error) {

                reply(error);

            else{reply({ message : "Item deleted"})}

});

In the above code block, we are taking incoming form field values and simply calling the methods provided by AzureTable object. In the constructor function, we specify a property azureTable for refering the AzureTable object.

Specifying the routes of the app with Hapi.js

The routing mechanism provided by Hapi, is brilliant than any other Node.js web development framework. Hapi provides object schema validation by using Node.js module Joi. Let’s create a app.js file for specifying the routes with validations provided by Joi module.

var Joi = require("joi");

var azure = require('azure');

var BookmarkController=require('./../controllers/bookmark');

var AzureTable=require('./../lib/azuretable');

var nconf = require('nconf');

nconf.env().file({ file: 'config.json'});

var tableName = nconf.get("TABLE_NAME");

var partitionKey = nconf.get("PARTITION_KEY");

var accountName = nconf.get("STORAGE_NAME");

var accountKey = nconf.get("STORAGE_KEY");

var tableService = azure.createTableService

                       (accountName, accountKey);

var azureTable = new AzureTable(azure.createTableService(

accountName, accountKey), tableName, partitionKey);

var bookmarkController = new BookmarkController(azureTable);

var routes =

method: 'GET',

path: '/bookmarks',

config: {

    handler: bookmarkController.getBookmarks

                             .bind(bookmarkController)

},

method: 'POST',

path: '/bookmarks',

config: {

   handler: bookmarkController.insertBookmark

                              .bind(bookmarkController),

   validate: {

       payload: {

           title: Joi.string(),

           desc: Joi.string(),

           location: Joi.string(),

           priority: Joi.number().integer().min(1).max(5)

} }

},

method: 'PUT',

path: '/bookmarks/{rowkey}',

config: {

   handler: bookmarkController.updateBookmark

                       .bind(bookmarkController),

   validate: {

       payload: {

           title: Joi.string(),

           desc: Joi.string(),

           location: Joi.string(),

           priority: Joi.number().integer().min(1).max(5)

} }

},

method: 'DELETE',

path: '/bookmarks/{rowkey}',

config: {

   handler: bookmarkController.deleteBookmark

                                .bind(bookmarkController)

];

module.exports.routes = function (server) {

    server.route(routes);

};

The beauty of Hapi.js is that you can specify validation for the schema of form payload, query variable and route path. Here we create the BookmarkController object and assign its methods as handler functions of routes in the Hapi http server. The azure module’s createTableService method creates a Table storage client which passes to the constructor function of AzureTable object along with Table Name and Partition Key.

Let’s create the http server with Hapi

var Hapi = require('hapi');

var app = require('./routes/app');

var port = process.env.PORT || 3000;

var host = process.env.HOST || 'localhost';

var server = new Hapi.Server(host,port,{ cors: true });

app.routes(server);

server.start(function() {

    console.log("Hapi server started @ " + server.info.uri);

});

Source Code of the demo app

The code block structure of the app is provided below:

You can download the source code from https://github.com/shijuvar/HapiAzure.

You can follow me on Twitter @shijucv

Microsoft Azure Mobile Services Managed Client SDK with Offline Support

Sun, 06 Apr 2014 10:54:48 GMT

In this post, I will take a look at the new offline support provided by Microsoft Azure Mobile Services to the managed client SDK v1.3 alpha, which can be used for building Windows store apps with offline capabilities and syncing data between local database and Azure Mobile Service database. Microsoft Azure Mobile Services has been evolving over time with new useful features. On the last update, Azure Mobile Services started to support .NET for writing backend so that developers can now write backend logic either in C# or in JavaScript/Node.js. The latest addition to the evolving Microsoft Azure Mobile Services is the support for working with offline scenarios, which is an excellent feature, while we are building mobile apps. This lets the mobile apps to store data on the local storage in offline scenario and can sync-up the data to the Mobile Services storage when we are connected to the internet. The current version is a preview version available for managed clients. SQLite is used for persisting the offline data on the client apps.

Setting up the Mobile Services client with offline data persistence

The following steps demonstrate how to set up a Windows Store client app for working with offline storage on SQLite and sync offline data with Azure Mobile Services data.

Step 1 – Install SQLite for Windows 8.1

SQLite is used for persisting the data in the offline scenario so download and install SQLite for Windows 8.1 from here.

Step 2 – Add reference to SQLite for Windows Runtime (Windows 8.1)

In your Windows Store app, add a reference to SQLite for Windows Runtime (Windows 8.1) from Add Reference, Reference Manager, choose Extensions from Windows as shown in the below figure.

Step 3 – Add NuGet package WindowsAzure.MobileServices.SQLiteStore

Add NuGet package WindowsAzure.MobileServices.SQLiteStore in order to working with SQLite store in the offline scenario. Please keep in mind that you should select “Include Prerelease” to get the alpha version of the package.

Step 4 – Define Data Models with system property Version

In order to working with data syncing scenarios, data models should include a system property Version. You can decorate a version property with MobileServices.VersionAttribute.

public class TodoItem

        public string Id { get; set; }

        [JsonProperty(PropertyName = "text")]

        public string Text { get; set; }

        [JsonProperty(PropertyName = "complete")]

        public bool Complete { get; set; }

        [Version]

        public string Version { get; set; }

Step 5 – Declare a IMobileServicesSyncTable Table for data sync

Define the IMobileServicesSyncTable table object to working with a model entity for data sync scenarios.

//using statement for IMobileServiceSyncTable<T>

using Microsoft.WindowsAzure.MobileServices.Sync;

 private IMobileServiceSyncTable<TodoItem> todoTable = App.MobileService.GetSyncTable<TodoItem>();

Step 6 – Initializes the client sync context with a SQLite store

Initialize the client sync context object with a SQLite data store.

//Using statement for SQLiteStore

using Microsoft.WindowsAzure.MobileServices.SQLiteStore;

if (!App.MobileService.SyncContext.IsInitialized)

    var store = new MobileServiceSQLiteStore("localsync12.db");

    store.DefineTable<TodoItem>();

    await App.MobileService.SyncContext.InitializeAsync(store, new MobileServiceSyncHandler());

In the above code block, MobileService object is the Mobile Services client of your Windows Store App.

public static MobileServiceClient MobileService =

            new MobileServiceClient(

    "https://shijuvar-zumo.azure-mobile.net/",

    "your-application-key"

);

Data sync between offline storage and Mobile Services Data

In the above steps, we have configured our Windows store app for working with offline storage in a SQLite database. The information below provides how to insert data into offline storage and sync the data between offline and Azure Mobil Services storage.

Insert data to offline storage

The code block below inserts a new data to the database

private async void InsertTodoItem(TodoItem todoItem)

    await todoTable.InsertAsync(todoItem);

Push data to Azure Mobile Services storage from offline database

The code block below push the data to Azure Mobile Services from offline storage

private async void Push()

    string errorString = null;

try

        await App.MobileService.SyncContext.PushAsync();

    catch (MobileServicePushFailedException ex)

        errorString = "Push failed because of sync errors: " + ex.PushResult.Errors.Count() +

            ", message: " + ex.Message;

    catch (Exception ex)

        errorString = "Push failed: " + ex.Message;

    if (errorString != null) {

        MessageDialog d = new MessageDialog(errorString);

        await d.ShowAsync();

Pull data to local database from Azure Mobile Services storage

The code block below pull the data from Azure Mobile Services storage to local database which is used as offline storage.

The following MSDN code samples provides reference on the new Azure Mobile Services offline support.

Summary

Microsoft Azure Mobile Services has been evolving with lot of new features which lets the Mobile Services developers to develop compelling mobile apps. The new offline support is a very useful feature while building mobile apps . In this post, we have configured our Windows Store app to working with an offline storage in SQLite database. The Mobile Services client SDK provides API for syncing data between offline database and Mobile Services database.

You can follow me on Twitter @shijucv

ASP.NET Web API/AngularJS SPA Demo App Updated

Sat, 05 Apr 2014 08:32:44 GMT

A while ago, I had announced a single page application (SPA) demo, built with ASP.NET Web API 2 and AngularJS. Recently, we have been updated the source on both server-side and client-side. The current version (v1.1.0) of the demo app available on github at https://github.com/MarlabsInc/webapi-angularjs-spa.

Summary of Changes in the v1.1.0

The information below provides the summary of the changes made on the current version:

API services and Web, app are separated into two projects - ResourceMetadata.API and ResourceMetadata.Web
ASP.NET Identity integrated to the REST API services.
Leveraged Microsoft.Owin.Security.OAuth on the REST API services.
AngularJS version changed to v1.2.11.
AngularJS factory $resource used for interacting with RESTful server-side data sources.( In the previous version, it was used $http for interacting with REST API services)
Leveraged AngularJS $http interceptors.
Task automation done with Gulp.js

Building and running the application

Get the latest source from https://github.com/MarlabsInc/webapi-angularjs-spa
Build the solution in Visual Studio 2013 to install Nuget packages.(This will automatically restore Nuget packages. Please ensure you have Nuget version 2.7 or higher)
Before running the client Application (ResourceMetadata.Web), please ensure that the API project is running in IIS or IIS express.
Config.js file at ResourceMetadata.Web/Scripts/config.js holds the api url used by the client application. Update this file to change the api url appropriately.
If you haven't installed Node.js, download and install it from http://nodejs.org/
Install gulp.js globally on your machine by running the command npm install gulp –g.
Navigate to the directory of ResourceMetadata.Web project in command prompt and rum command npm install to install required Node.js modules onto the project.
Navigate to the directory of ResourceMetadata.Web project in command prompt and rum command gulp build to perform automation tasks before running the client app.
Run the client application.

Please note that if you are using an old version (v1.0.0) of the demo app, please drop the existing database ResourceMetadata from your SQL server before running the application. For a reference for task automation with gulp.js, check out my blogs post Gulp.js : A Better Alternative to Grunt.js

Upcoming features

Unit tests with Jasmine/Karma.
Leverage Browserify to bring Node.js require("module") syntax to the browser for better module management on the client-side.

Lot of people have been asking to me for providing documentation and articles for this project for building single page applications (SPA). I will provide few article about this project on bit later.

You can follow me on Twitter @shijucv

Node.js Tools for Visual Studio 2013 Beta Released

Sat, 05 Apr 2014 05:26:51 GMT

A while ago, I had introduced Node.js Tools for Visual Studio for building a Node.js Web Site on Microsoft Azure. Last day, Node.js Tools for Visual Studio team has released a beta version of Node.js Tools for Visual Studio, which provides an improved tooling experience than the previous version. You can download the latest version of Node.js Tools for Visual Studio from its CodePlex site.

Node.js Tools for Visual Studio provides (NTVS) is a full-fledged IDE for building Node.js apps with the well known productivity and tolling features of Visual Studio. NTVS provides productivity features such as Intellisense and UI for NPM, support for TypeScript, better debugging experience on both locally and remotely, profiling tools, publishing apps and tooling experience for working with Microsoft Azure Web Sites and Cloud Service. NTVS is an excellent choice of IDE for building Node.js apps on the Microsoft Azure platform as we can easily deploy Node.js apps to Azure by leveraging the publishing capabilities of Visual Studio.

Here’s the new project template for Node.js

Here’s the improved UI for NPM

You can follow me on Twitter @shijucv

Microsoft Azure Updates -- April 2014

Fri, 04 Apr 2014 04:21:43 GMT

At the Build 2014 conference, Microsoft announces lot of exciting things which including updates on Microsoft Azure. Now Windows Azure has been rebranded as Microsoft Azure. This is good for Azure platform since Azure is a cross platform, which provides a polyglot Cloud platform for multiple operating systems.

New Azure Portal

At Build 2014, a new azure portal has been announced, which provides mind blowing UI experience.

Basic tier of compute instances

Now Microsoft Azure introduces a new entry-level tier named Basic for computing instances. The new Basic tier of compute instances provides similar CPU and memory configurations as the Standard tier of instances with lesser cost. Unlike Standard tier of instances, the Basic tier doesn’t provide load-balancing and automatic scaling features. The Basic tier provides cost up to 26.67 percentage less than a Standard tier of compute instances.

Microsoft Azure Update Summary

The information below provides the summary of updates announced during Build 2014.

New Azure portal at https://portal.azure.com/.
A new entry-level Basic tier for computing instances.
Azure Active Directory Premium now generally available.
Scheduler now generally available.
Read-Access Geographically Redundant Storage now generally available.
Virtual Network Dynamic Routing Gateway and Point-to-Site now generally available.
AutoScale now generally available.
Azure Automation public preview now available.
Offline support to Windows Azure Mobile Services.
Price reduction for Azure Backup service.

Windows Azure Mobile Services with .NET Backend

Fri, 21 Feb 2014 10:36:57 GMT

In this post, I will take a look at the new .NET support provided in Windows Azure Mobile Services for building mobile backend. Windows Azure Mobile Services was a technology based on Node.js, where we write backend code in JavaScript and we can leverage the Node.js ecosystem including NPM modules. But with the new release of Windows Azure Mobile Services, we can also build Mobile Services backend with .NET, which is a ASP.NET Web API based infrastructure. This is super exciting feature to .Net developers as developers can now work with Visual Studio 2013 for building Mobile Services backend with .NET where they can debug, test and run applications locally with their favourite IDE Visual Studio. For ASP.NET Web API developers, they can work with Mobile Services using their existing skills.

Creating Windows Azure Mobile Services with .NET

Let’s create new Windows Azure Mobile Services with .NET backend. When we create a new Mobile Services, we can specify the backend as JavaScript (Node.js) or .NET. Let’s choose .NET as backend for our new Mobile Services.

The figure below shows that the new mobile services has been created. We can choose our preferred client development platform from the available platforms.

Let’s choose client development platform. Let’s choose Windows Store and select Create a New Windows Store app under getting started:

Let’s choose language as C# and download, which will provide a Visual Studio 2013 solution with boilerplate code for working with table Todoitem for both backend and client app. The Mobile Services project is a ASP.NET Web API project where a NuGet package for Mobile Services added to the ASP.NET Web API project. The below figure shows the solution structure.

The code block below provides the implementation of TodoItemController which provides Web API methods for creating CRUD operations against the table Todoitem

public class TodoItemController : TableController<TodoItem>

protected override void Initialize(HttpControllerContext

 controllerContext)

  base.Initialize(controllerContext);

  zumodotnetContext context = new

zumodotnetContext(Services.Settings.Name.Replace('-', '_'));

    DomainManager = new

EntityDomainManager<TodoItem>(context, Request, Services);

// GET tables/TodoItem

public IQueryable<TodoItem> GetAllTodoItems()

    return Query();

// GET tables/TodoItem/48D68C86-6EA6-4C25-AA33-223FC9A27959

public SingleResult<TodoItem> GetTodoItem(string id)

    return Lookup(id);

// PATCH tables/TodoItem/48D68C86-6EA6-4C25-AA33-223FC9A27959

public Task<TodoItem> PatchTodoItem(string id,

   Delta<TodoItem> patch)

    return UpdateAsync(id, patch);

// POST tables/TodoItem/48D68C86-6EA6-4C25-AA33-223FC9A27959

public async Task<IHttpActionResult> PostTodoItem(

                                     TodoItem item)

    TodoItem current = await InsertAsync(item);

    return CreatedAtRoute("Tables",

    new { id = current.Id }, current);

// DELETE tables/TodoItem/48D68C86-6EA6-4C25-AA33-223FC9A27959

public Task DeleteTodoItem(string id)

    return DeleteAsync(id);

The code block below provides the TodoItem model.

    public class TodoItem : EntityData

        public string Text { get; set; }

        public bool Complete { get; set; }

Let’s add one more column to the TodoItem model for the sake of demo.

public class TodoItem : EntityData

        public string Text { get; set; }

        public string Description { get; set; }

        public bool Complete { get; set; }

The advantage of using .NET backend is that you can easily debug, test and the app locally from Visual Studio. The ASP.NET Web API app also provides a help page that provides help for invoking REST API endpoints.

Deploying Windows Azure Mobile Services

You can deploy the Windows Azure mobile Services in the someway we are deploying a Windows Azure Web Site. Just right click on the Mobile Services project, and click publish, it will publish the mobile services project to Windows Azure. For the first time, we need to download the publish profile from Windows Azure portal and import the publishing profile using the publish wizard in Visual Studio.

You can follow me on Twitter @shijucv

Gulp.js : A Better Alternative to Grunt.js

Wed, 19 Feb 2014 08:29:58 GMT

Recently, we have started a single page application (SPA) demo in github with AngularJS. When we start this project, my plan was to use Grunt.js for task automation. But later, I have observed that there is a new framework named Gulp.js, that provides more cleaner and elegant syntax, which is easy to read and easy to write comparing to Grunt.js. Then I have evaluated the framework and really impressed with Gulp.js. Now I highly recommend Gulp.js over Grunt.js mainly due to its cleaner syntax.

Getting Started with Gulp.js

Like Grunt.js, Gulp.js is also provides as a NPM module so that you can install it through NPM. In order to working Gulp.js, you need to install Gulp globally and locally for your project.

The command below install gulp globally on your machine.

npm install –g gulp

You also need to install gulp locally for your project. If you haven’t a package.json file for your project, just create it.

The command below install gulp locally and will automatically add dependency into the devDependencies of package.json.

npm install --save-dev gulp

Now we have installed Gulp.js. The next step is to add a Gulp file named “gulpfile.js” for automating our tasks for the project. Let’s add a gulpfile.js file. The code block below shows a basic gulpfile.js file where we are just specifying a task named “build” by using the Node.js module gulp.

var gulp = require('gulp');

gulp.task('build', function () {

});

Automating Tasks with Gulp.js

There are lot of useful plugins are available for Gulp.js, which can be used for building most of the commonly used task automations. When I write this post, there are 310 gulp plugins available for automating your tasks. All plugins can install by using npm.

Minifying JavaScript Code

Let’s automate our tasks in the AngularJS SPA reference app webapi-angularjs-spa. Let’s start our automation tasks with minifying our JavaScript code files. For this task, we are using the following gulp plugins:

gulp-uglify
gulp-concat
gulp-size

The above plugins are using for minifying, concatenating minified files and getting size of the minified file respectively.

Let’s install these npm modules.

npm install --save-dev gulp-uglify gulp-concat gulp-size

The code block below shows a task named “app-js-minify” which minifies all JavaScript files written in AngularJS.

var filePath = {

    appjsminify: { src: './app/**/*.js', dest: './app' },

    libsjsminify: { src: ['libs/**/*.js',

 '!*.min.js', '!/**/*.min.js'], dest: 'libs/' },

    jshint: { src: './app/**/*.js' },

    minifycss: { src: ['../Content/themes/**/*.css',

 '!*.min.css', '!/**/*.min.css'],

  dest: '../Content/themes/' }

};

gulp.task('app-js-minify', function () {

    gulp.src(filePath.appjsminify.src)

        .pipe(uglify())

        .pipe(concat('ngscripts.js'))

        .pipe(size())

        .pipe(gulp.dest(filePath.appjsminify.dest));

});

In the above code block, we are specifying the code files to be minified by using the src method of gulp. We use gulp’s method .pipe() to pipe the source files into a gulp plugin. The concat function bundles all minified files to a file named “ngscripts.js” into a destination folder that specified using the function dest. The size returns the size of the minified file “ngscripts.js”. We have specified all files paths in a variable filepath. By default, tasks in Gulp.js, will be executed asynchronously.

Let’s run our first task “app-js-minify” by run the command “gulp app-js-minify” as shown in below figure.

Automating Unit Tests with Mocha

Let’s automate our unit tests with Gulp. We use the gulp plugin “gulp-mocha" for automating unit tests with Mocha.

gulp.task('mocha', function () {

    gulp.src('./test/*.js')

        .pipe(mocha({ reporter: 'list' }));

});

Minifying CSS

We use gulp plugin “gulp-minify-css” for minifying CSS files. In this task we also use a gulp plugin “gulp-rename” for rename the file.

gulp.task('minify-css', function () {

    gulp.src(filePath.minifycss.src)

    .pipe(minifycss())

    .pipe(rename({ suffix: '.min' }))

    .pipe(gulp.dest(filePath.minifycss.dest));

});

The below gulpfile is taken from our AngularJS SPA demo app.

var gulp = require('gulp'),

    gutil = require('gulp-util'),

    uglify = require('gulp-uglify'),

    jshint = require('gulp-jshint'),

    concat = require('gulp-concat'),

    jshintreporter = require('jshint-stylish'),

    minifycss = require('gulp-minify-css'),

    size = require('gulp-size'),

    clean = require('gulp-clean'),

    rename = require('gulp-rename');

var filePath = {

    appjsminify: { src: './app/**/*.js',

 dest: './app' },

    libsjsminify: { src: ['libs/**/*.js', '!*.min.js',

 '!/**/*.min.js'], dest: 'libs/' },

    jshint: { src: './app/**/*.js' },

    minifycss: { src: ['../Content/themes

    /**/*.css',

 '!*.min.css', '!/**/*.min.css'],

dest: '../Content/themes/' }

};

gulp.task('app-js-minify', function () {

    gulp.src(filePath.appjsminify.src)

        .pipe(uglify())

        .pipe(concat('ngscripts.js'))

        .pipe(size())

        .pipe(gulp.dest(filePath.appjsminify.dest));

});

gulp.task('libs-js-minify', function () {

    /*Excludes already minified files.*/

    gulp.src(filePath.libsjsminify.src)

    .pipe(uglify())

    .pipe(rename({ suffix: '.min' }))

    .pipe(gulp.dest(filePath.libsjsminify.dest));

});

gulp.task('jshint', function () {

    gulp.src(filePath.jshint.src)

      .pipe(jshint())

      .pipe(jshint.reporter(jshintreporter));

});

gulp.task('minify-css', function () {

    /*Excludes already minified files.*/

    gulp.src(filePath.minifycss.src)

    .pipe(minifycss())

    .pipe(rename({ suffix: '.min' }))

    .pipe(gulp.dest(filePath.minifycss.dest));

});

gulp.task('clean', function () {

    gulp.src(

            'app/ngscripts.js',

            'libs/angular-ui/select2.min.js',

            'libs/select2/select2.min.js',

            'libs/semantic/semantic.min.js',

            'libs/jquery-1.9.1.min.js',

            '../Content/themes/semantic/

              semantic.min.css',

            '../Content/themes/Site.min.css',

            '../Content/themes/select2/

            select2.min.css'

        ], { read: false })

    .pipe(clean({force:true}));

});

gulp.task('build', ['app-js-minify', 'libs-js-minify', 'minify-css']);

gulp.task('cleanbuild', ['clean']);

You can run the gulp task by specifying the task name. In the above gulpfile, we are specifying two tasks at the end of the section named “build” and “cleanbuild” where we are specifying logically related group of tasks. You can pass these tasks as an array of defined tasks.

gulp.task('build', ['app-js-minify', 'libs-js-minify',

 'minify-css']);

gulp.task('cleanbuild', ['clean']);

When we run “gulp build” it will run tasks “app-js-minify”, “libs-js-minify” and “minify-css”. When we run “gulp cleanbuild” it will run the task “clean”. If you are simply running gulp without specifying any task, it will look for the task with name “default”.

The code block below provides the package.json file of the project

  "name": "webapi-angularjs-spa",

  "description": "SPA Demo app with AngularJS",

  "author": "Shiju Varghese",

  "version": "0.5.0",

  "repository":

      "https://github.com/MarlabsInc/webapi-angularjs-spa",

  "dependencies": {},

  "devDependencies": {

    "gulp-util": "~2.2.14",

    "gulp": "~3.5.2",

    "gulp-concat": "~2.1.7",

    "gulp-uglify": "~0.2.1",

    "jshint": "~2.4.3",

    "gulp-jshint": "~1.4.2",

    "jshint-stylish": "~0.1.5",

    "gulp-minify-css": "~0.3.0",

    "gulp-rename": "~1.1.0",

    "gulp-size": "~0.1.3",

    "gulp-clean": "~0.2.4"

Source Code

We have implemented the task automation in our AngularJS demo app which is available on github at https://github.com/MarlabsInc/webapi-angularjs-spa. The JavaScript client app is available from the location here. The gulpfile is available from here.

You can follow me on Twitter @shijucv

Slides For My Session On Windows Azure Mobile Services

Sun, 16 Feb 2014 12:56:54 GMT

I did a presentation titled “A Deep Dive Into Windows Azure Mobile Services” at the Kochi DevCon 2014. In this session, I demonstrated how we can write server-side scripts in Windows Azure Mobile Services, by using JavaScript and Node.js. You can download the session slides from here.