TypedMVVM: Samples updated for Apache Cordova

I’ve recently installed the Multi-Device Hybrid Apps template on Visual Studio in order to try out the development of native mobile applications (targeting Android, iOS, Windows Store and Windows Phone) using HTML, CSS and JavaScript using the Apache Cordova framework.

As a first example, I decided to reuse all the TypeScript code available in my library TypedMVVM available on CodePlex.

The process was very simple and didn’t take long: I was able to quickly create a basic “Hello World” application successfully deployed on the Ripple – Nexus 7 Android emulator


As usual, the updated code is available for download on Codeplex.

WinJS and TypeScript: binding a ListView itemDataSource to a ViewModel property

I’ve recently been asked on the TypedMVVM forums how to properly bind a ListView data source to a list of items available as a property in the ViewModel.

Just create new getters and setters in the ViewModel and initialise the property by creating a new instance of WinJS.Binding.List:

Then reference from HTML the new itemsSource property in the ListView control using data-win-bind:

As usual, the sample code is available for download on Codeplex.

TypedMVVM: Adding a new IoC.Container class for generating instances using generics

In the previous days I was extending my TypedMVVM library with additional classes for separating the logic and being able to use different services for handling operations like showing message dialogs.

I’ve then started the implementation of a simple IoC.Container class that will manage in a centralized way the creation of new objects (ViewModels, Services, etc.) used by the application.

The first step was the creation of a simple Resolve<T> method for creating instances using the concept of Generics available in TypeScript.

When working with factories and generics, it’s necessary to refer to class types using their constructor function:

In this way, a new instance of type T will be returned each time the function IoC.Container.resolve will be used.

For example, it’s now possible to inject a service on a ViewModel in this way:

I’m planning for the future more functionalities for this IoC.Container class, like the possibility to register specific services with interfaces and use them as singletons.

The updated code is available for download from the repository here.

WinJS – Adding a reference to an existing Universal shared project from your Windows Store / Windows Phone app

In the past days I was trying to reference an existing “Universal Shared” project from a Windows Store app, but it seems like that the “Add Reference” functionality is still not available on Visual Studio for shared projects when using WinJS or generic JavaScript Universal apps.

I’ve then verified the default Universal apps template and found that every project is referencing the “Shared” one using this Import block in the .jsproj file:

To enable it for your project, just open the “Solution Explorer” in Visual Studio and:

  • right-click the project and select “Unload Project“;
  • select “Edit <Your-Project-Name>.jsproj“;
  • add the “Import Project” block using the code editor and save it;
  • right-click and select “Reload Project“.

The shared project code should now be correctly referenced and available in your original app.

Same technique can obviously be used by Windows Phone 8.1 solutions (or other targets / platforms).

Universal Windows Apps, WinJS and TypedMVVM: samples updated to target Windows Phone and Windows Store apps

I’ve just returned from the Build 2014 conference in San Francisco where I had the opportunity to attend several interesting sessions about new developments in the Microsoft space.

One of the “big news” has been the introduction of the concept of “Universal Windows Apps“, a great way to share code between different platforms including (but not limited to) Windows Phone, Windows Store and Xbox One apps.

I decided to test this new feature on TypedMVVM, one of my “pet projects” which I made available on CodePlex some time ago. The project was originally using a simple MVVM infrastructure targeting Windows Store apps using WinJS and TypeScript so it was an ideal candidate for adding a Windows Phone 8.1 target reusing all the existing code.

The migration to Universal Apps was really straightforward: I was able to have the samples up and running in my emulator and devices while waiting at the airport in San Francisco.



I’ve uploaded all the source code on Codeplex here, feel free to grab and give it a try.

Happy universal coding everyone! :)

Experiments with TypeScript, MVVM and Windows Store apps – TypedMVVM available on CodePlex

Have you already tried TypeScript?

