Friday, August 31, 2012

Looking at Windows Azure Mobile Services with Fiddler


As usual throughout the day I have MetroTwit open and toast are constantly popping up here and there and I glance over to see what’s what.  Then I see. from @WindowsAzure this:

And all work stopped for me to check this out.  Other than Windows Phone and Windows 8; I really love the new ASP.NET WebAPI and REST Services capabilities it has made so easy (watch for my next post on that), and seeing this I was thinking – awesome but only for Windows 8???  So…I immediately responded and got a response:
Spending the last day or so checking into the walk through for Windows 8, check them out here. I went through the initial walkthrough for a Windows 8 application, and during this I wanted to see the data that was going back and fourth so I opened my favorite tool Fiddler to see the HTTP calls, which then lead me to see that I could easily use these services for Windows Phone 7 now!
Here is a quick walk through a how to get setup.

Getting Started

In order to start using the preview of the Mobile Services in Azure, you need to have a Windows Azure account or you can sign up for a trial account. After you login, go to your Account Center and select the Preview Features from the top menu.
I have already signed up for the Mobile Services, so you will see a “try it now” button and go ahead click that to get started. Once you get transferred to the, unfortunately still called the “Preview” portal, you’ll notice on the left menu that there is a new Mobile Services section.
Next on the bottom portion of the management portal you will see the +, which you simply click to add the new Mobile Service.
Choose create and the New Mobile Service dialog is presented; enter the name of your new mobile service, select or create a new SQL Server Database, and finally select the Region for your instance.  There are some other options in the “Configure advanced database settings” but we’ll not do that now for simplicity sake.
*** As a note, if you create a new database; remember the credentials.  You will need this information if you choose to add another database to the server later.
Upon completion of the wizard, the management portal will tell you its creating…, the poof its there. I named mine “testmobileservice”.
if you click on the URL, you’ll be presented with the following page…
These are just services, or a service endpoint. The closest thing I can really relate this to is in SQL 2005 we were given the ability to expose certain objects as web service endpoints, it was a neat feature but not widely used and still available to my knowledge. Sorry I digress, let’s get back to the management portal and create a Todo table.
If you click on the Mobile Service name you see the following screen, and although the initial announcement was for Windows 8 support and the walkthroughs etc. show that, let’s just create a table and I can get to Fiddler and show you how the data looks to and from the REST Service.
Click over the the DATA tab, then the + on the bottom the add the table. Name the table ToDoItem and click the check to create the new table.
Pretty simple right?  Just created a new table in a database by simply naming a table…DBA’s are freaking out around the world right now.
Ok, so go back to the DASHBOARD and find the MANAGE KEYS icon at the bottom, and we are going to add/create a new Application Key for the Mobile Service. 
Now there are still some things under the covers here that I am still finding the answers too, but my first guess is this is some iteration/flavor of oAuth. But, go ahead and copy down the Application Key that is generated for you.  At this point, there is only one key and if you regenerate post deployment then your app will break so be careful with that little regenerate button of power.
Click the check mark and you are ready to start.

Interacting with the Endpoint via REST

Using Fiddler to see your HTTP calls going to and from RESTful endpoint is great, BUT there is also a little tab in there that most developers don’t realize is there.  It’s the Composer tab.  You can either originate a call in there OR drag a previous call from the left side to the composer tab and make changes to it and hit the execute button.  Great feature!

What are my EndPoints?

Interesting how this works…
The endpoints are formatted as https://[your new service address]/tables/[table name]. So in my case, the RESTful endpoint for the TodoItem table is: I have inserted a single record already so we can construct a GET call in Fiddler to see what is returned.
Do this by again, going to the composer tab and inserting the url for the endpoint in the location box and in the Request Headers you will need to add the following:
User-Agent: Fiddler
Accept: application/json
The X-ZUMO-APPLICATION header key/value pair is the secret sauce, I am sure that when the official SDK for these services is released for Windows Phone; there will be some better way to put this all together or maybe not, cause let’s be honest REST is EASY!
So Click the Execute button and we get a nice JSON result returned
But wait, can we get XML too? No, it does not appear so.  Trying to change the Accept header to “Accept:application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8” to get xml does not work. Also it is important note that if the Accept header is not sent, JSON is also returned. 
It is my assumption that, as you can do in ASP.NET Web API, the services are doing something like
in order to force JSON, this is a smaller payload and is the more preferred format for REST based services.

