Tracking Email Using Microsoft Azure and the SendGrid Event Webhook (Part 2)

Tracking Email Using Microsoft Azure and the SendGrid Event Webhook (Part 2)

Welcome back to the second part of my series about building a Windows Phone 8.1 app to track email powered by Microsoft Azure and SendGrid's Event Webhook.

If you haven't read part one in this series, please do so before continuing.

Recap

In part one, we implemented the SendGrid Event Webhook listener using C# ASP.NET hosted on Microsoft Azure.

In this post (part two), we will create a Windows Phone 8.1 app that displays email tracking data via the SendGrid Web API.

In part three of this series, we will send push notifications from our SendGrid Event Webhook listener when certain events, such as a bounce, occur and display the details within the app.

Prerequisites/Assumptions

The code for this post (source) was developed within VMWare Fusion 6 on Mac OS X Mavericks, running Windows 8.1 in Visual Studio Express 2013 for Windows. This code was also tested on a Microsoft Surface Pro running Windows 8.1.

BIG thanks to Alex Reed, our SendGrid Ambassador serving the UK, for creating the first version of this code.

The code is based on the Hub App (Windows Phone) template. I suggest you watch parts 15 to 17 of Bob Tubor’s “Windows Phone 8.1 Development for Absolute Beginners” video series for an understanding of how the application template works. Start at part 1 if you are completely new to the Windows Phone 8 development platform.

I also assume, that minimally, you have a free SendGrid account. If not, go ahead and sign up via Microsoft Azure or here.

Getting Started

Clone the repo and follow the set-up instructions in the README, then run the app in Visual Studio. You should see a screen similar to the leading intro image.

Understanding the Code

Accessing SendGrid: SendGridApi.cs

This class communicates with the SendGrid Web API. Specifically, we are accessing the stats endpoint through the GetStats function.

Defining the Data Model: EmailStats.cs

This class defines the data we will receive from the stats endpoint. Note that we have accounted for all of the data points from the stats endpoint in this model, but we do not display them all in the app’s interface.

Creating the Display: SendGridStats.WindowsPhone/Pages

This folder contains the templates (.xaml) and code (.cs) that displays our data. The main page of the app, is defined in HUbPage.xaml and HubPage.xaml.cs.

If you would like a solid foundational understanding of XAML, see the Microsoft Dev Center.

Next: Part 3

Remember to check back for the final part in this series where we use Microsoft Azure’s Notification Hub to send real time email data to our Windows Phone app.

Happy Hacking!