Coding Insomnia

Yesterday, I made two NuGet packages for Entile available in the NuGet gallery. Today, I thought I’d walk you through how to get started! I will show you how to create a completely functional app with a Live Tile as well as Toast notifications.

Prerequisites

You’ll need the following installed on your developer machine:

• Visual Studio 2010 with Windows Phone Developer Tools
• NuGet package manager (installed with ASP.NET MVC3 – can also be installed separately)

Create the Windows Phone 7 App

First of all, let’s create a simple Windows Phone 7 App. I’m using the Pivot template from the Silverlight Toolkit, but any template will do.

Create the Web Application

While we are at it, we’ll create the Server part of the application too. In this case, I’m going for an empty ASP.NET MVC 3 application, but again, more or less any Web Application or WCF Service Application will do.

Add the NuGet packages

Open up the Library Package console (Tools->Library Package Manager->Package Manager Console). Type the following into the console (replace EntileDemo.App with the name of your Windows Phone 7 Project and EntileDemo.Host with the name of your Web Application project):

Install-Package entile-client -Project EntileDemo.App

Install-Package entile-server -Project EntileDemo.Host

This will download and install the client and the server part of Entile into your solution. You should now be able to build everything, but it won’t run properly just yet.

Configuring the client

Now it is time to make sure that the client knows how to talk to the server. By default, all client-side settings are found in the EntileSettings.xaml file. Open it up and change the RegistrationServiceUri and the AllowedTileUris entries to point to the name of your host. Working locally on your dev machine it will look something like this (where 1234 should be replaced by the port number of your Web Application):

<sys:String x:Key="RegistrationServiceUri">http://localhost:1234/Sample/Registration</sys:String>

<sys:String x:Key="AllowedTileUris">http://localhost:1234</sys:String>

You should also set the ChannelName to something that makes sense, perhaps “DemoChannel”?

Then we just need to hook up the settings to make the application aware of them. You do this by adding the following lines to the Application.Resources element in your App.xaml file:

<ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="EntileSettings.xaml"/>
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

Configuring the server

Now we need to configure the Sample module found in the server. First of all, in the root of your Web Application you should now have a file called EntileStartup.cs. This is where all modules are registered, all we need to do here is to change the host name:

One more thing, let’s also make sure that we can send a nice Live Tile by, again, changing the host name – this time it’s in the EntileModules\SampleService.cs file:

Add the view

Finally (yes, this is indeed the last setup step) we are going to add the EntileView to your App. First, make sure that you have built the project. Next, open up the MainPage.xaml file and find a nice place for the EntileView user control. I chose to put it on a PivotItem called “settings”. The easiest way to get it there is to find it in the toolbox and drag it onto the xaml:

Let’s run it, shall we?

Both projects need to run at the same time, so if you haven’t done so already, open up the properties window for your solution and set it up so that they are both set to Start:

Now, hit F5 and wait for both the emulator to start up with your phone app, and the web project to show a default page (a 404 in my case since I’m used an empty MVC project). Switch to the screen where you put the EntileView, and hit the checkbox. This will open up a channel and register the application with your server.

So, we got this running, let’s show off the capabilities!

Hit the back button and pin the application to your home screen. Open up your browser and enter the following URL (as usual, substitute the host/port with your own):

http://localhost:1234/Sample/SendSampleTileToAllClients

And then to finish it all off, send a toast as well:

http://localhost:1234/Sample/SendSampleToastToAllClients

The result, hopefully, looks something like this:

Conclusion

I’ve shown how to use the Entile Notification Framework for Windows Phone 7 in order to get a Live Tile and Toast-enabled Windows Phone 7 Application in just a few minutes. Rest assured however that there is more to Entile than this. A few things you haven’t seen yet but that I hopefully will be blogging about soon enough:

• Data stores
• Adding extra information to your registrations
• The notification queue and using a worker.
• Running in the cloud (Azure and/or AppHarbor?)
• … and perhaps something else you’d like to know about?

As always, please please do leave a comment, ping me (@CodingInsomnia) or @entile_fx on Twitter or why not do a blog post of your own experiences with Entile? I would really like to hear from you!