Inserting / Updating Data

Again remember that these are simply REST based services, so you can just do the same as above and instead of calling with a GET, do it with a PUT (405 Method Not Allowed) or POST and pass a payload of type ToDoItem.  Here is an example of an insert.
Change the dropdown in the composer tab of Fiddler from a GET to a POST (INSERT) and in the Request Body add the following text:
{  "ToDoText":"Text1" , "ToDoId":2}
Click the execute button and on the left window you should get a Result of 201 and the response sends back the newly created item in JSON.

Methods Allowed – GET, POST, DELETE

Dynamic Tables

So what’s really behind this?  Is it SQL Server, a flavor of NoSQL running inside SQL? Is this table storage with some magic?  Let’s call a POST method and add some new fields and see what happens here.
Here is the new JSON payload:

    "ToDoText":"Text1" ,

    "ToDoWhen": "12/01/2012",
    "ToDoByWho" : "Shayne Boyer"
The highlighted rows here we already had in our table before, but I am passing in some new data fields. And it works, very cool…
What does a get return now that we have the new fields in one but not in the other?
I like it! Data Model changes, NoSQL style in Runtime.  You see that we now get the fields in the previous records available to us for an update later and they are automatically set to NULL.  Now one thing to note that there is no ability to remove a field. You would most like have to delete the table from Azure and start clean. 
So there it is, if you can hit REST with any of you coding skills you can use this.  Doesn’t necessarily have to be Windows 8.  It can be Windows Phone, iOS, Android or Raspberry Pi for that matter.  It can even be a web page.  Look forward to what more is to come from this and Azure in the future!
Let me know if you have any questions, please comment. 
Read more →

Sunday, August 26, 2012

Getting Started w/ Windows 8, MVVM Light and EventToCommand

Now that Windows 8 and Visual Studio are in RTM I wanted to put together a quick entry for those Windows Phone developers making the transition to Windows 8 development with their MVVM Light skills.

Laurent Bugnion, is the creator of the MVVM Light toolkit and I, as well as many others, have been using this for Windows Phone development for a while now.  I am porting on of my applications to Windows 8 and wanted to take the knowledge of this toolkit to the new platform hoping that there were either some new enhancements and/or not many changes so that I could just go.  Well that was the deal.

MVVM Light Toolkit for Windows 8 RTM

The latest installer for the toolkit, "MVVM Light Toolkit V4 RTM", is available from CodePlex. According to Laurent's blog it is a side by side install with previous versions:

MVVM Light for Windows 8 is a side-by-side install with the standard MVVM Light V3 or V4 beta. Simply download and run the MSI from Codeplex. As usual, the last step of the installation performs a “/setup” of Visual Studio to actualize the project template cache, and unfortunately this last step can last very long. Please be patient and don’t cancel before the end! The installation process is very similar to that described on the MVVM Light installation page (except that there is no NuGet installer for VS11 yet).
The following link states the summary of the ported components from the previous versions, but I'll paraphrase here:

  • ObservableObject including all ways to raise PropertyChanged. 
  • ViewModelBase including all ways to raise PropertyChanged. 
  • Messenger including all message types except DialogMessage (see below). 
  • RelayCommand with and without parameter. 
  • SimpleIoc which might well be the very first IOC container working on Windows 8. 
Man do I love the SimpleIoc! Makes adding the new views soooo much easier than in the Windows Phone version.

There are a few missing components, one of which is EventToCommand, however thanks to a new friend I have made, Joost van Schaik (see his blog here),  there is a solution to that and it's available as a nuget package with some additional behavior features I encourage you to look into but I'll at least cover the EventToCommand features he offers.

Getting Started

MVVM Light Project Template

After installing the toolkit you will see that there is a new project template available in the Visual Studio 2012 New Project Dialog

Noted as "Windows Metro Style"

Name the project "MvvmLight_Walkthrough" and click Ok.

The project template is simple, but add some new features that were not in previous versions of the toolkit. In the Solution Explorer you'll notice a Design folder with a class called DesignDataService. This is a great feature; the default template putting in a design data class repository.

