Wednesday, October 29, 2014

Angular AtScript

I heard some colleagues discuss if Angular.js will ever be written using TypeScript. The answer is no. In fact, the Angular.js team is using their own language AtScript to build Angular 2.0. The goal of AtScript is similar to the goal of TypeScript, it enhances the JavaScript language with some missing features without infringing upon its current capabilities.

Here are some of the enhancements and the philosophy behind the language from the Angular.js team design documents:

Enhancements

  • Type Annotations: Types allow us to explicitly express contracts between different parts of the system and to give these contracts names. For large teams with large codebases, where no single person knows the whole codebase, types become a key way to discuss and reason about the collaboration between different components of the system.

  • Field Annotations: Types are not only about contracts (API) but also about structure. In JavaScript the fields are implicit; they are created as a side effect of assignment. By giving the developer syntax to explicitly declare the fields, and warning upon implicit creation, we allow them to think about types in a more concrete way. By doing this we in no way sacrifice the flexibility of adding fields dynamically. We simply provide an optional tool to developers who can benefit from being more explicit.

  • Metadata Annotations: Many things in programming are best expressed in a declarative fashion. Declarative annotations allow frameworks to understand the meaning of your code without forcing a complex inheritance or lifecycle API. Examples where this technique has been used in the past include dependency injection libraries and web frameworks.

  • Type Introspection with Annotation Support: When we have annotations, it’s important to provide a consistent API that developers and frameworks can leverage to gain access to this information at runtime. The reflection API should also be backwards compatible with ES5 and ES6.

Philosophy

  • ES6 Baseline: ES6, or ECMAScript 6, is the latest version of the Ecma International language popularly know as JavaScript. It includes many improvements such as a formal class declaration syntax, promises, modules and consistent variable scoping.

  • Backwards Compatibility: Types, fields, metadata annotations and reflective access need to be added in a way which does not break the existing syntax or semantics of ES6/ES5. AtScript needs to be a more succinct way of expressing what is already possible in these languages. ES6/ES5 code must be valid AtScript code without any changes to the semantics. Any developer who has written ES6/ES5 code can immediately get started with AtScript. In other words, ES6/ES5 are strict subsets of AtScript. All the code you are used to writing today will work without alteration with AtScript, but now you can take advantage of the enhancements to the language which will allow you to express your ideas in a more concrete way.

  • Familiar Syntax: We desire to use a syntax which has been tried, is time tested and is most likely to become the next standard. This means using ':' to indicate type annotations (proposed in ES4 and used by TypeScript), '@' for metadata annotations (used by java, dart and others) and 'name:Type;' for field annotations (used by java, dart, TypeScript and others).

  • Pragmatic Approach: The goal is not to build a type system that is correct 100% of the time. Rather, we want to be flexible and useful in the vast majority of real-world scenarios.

  • Semantics Agnostic: Type system theory is a complex field with many tradeoffs. It is our explicit goal to leave the semantic discussion as well as the assertion system outside of the scope of AtScript. Instead we want to provide hooks for others to build runtime type assertion libraries and static analyzer tools with their own semantics. In this way we believe that we can spur innovation in the area of type systems by lowering the barrier to entry.

The Angular.js team was certainly inspired by TypeScript but they choose a different path:

The AtScript has been influenced by TypeScript and Dart. Here we would like to discuss why these existing solutions do not meet our needs.

TypeScript

  • Types are analyzed statically only.

    • Static analysis makes it difficult to have optional types, since static analysis can not analyze what is not typed. (type inference has its limits)

    • Static analysis can not be used to assert that the JSON returned from the server has valid structure.

  • Lacks meta-data annotations

  • Provides no mechanism to access the annotations at runtime

Dart

  • Dart is semantically different from JavaScript. The resulting Dart2JS code uses JS as more of a VM than a language. The result is that Dart2JS code can not easily interoperate with JS code. Only primitive types (such as strings, numbers, arrays, maps) can be passed between Dart and JS. Complex things such as classes can not be marshaled easily.

    • Existing JavaScript libraries can not be used from Dart in a straightforward way. Limiting reuse of prior art.


As a frequent TypeScript and Angular.js user, I see what benefits AtScript brings to the table. One thing is certain, the Angular future looks promising…

Tuesday, October 28, 2014

ASP.NET Custom Headers–X-UA-Compatible=‘IE=Edge’

If you are building a ‘modern’ web application for Internet Explorer, I would recommend to enable the following header inside your web.config:

Using this header will enable ‘Edge mode’ inside IE. It represents the highest support for modern standards available to the browser. In other words, it tells Internet Explorer to use the highest mode available to that version of IE; e.g. Internet Explorer 8 can support up to IE8 modes, IE9 can support IE9 modes and so on. Edge mode was introduced in Internet Explorer 8 and has been available in each subsequent release. Note that the features supported by edge mode are limited to those supported by the specific version of the browser rendering the content.

Remark: Starting with IE11, Edge mode is the default mode. Other document modes are deprecated and should no longer be used, except on a temporary basis. Make sure to update sites that rely on legacy features and document modes to reflect modern standards. 

Monday, October 27, 2014

Building cross-platform mobile apps in Visual Studio

Interested in building cross-platform mobile apps using Visual Studio? Microsoft made this easy thanks to the Multi-Device Hybrid Apps Visual Studio extension. This extension allows you to combine Visual Studio and Apache Cordova to easily build hybrid apps that run on iOS, Android, Windows, and Windows Phone using a single project based on HTML and JavaScript.

image

The extension is available for download here.

Remark: Be aware that the extension will download and install some additional dependencies, including

  • Joyent Node.js
  • Git CLI
  • Google Chrome
  • Apache Ant
  • Oracle Java JDK 7
  • Android SDK
  • SQLLite for Windows Runtime
  • Apple iTunes

More information can be found at http://www.visualstudio.com/en-us/explore/cordova-vs.aspx.

Friday, October 24, 2014

Internet Explorer–What’s coming next?

Do you want to know what HTML/JavaScript/CSS features will be supported in future versions of Internet Explorer? https://status.modern.ie/ brings you the answer. You see all the features that the IE team is considering to support(and you even can see the support for other browsers).

image

Thursday, October 23, 2014

ASP.NET MVC–CS0234: The type or namespace name ‘’ does not exist in the namespace ‘System.Web.Mvc’

Sometimes you have these issues that always appear randomly. You know you have seen these issues before, but you can’t remember how you fixed them Verwarde emoticon.

Today I opened up the project I was working on for the last month to see the following error:

CS0234: The type or namespace name ‘’ does not exist in the namespace ‘System.Web.Mvc’

image

I first tried all the obvious things when you have such an unexpected error:

  • Clean the solution and rebuild the project… Didn’t help
  • Restarting Visual Studio… Didn’t help
  • Delete everything from the Temporary ASP.NET Files folder… Didn’t help
  • Got another coffee at the coffee corner… Didn’t help but I felt a little bit better

Finally I noticed that I had switched between configuration modes. Inside the Debug configuration mode, I noticed that Copy Local was set to False for System.Web.MVC. When I changed Copy Local to True everything was working again.

Wasted one hour…

Tuesday, October 21, 2014

TFS Performance Tips

Last week I noticed the following blog post by Cory House; Two Quick TFS Performance Tips.

It’s a small post, but one with great value…

In his post, he shares one of the greatest performance tips ever about TFS; create a separate workspace for each Team Project. How many times I heard a developer complain that TFS was slow and cumbersome to use… And when I took a look at his Visual Studio solution I had to discover that his 5 years of developer work was all sitting in the same workspace. Ugh…

tortoise_and_hare

Monday, October 20, 2014

Announcing Microsoft Connect event

On November 12th,  Microsoft is hosting an online developer event called Connect();Connect(); will be a chance to have a conversation with developers about what’s coming next for developer tools, developer services and application platforms across Microsoft.

From the website:

Connect(); is a cloud-first, mobile-first, code-first virtual event focused on current and future Microsoft technologies for developers. Build on your current skills, unleash your creativity, and expand what's possible to deliver unprecedented innovations.”

connect-2

So if you have any questions about what’s coming next in ASP.NET, this is a great opportunity to get some answers…

Friday, October 17, 2014

Angular.js: Using ngAnnotate inside Visual Studio

Last week I discovered a great NPM module; ‘ng-annotate’.It adds and removes AngularJS dependency injection annotations.

The great thing is that allows you to use implicit dependencies in Angular.js and ng-annotate will automatically make the switch to the Inline Array annotation.

This means that you write  the following code:

And that it gets rewritten automatically to:

The only problem is that I have to run ngAnnotate from the commandline. As a Visual Studio user, I would like to have an integrated solution. Let’s see how we get this done…

Integrate ngAnnotate into Visual Studio

To make integration possible, we’ll use some Visual Studio Extensions. So let’s install them first.

  • Start with installing(or upgrading) to the latest version of Web Essentials.
  • Also install node.js on your system.
  • Now it’s time to install Task Runner Explorer. This will allow you to run Grunt and Gulp tasks directly from within Visual Studio.
  • You can also install the Package Intellisense plugin. This is not required but makes it a little bit easier to use NPM from inside Visual Studio.

