Sunday, October 7, 2012

TypeScript is a language for industrial Web applications

TypeScript is a language for application-scale JavaScript development. It combines type checking, static analysis, explicit interfaces into a single language and compiler.

By building on JavaScript, TypeScript keeps you close to the runtime you’re targeting while adding only the syntactic sugar necessary to support large applications and large teams.

Importantly, TypeScript enables great tooling experiences for JavaScript development. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. You can use it in any browser, any host and any OS.

TypeScript offers optional type annotations, open source under the Apache 2.0 license, explicit interfaces, module exports. There is limited type inference. It works with JQuery library.

TypeScript extends the syntax of JavaScript. So any JavaScript program is a TypeScript program. New syntax features (classes, interfaces, modules) is used in accordance with ECMAScript 6. ECMAScript 6 is the next version of standard JavaScript.

TypeScript's development was led by Anders Hejlsberg. He developed TypeScript with Luke Hoban, Steve Lucco. Hejlsberg has a long history of developing practical, mainstream programming languages. He was the man behind Turbo Pascal, Delphi and C#. In 1996, Hejlsberg left Borland and joined Microsoft. He received the 2001 Dr. Dobb's Excellence in Programming Award. He also got a Technical Recognition Award for Outstanding Technical Achievement for a work on the C# language.

Next I'll show you how to debug TypeScript programs. You need to download and install the TypeScript editor plugin for VS 2012.

Create HTML Application with TypeScript in VS 2012.


Add TypeScript files.

To generate source map files change the MSBuild target that builds TypeScript files in your project file. You will find a target called "BeforeBuild" that is calling the compiler at "$(PROGRAMFILES)\Microsoft SDKs\TypeScript\0.8.0.0\tsc".
Change it for "$(PROGRAMFILES)\Microsoft SDKs\TypeScript\0.8.0.0\tsc "-sourcemap"..."

You need to download and install the Canary Chrome web browser from Google web site and add it to the VS 2012.

You have to enable source maps in the Canary Chrome.

Run your apllication. It will be opened in the Canary Chrome. Set up a break point in your ts file (Sources tab ).

Press F5 to run your page in the Canary Chrome.