Second, as in the past version of the toolkit there is the normal ViewModelLocator class, but in this version there is new feature - SimpleIoc, a container class which if you are like me had everything else in a container for DI with the exception of the ViewModels unless you rolled your own.

public class ViewModelLocator


        static ViewModelLocator()


            ServiceLocator.SetLocatorProvider(() => SimpleIoc.Default);

            if (ViewModelBase.IsInDesignModeStatic)


                SimpleIoc.Default.Register<IDataService, Design.DesignDataService>();




                SimpleIoc.Default.Register<IDataService, DataService>();




        /// <summary>

        /// Gets the Main property.

        /// </summary>



            Justification = "This non-static member is needed for data binding purposes.")]

        public MainViewModel Main




                return ServiceLocator.Current.GetInstance<MainViewModel>();



        /// <summary>

        /// Cleans up all the resources.

        /// </summary>

        public static void Cleanup()



And last, in the Model folder, Laurent has been kind enough to also include an IDataService interface and DataService class to show in the example how to use the real time and design time data models. These are all wired up in the ViewModelLocator as show above.

Now if we simply run the application you should get the following to make sure it's all good to go!

Running in the Simulator

As you may or may not notice, this is not to dis-similar from the previous project template test from the previous version.


The binding of the ViewModel to the View is the same as it was in the previous model and there are no noticeable changes to the ViewModelTemplate.  On thing to note is that all options for RaisePropertyChanged are included in this release where as in the previous version you would have to get the "Pre-release" version from nuget in order to use them. For example, the built in template puts in the following:

/// <summary>

        /// The <see cref="WelcomeTitle" /> property's name.

        /// </summary>

        public const string WelcomeTitlePropertyName = "WelcomeTitle";

        private string _welcomeTitle = string.Empty;

        /// <summary>

        /// Gets the WelcomeTitle property.

        /// Changes to that property's value raise the PropertyChanged event.

        /// </summary>

        public string WelcomeTitle




                return _welcomeTitle;




                if (_welcomeTitle == value)




                _welcomeTitle = value;




Noticeably where RaisePropertyChanged is using a string value, one of the options now available in the release is to remove the  WelcomeTitlePropertyName variable and then change



RaisePropertyChanged(() => WelcomeTitle);

The other nice benefit here is that the template has also put in the wiring for injecting the IDataService into the constructor for the ViewModel.  Some of these little thing we developers either take for granted that someone has gone through the trouble of putting the plumbing in there or call it the boring work that has to be done before we get the real work done.  You can easily put other dependencies in the constructor here and then just add the mappings in the constructor of the ViewModelLocator by simply registering the types with the SimpleIoc container.

public MainViewModel(IDataService dataService)


            _dataService = dataService;


                (item, error) =>


                    if (error != null)


                        // Report error here



                    WelcomeTitle = item.Title;



Now What?.

A simple example here is to add some content to the MainPage and see how we navigate to a second view.  I won't bore you with the details of adding in the controls to the page but here's what the page should look like when you're done. 

Added a little MvvmLight color for fun


Now lets just add a prompt to the submit button. But wait, what where's my EventToCommand???  Sure with the button there is a Command property and you can set that to an ICommand in the ViewModel and everything is happy.  But, there are plenty of controls, both baked into WinRT and third party controls that do not have that property. So, for simplicity sake I'm using this control and will get the EventToCommand back in your toolbox, or your Joostbox I should say.

Off to Nuget!

I had this issue where I was looking for the behaviors when porting an app I was working on and could find the dang behaviors in Blend so I went to nuget and did some searching and there wasn't anything that was shaking my fancy. Then I came across Joost van Schaik (see his blog here) and his WinRTBehaviors library and just so happens I hit him in the middle of uploading the nuget package for Win8nl.

Now this is a package of Behaviors that was originally a Windows Phone 7 library and It's now growing in its own direction and now contains some Windows 8 specific stuff (according to nuget). So let's get it installed real quick.

Install the package by typing the following into the Nuget Package Manager Console or searching for Win8nl in the package explorer.

PM> Install-Package Win8nl

It will add the library and the necessary dependencies to the project, which include WinRTBehaviors. For more information on the other behaviors there check out Joost's blog.