Now that we have all prerequisites installed, it’s time to get back to ng-annotate. There exists a ng-annotate plugin for both Grunt and Gulp. Which one you use depends on your own preferences but the process is similar. I will show you how to do it using Grunt. But first we have to install Grunt itself:

  • Open a command prompt and install the Grunt command line interface globally by using the following command:
    • npm install -g grunt-cli

Open your web project inside Visual Studio. It’s time to add some extra files:

  • Add a package.json file to the root of your web project. Also add a gruntfile.js file.

image

  • Inside the package.json, add the following content. In this case I also added a dependency to some other NPM packages to minify and uglify my code:
  • Right-click on the package.json file and choose NPM install packages. (If you don’t see this option, open a command prompt and do an npm install from the package.json location).

image

  • After the packages are installed, it’s time to create our gruntfile.js:

 

We finally arrived at the moment where we can run the Task Runner Explorer:

  • Right-click on the gruntfile.js in Visual Studio and choose Task Runner Explorer.

image

  • This will open up the Task Runner Explorer and show all available Grunt tasks.

image

  • Right click on the ngAnnotate task, choose Bindings and click on After build. Now each time we build the ngAnnotate task will automatically rewrite our Angular.js code to add the missing annotations.

image

Great!

Thursday, October 16, 2014

Angular.js 1.3: The ng-strict-di directive

Angular.js 1.3 introduces a new directive: ‘ng-strict-di’.

<div ng-app="myApp" ng-strict-di>

From the documentation:

if this attribute is present on the app element, the injector will be created in "strict-di" mode. This means that the application will fail to invoke functions which do not use explicit function annotation (and are thus unsuitable for minification), as described in the Dependency Injection guide, and useful debugging info will assist in tracking down the root of these bugs.

To explain this a little bit more; Angular.js does (implicit) dependency injection based on the name of the object you try to inject. So if you specify a parameter as ‘$scope’ it will look for an object called ‘$scope’. This works great until you start using minification. When you minify your JavaScript, the function parameters are shortened to a random letter, e.g. ‘d’. When the injector runs this minifies JavaScript it no longer searches for a ‘$scope’ object, but for a ‘d’ object instead. As this object does not exists, dependency injection will fail.

A solution for this is explicitly specifying the dependencies as strings(called explicit function annotation). The ‘ng-strict-di directive’ will check if this syntax is used and throw an exception otherwise.

You can use the $inject Property annotation or use the Inline Array annotation:

Wednesday, October 15, 2014

Another free Xamarin e-book

There is really no excuse anymore to at least read one book about Xamarin. After the free ‘Master Cross-Platform Mobile Development with Xamarin ebook’ I mentioned last week, there is now another free ebook: Creating Mobile Apps with Xamarin.Forms, Preview Edition: Cross-platform C# programming for iOS, Android, and Windows Phone, by Charles Petzold. This ebook was created jointly by Xamarin and Microsoft Press.

XamarinEbook

This Preview Edition ebook is about writing applications for Xamarin.Forms, the new mobile development platform for iOS, Android, and Windows Phone unveiled by Xamarin in May 2014. Xamarin.Forms lets you write shared user-interface code in C# and XAML (the eXtensible Application Markup Language) that maps to native controls on these three platforms.

This ebook is a Preview Edition because it's not complete. It has only six chapters. We anticipate that the final version of the book will have at least half a dozen additional chapters and that the chapters in this Preview Edition might be fleshed out, enhanced, or completely reconceived. The final edition of the book will probably be published in the spring of 2015.

You can download PDF and Mobi formats at the Microsoft Virtual Academy.

Tuesday, October 14, 2014

Log database activity in Entity Framework

A quick tip if you want to log what’s going on inside Entity Framework:

This will log not only the query, but also other useful information like the execution time, etc…

Monday, October 13, 2014

Fake asynchrony: Avoid the JSON.NET async APIs

As a developer I frequently build my own libraries or re-use existing ones. In the new async/await world, you have to consider if you implement an async version of your library.  However one thing that is important is to avoid “fake asynchrony”. Fake asynchrony is when a component has an async API, but it’s implemented by just wrapping the synchronous API within a task or thread.

This will lead to unexpected behavior and can decrease performance. One example of fake asynchrony is Newtonsoft JSON.NET, the known (and great) JSON serialization library. The creators of JSON.NET are already aware of this issue and made the async API’s obsolete:

image

Friday, October 10, 2014

Angular.js and ASP.NET MVC: IsAjaxRequest returns false when using $http

In an application we are combining Angular.js on the client and ASP.NET MVC on the server. This all works great until we added a call to Request.IsAjaxRequest inside our MVC controller:

Inside the controller action we check if we have an AJAX request. If this is the case we return a JSON result otherwise we return an HTML view.  We’ve used similar code(in combination with jQuery) in previous projects without any issues. But when calling the MVC action method through Angular’s $http service, we noticed that the Request.IsAjaxRequest() method returned false.

When comparing the requests issued by Angular $http versus jQuery $.get() we noticed one small difference. The xhr call initiated by Angular doesn’t contain the X-Requested-With header. And this is exactly the header ASP.NET MVC is looking for to detect if it’s an AJAX request or not.

We can easily fix this by changing the $httpProvider configuration to include this header with every request:

Thursday, October 9, 2014

Master Cross-Platform Mobile Development with Xamarin

The guys from Falafel are offering a free e-book about Cross-Platform Mobile development with Xamarin.

Go download your copy here(registration required).

image

Wednesday, October 8, 2014

Microsoft Azure: Using SSDs in Azure Virtual Machines and Azure Cloud Services

Recently Microsoft released a new set of VM sizes for Microsoft Azure. What makes these new VMs special is that they not only offer faster vCPUs (approximately 60% faster than the A series) and more memory (up to 112 GB), the new VM sizes also all have a local SSD disk (up to 800 GB) to enable much faster IO reads and writes.

If you are looking for even better performance, these are the VM sizes you need!

image

The new VM sizes include the following:

General Purpose D-Series VMs

Name vCores Memory (GB) Local SSD Disk (GB)
Standard_D1 1 3.5 50
Standard_D2 2 7 100
Standard_D3 4 14 200
Standard_D4 8 28 400

High Memory D-Series VMs

Name vCores Memory (GB) Local SSD Disk(GB)
Standard_D11 2 14 100
Standard_D12 4 28 200
Standard_D13 8 56 400
Standard_D14 16 112 800

To learn more about the D-Series please read this post.

Tuesday, October 7, 2014

ASP.NET Web API error: Can't bind multiple parameters to the request's content

A colleague asked me to help him out with a problem he had with a specific ASP.NET Web API controller. Let’s have a look at his controller first:

Inside his web application, he uses a form to post data to this specific controller. However when he runs his application, the post always fails with the following error message:

Can't bind multiple parameters to the request's content

This is by design. In ASP.NET Web API it isn’t possible to pass multiple parameters by body. As we are using a POST the form data is part of the message body. ASP.NET Web API is unable to extract the form data from the message body and set the parameter values.

To get this working, you can either replace the parameters by a FormDataCollection and do the binding yourself or you can create a POCO object to and use the built-in model binders:

Monday, October 6, 2014

NHibernate: Copy an object graph

We are working on an application where we have to create copies of a whole object graph and save this copy as a new object(or better an object tree) to the database.

I found 2 possible solutions to get this done:

Option 1 – Serialize and deserialize the object tree

This is probably the easiest solution. Take the object tree you want to copy, serialize it, deserialize it and attach it to an NHibernate session. The only caveat is that every object in your object tree should be marked as [Serializable].

Option 2 – Combining an ID reset, Session.Evict and some dependency walking

Another option is to walk through the object tree yourself while resetting the id values to their default. Don’t forget to remove the objects from the session first by calling Session.Evict.

Friday, October 3, 2014

SQL Server: the database could not be exclusively locked to perform the operation

To get an application up and running, I had to change the Database Collation. But updating it failed with the following error message:

The database could not be exclusively locked to perform the operation

I was able to fix it by (temporarily) change the database access to SINGLE_USER.

clip_image002

Thursday, October 2, 2014

Web API: Binding to form data

Just a quick ASP.NET Web API tip today…

If you want to access the form data posted to a an ASP.NET Web API controller, the easiest solution is to use the built-in FormUrlEncodedMediaTypeFormatter, which knows how to map every key/value in the form data to a FormDataCollection.

In your controller method, you can specify the FormDataCollection as a parameter:

Wednesday, October 1, 2014

Adventures in Angular

Already using Angular.js? Or interested in learning about it? Subscribe to the ‘Adventures in Angular’ podcast; a weekly show dedicated to the AngularJS framework.

Certainly check out this weeks episode as Rob Eisenberg talks about what’s coming in Angular 2.0.

image