TypeScript is an Open-Source language designed by Anders Hejlsberg (the creator of C#, Delphi and Turbo Pascal) for extending JavaScript with additional features available in languages like C#: classes, static typing, interfaces, generics, and modularization (just to name a few).

The language is a typed superset of JavaScript: the compiler generates plain JavaScript that can be executed on every platform where JavaScript is supported (as reported on the main site: “Any Platform, Any host, Any OS”). The following links are a great starting point for understanding and learning it:

There’s been a lot of buzz about it in the last period and, while playing with this new language, I have created a new project on CodePlex – TypedMVVM – for experimenting how TypeScript could be used in a real world scenario by applying separation of concerns via the MVVM pattern in a simple Windows Store navigation app developed with WinJS.

Starting from the default Visual Studio Windows Store app Navigation template for JavaScript, I have converted all the .js source files to TypeScript (mainly renaming their extension to .ts) and then changed / added the following folder structure and classes / interfaces implementations:

  • designData – services implementation for design-time data in order to enable “Blendability”;
  • interfaces – interfaces for Services, ViewModels and ViewModelFactory;
  • libs – TypeScript definitions and TypedMVVM core classes (in particular RelayCommand<T> and ViewModelBase);
  • services – concrete services implementations used by the ViewModels;
  • viewModels – concrete ViewModels implementations;
  • views – views definitions.

The first impression is very positive: static typing is a must-have for writing complex apps and enabling features like refactoring or intellisense. Language features like interfaces, classes, generics and lambda expressions permit the developer to write code more readable, maintainable and extensible.

I’m planning to add more features and helper classes to this sample in the future whilst waiting for the final release of TypeScript so stay tuned!

The complete source code is available for download here: http://typedmvvm.codeplex.com

Happy Coding!

NDepend v5.0 available

I’ve just received my copy of NDepend v5.0: this new version adds several great features to the product including

  • Support for Visual Studio 2013 (yeah!)
  • New Dashboard Panel
  • Focusing on Recent Rules violation
  • UI Enhancements
  • Trend Monitoring
  • Churning Rules and Queries
  • Report Enhancements

Click here to read a detailed description of the new capabilities and access the download links (14 days trial available).

Happy coding!

NDepend v4.1 adds CQLinq killer feature and support for Windows Store apps

I already blogged about NDepend basic features here: I was positively impressed by the capabilities of this tool by fellow MVP Patrick Smacchia.

NDepend permits you to examine .NET projects and highlight different metrics in the code in order to better analyse what areas of your solution needs refactoring for improving performance, code maintainability, application stability and applying best coding practices (just to name a few).

Some features, already available in the previous versions of NDepend, include tools for visually representing dependencies between classes, defining custom rules on code, explore code diffs and analyse code coverage. These ones are particularly helpful when the size of the project grows: a visual representation helps the developer to better identify areas that needs more work (and then save development time).

Recently Patrick contacted me for highlighting the new features available in NDepend v4.1. I was very pleased to find support for Windows Store apps but another capability got immediately my attention: CQLinq.

This is a killer feature: CQLinq (acronym for Code Query LINQ) enables the developer “to query the code” for retrieving information about it. Some simple examples of queries could be:

  • find me the methods too big / too complex;
  • find the methods added but poorly covered by tests;
  • get information about naming conventions;
  • any other query you like: the possibilities are not limited at all!

Technically these queries can be constructed using the traditional LINQ syntax and the types defined in the NDepend.CoreModel of the NDepend API.

The best place to start using CQLinq is here by exploring the dedicated section on the site which contains a ton of different examples to start: I recommend to try and run the available samples which are an excellent starting point and then modifying them for custom queries.

I’ve been really impressed by CQLinq and I can’t wait to use it on real projects to enhance the quality of the code and then reduce the time needed for new implementations.

Happy coding everyone!

MultiTouch Behaviors available on NuGet

I’ve received several requests for publishing the MultiTouch Behaviors on the NuGet gallery so I created a simple package containing support for the Windows Phone and Silverlight platforms.

To enable your project for MultiTouch, just run the following command in the Package Manager Console and all the libraries and dependencies will be added to the Visual Studio project:

PM> Install-Package MultiTouchBehaviors

Alternatively just search for the package selecting Tools->Library Package Manager->Manage NuGet Packages for Solution from Visual Studio 2012.

If you are interested in creating a NuGet package for your open-source project, register an account here in the gallery and follow the instructions described in the section “Creating and Publishing a Package“: they are very clear and contain detailed information about the process.

The package definition for MultiTouch is also available in the Source Code section on CodePlex.

Happy Coding!

Microsoft Patterns & Practices: Prism for the Windows Runtime – My favourite resources

As you may know, the Microsoft Patterns & Practices team has recently released the final version of  “Prism for Windows Runtime“, available for download here on CodePlex.

Prism for Windows Runtime

This project contains a complete guidance for building Windows Store apps using C# and XAML and includes the following resources:

Big kudos to all the p & p team: they did an amazing job and I personally felt honored to have the possibility of providing feedback whilst the project was in development.

This is really a great guidance for building Windows Store applications that can be easily tested, maintained and extended: every developer building complex apps will benefit from it.

Other useful links:

Happy coding everyone!