Adding EventToCommand 

First, lets add the references to the XAML page:



Next, locate the button control and add the following inside the button XAML:

            <Button x:Name="btnSubmit" Content="Submit"    

                    FontFamily="{StaticResource MyFont}" FontSize="{StaticResource MyFontSize}"

                    HorizontalAlignment="Center" Margin="0,20,0,0">


                    <Win8nl_Behavior:EventToCommandBehavior Event="Tapped"       


                                                  CommandParameter="{Binding MyName}"/>



Now, open the MainViewModel.cs code and we can add the command for the new behavior here when the button is tapped.

As usual the Command property is expecting an ICommand, add the following code to the MainViewModel and return a new instance of RelayCommand to execute whatever behavior you wish.  In this example, I'm just doing a little popup to show whatever the user input into the myName TextBox.

public ICommand AreYouSureCommand




                return new RelayCommand<string>((p) =>


                    var msg = new MessageDialog(string.Format("Hi there {0}", p));






See the result here:

And that is EventToCommand for MVVMlight for Windows 8!

There are many more behaviors in the WinRTBehaviors library that you should take advantage of, for me the most notable ones being FlipViewPanoramaBehavior and NavigationService being ported to Windows 8.

Read more →

Thursday, August 23, 2012

I'm a nerd, but I might scare your kids

Revenge of the Nerds
Remember these guys? This is what the stereotypical view was/is of what a "nerd" looks like. Developers today are a much different class of people for sure.  I have met some pretty cool people over the past year that certainly do not fit the bill. Fishing enthusiast, cigar afficianados, gear heads and others who love to grab a guitar and rock out.

Of course, I do run into what I think nowadays some would say, web developers, fit into the category of "gamers". The plain has certainly changed from what your parents might consider a nerd.

A lot of developers have the same story; grew up messing around with a Commodore 64 or something of the sort, tinkered with this or that technology, studied Computer Science in college and then moved into the professional world. And if you read my About Me page, my story is not that different.

It's interesting to talk to the other developers in the community and see what they do in their "off" time. Me, enjoy anytime with my wife and a glass of wine, hop on the Harley go for a ride, spend time with the kiddies at the pool, build some legos, visit the guys at the tattoo shop and get some ink, and most recently took a bunch of teenagers to the Flo-rida concert at the Microsoft Store grand opening in Orlando. Not what some would expect from a guy who spends a good portion of his life buried in code.

I'm not what you think of when it comes to a developer.  At my first meeting for the Orlando Windows Phone User Group I was taking a picture with the guys who authored "Sam's Teach Yourself Windows Phone Application Development in 24 hours" and Joe Healy said "...make sure the tats show!"

When people see me, they probably would never guess what I do for a living. That I love gadgets, read technical blogs, spend hours learning new technology, or stay up at night wondering what's the next Windows Phone or Windows 8 app I'm gonna try.

The best part for kids think what I do is cool! My wife supports me in everything I do and I couldn't ask for more.  I have a good thing, I love what I do and they love me.

So yes I'm a Nerd...but I might scare your kids.

What do you do in your off time?  I'm curious...

Read more →

Thursday, August 16, 2012

Upgrading from Windows 7 to Windows 8 RTM - Bootcamp


So I spent last night leaping into the upgrade process on my MacBook Pro from Windows 7 to Windows 8 Pro.  Now, some may call it leaping off, ridicule me for being a .NET guy and having a Mac, but that's a whole other conversation.  I wanted to just point out a few tidbits about the experience.

Things to have on hand

  • BootCamp CD
    • find it, burn it whatever
  • USB Mouse
    • if you are using a wireless, Bluetooth mouse your drivers will or may get jacked up when you make the upgrade cause mine did.
  • Time!
    • Overall upgrade , depending on what you have installed etc., could take a couple hours.

Upgrading in place

This was a pretty standard process.  I downloaded the RTM from MSDN and burned it to DVD, made sure I wrote down the key and slipped in the DVD and hit the go button.

Standard wizard upgrade, nothing to dis-similar from the upgrade process from Vista to Windows 7. Screens are quite nice.

They great thing here was, I only had one or two reboots. BUT! that's when the fun starts.

Boot Camp Stuff

Once you go through the who are you, what wireless / network screens and you get through the logon screen.  Please DO NOT reboot!

I did that and lost my keyboard, ugh the pain!  If that happens here is the work around.

In the lower left hand part of the screen there is the usability icon, click on this and enable the "On Screen Keyboard".  Please be patient as again, depending on your configuration the responsiveness may be latent. Once that appears, either use that or in my case the keyboard was enabled at least for me to login.

Next steps.

  1. Uninstall Boot Camp from Windows.
    • Do not repair. This can install additional copies of the Apple drivers and further send you into frustration. And in the end you will uninstall anyway.
  2. Insert your Boot Camp CD and run the installer.
Make sure that you select the default boot OS, if that's your thing.  Also check the Apple Updates if you are using an original Boot Camp CD.  I might suggest creating a new one from the iOS side of the PC since it will download the most recent version.

And that's it.  I would mention that these are my suggestions based on my experience and I am fully operational on a MacBook Pro 13" 8GB Ram running Windows 8 Pro and loving it.

Biggest issue for me was getting the trackpad to work, which lead me to uninstall Boot Camp and reinstall.  This was a result of having the multiple copies of the drivers as I mentioned above.

Read more →

Monday, August 13, 2012

Develop Your First Windows Phone App - Get a Free Nokia Phone

This past Friday I attended a Windows Phone Developer event put on by Rich Dunbar, who is a Nokia Developer Ambassador, here in Orlando.

I have exchanged some tweets and emails with Rich in the past and watched some feedback from some of the previous events he had put on in the past; and I'll tell you the reviews had been good.

Rich is running a great program.  Develop your first application for Windows Phone and get a free App Hub token ($99 value) and once your application is available in the marketplace, he'll send you a Windows Phone 7 device.  Not too bad right?  Well, I'll tell you it's a legit deal.

The event was a starter for sure, but he has some good advice on marketing your application. For instance, the Nokia Developer site has a deep link there for generating a cool little banner ad like this one I did for Baseball Pro 12.

So here is the program.

1. Go to - See the steps and rules.
2. Follow @RichDunbar and @spboyer (that's me)
3. Get the tools - see Rich's blog
4. Develop! Ask Questions!
5. Follow #wpdev on twitter
6. Reap the benefits

Rich is a great guy, he'll respond to you faster on Twitter than in email, so do that.  Feel free to ask me questions as well.

Read more →

Thursday, August 2, 2012

DarkSky Developer Contest - Dates & Prize Pool

So here we are, the good stuff. When do we have to be done and what the heck do we get if we win?


Start NOW, if you have not signed up please do so here. This is important, I need your valid email address so that I can get you the API developer key for Dark Sky.

Next, apps must be submitted in completion no later than 10/1/2012.  This give us time to review them, get them loaded on or devices etc.  If you publish them to the Marketplace please send me the links so that we can get them downloaded.  If they are paid applications, please send us the .xap or provide a download link so we may side load the applications.

So, prizes.  One grand prize for the best Windows 7 Phone and best Windows 8 Metro application. Each winning team or person will receive the following:

Dark Sky Umbrella
Click for larger image

  • DarkSky  Custom-printed senz˚ umbrellas — capable of withstanding 80 km/h winds
  • $49.99 XBOX Live Point Card
Also each completed application submitted will also receive a free copy of NetAdvantage for Windows Phone from Infragistics.

Other submissions will be awarded various prizes so get to coding!  We are excited to see what's in store.

Any questions please contact @spboyer 
Read more →

Getting started with Windows Phone and MVVM Light - Part 2 of 2


In Part 1, we covered the following:
  • Creating the application
  • Connecting the View and the View-Model
  • Adding an additional View or Page
Part 2 we'll see how to add a button on the first page to navigate to the second page which will cover navigation and messaging to complete the application and although basic, will give a rather decent start to create and publish your first Rubber Ducky application.

If you need the code, you can get it here.

Let’s start by opening MainPage.xaml.  You should see the following image here:

Add a button by dragging it on to the design surface or adding the following code, it doesn’t matter where, just somewhere within the content grid.

<TextBlock Text="{Binding Welcome}"
			           Style="{StaticResource PhoneTextNormalStyle}"
			           FontSize="40" />
            <Button Content="Button" 
					Height="72" HorizontalAlignment="Left" 
					Margin="154,354,0,0" Name="button1" 
					VerticalAlignment="Top" Width="160" />

Next, lets add the messaging capabilities which will work hand in hand with the navigation from one page to the next. Start by adding a new folder to the solution called “Messages”.

Then add a new class called NavigateToPageMessage.cs which contains the following code.

public class NavigateToPageMessage
	public NavigateToPageMessage()


	public string PageName { get; set; }

Now we have to register the main page of the application to receive the NavigateToPageMessage and do something once it receives it. Open MainPage.xaml and add a new event handler for the Loaded Event. Do this by selecting the PhoneApplicationPage in the Document Outline Window, go to the Properties Windows and select the Events Tab and double click the Loaded event to insert the code.


 Open the MainPage.xaml.cs code and find the newly inserted event handler which should look like the following:

private void PhoneApplicationPage_Loaded(object sender, System.Windows.RoutedEventArgs e)

In order to support messaging from MVVM Light, add the messaging namespace (MvvmLight1.Messages;) to the top of the page. Next, we will add the code to subscribe to the NavigateToPageMessage.

private void PhoneApplicationPage_Loaded(object sender, System.Windows.RoutedEventArgs e)
					(action) => ReceiveMessage(action)

ReceiveMessage is the delegate that will handle the message object, in this case the NavigateToPageMessage type.

private object ReceiveMessage(NavigateToPageMessage action)
	var page = string.Format("/Views/{0}View.xaml", action.PageName);

	if (action.PageName == "Main")
		page = "/MainPage.xaml";

	   new System.Uri(page,
	return null;

What we have done here is handled the property PageName of the action and to the application to navigate to the appropriate page. Pretty simple right?  You’ll notice that I put in a special handler here if the PageName is Main to follow the default structure in the MVVM Light template.  As a note, I typically move the MainPage into the Views folder and make the adjustments to all of the wiring so that all of my views are in the place where I like them.  Next step is to hook up that button we added earlier to send the NavigateToPageMessage when its clicked. If you have Blend, this portion is drag and drop, otherwise you’ll have to some cut and paste. Open the project in Blend, then open MainPage.xaml in the designer. Select the Assets Tab and click on the Behaviors in the left panel.  You will see a selection called EventToCommand; click and drag this item to either the Button on the design surface OR the button in the Object and Timeline and release.


 Then in the properties tab give the new EventToCommand the name “GoToPage2”, the EventName should already set to Click, if it is not change it.


 Save your changes, and if you view the xaml now you should see the following code

<Button Content="Button" Height="72" HorizontalAlignment="Left" Margin="154,354,0,0" x:Name="button1" VerticalAlignment="Top" Width="160" >
		<i:EventTrigger EventName="Click">
			<GalaSoft_MvvmLight_Command:EventToCommand x:Name="GoToPage2" Command="{Binding GoToSecondPageCommand, Mode=OneWay}"/>

Next step, back to Visual Studio to add the last bit of code to the MainViewModel.  Add a new RelayCommand which is in the MvvmLight.Command namespace.

public RelayCommand GoToSecondPageCommand
	private set;

Then in the constructor in the “else” portion you need to instantiate the RelayCommand and add the handler to send the message. Add the following code

GoToSecondPageCommand = new RelayCommand(() =>
                    MessageBox.Show("Going to Second Page now");
                    Messenger.Default.Send<NavigateToPageMessage>(new NavigateToPageMessage() { PageName = "SecondPage" });

One last step here is to tell the EventToCommand that we added in Blend that this is the command to execute when the Click event is fired.  we do this by setting the Command property in the xaml to the following:

<Button Content="Button" Height="72" HorizontalAlignment="Left" Margin="154,354,0,0" x:Name="button1" VerticalAlignment="Top" Width="160" >
		<i:EventTrigger EventName="Click">
			<GalaSoft_MvvmLight_Command:EventToCommand x:Name="GoToPage2" Command="{Binding GoToSecondPageCommand, Mode=OneWay}"/>

Save all and run


 Click Ok and next page is presented.

 Now go build some apps!

Download Code for Part 2 here
Read more →
Powered by Blogger.
Creative Commons License by Shayne Boyer is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.