TypeScript Samples

Learning TypeScript by Example

Hello World Ground-floor example of types and classes

This sample shows basic class definition and instantiation.

Hello World sample

RaytracerAn implementation of TypeScript-based raytracer

This sample implements a DOM canvas-based raytracer. Notable features include:

  • Use of the DOM Canvas
  • Use of a wide range of TypeScript language features including interfaces, classes, modules, accessibility modifiers, and casts

Raytracer Sample

TodoMVC A TypeScript version of the class TodoMVC using Backbone.js and jQuery

This sample shows an implementation of the Backbone.js TODO sample derived from https://github.com/addyosmani/todomvc. The following TypeScript integration points are highlighted:

  • Backbone.js: Using TypeScript classes to create Backbone models and views
  • jQuery: Using jQuery for all DOM manipulation

TodoMVC Sample

ImageBoard A Node.js + Express + MongoDB application built using TypeScript on the server

This sample implements a complete Node.js application. Notable features include:

  • Typed usage of Express for server-side MVC
  • Typed usage of MongoDB for server-side database access
  • Typed usage of Node.js
  • Use of TypeScript module syntax targeting the Node.js module system
  • Visual Studio project file for working with the project

ImageBoard Sample

JQuery Parallax StarfieldA JQuery application built to show simple JQuery usage

This sample implements a small JQuery application. Notable features include:

  • Typed usage of JQuery

JQuery Sample

D3 VisualizationAn application built to show use of D3 and canvas-based visualization

This sample implements a small D3 visualization. Notable features include:

  • Typed usage of D3
  • Use of the DOM Canvas

D3 Sample

Warship CombatA full battleship-clone

This sample implements a full game using JQuery and JQuery UI. Notable features include:

  • Typed usage of JQuery and JQuery UI
  • Use of getters/setters
  • Use of traditional OO code design, including access modifiers

Warship Combat Sample

Encyclopedia App A complete Windows 8 Store application built with HTML, CSS, and TypeScript

The encyclopedia includes a complete sample of a Windows 8 Store application built using TypeScript. The following features of TypeScript are highlighted:

  • Visual Studio project integration: TypeScript compilation integrated into Visual Studio's build system
  • Typing WinJS and the Windows Runtime: Early work shown typing these libraries
  • Mostly JavaScript in TypeScript: Code is mostly the original JavaScript, with a little TypeScript
  • DOM types: Mix of strongly-typed and weakly-typed DOM manipulation

Windows 8 Encyclopedia built with TypeScript sample