1. http://35z.us/geotspp JavaScript Architecture Introduction to Scalable Enterprise Level JavaScript Application Architecture with Microsoft's TypeScript - Presented by Michael Kappel

2. Michael Kappel, MCPD https://www.mcpvirtualbusinesscard.com/VBCServer/MichaelKappel/profile http://MichaelKappel.com/

3. What we are going to cover • What is TypeScriptand why I chose it for Geotrackable.mobi • TypeScript- vs - DART - vs - CoffeeScript • TypeScript Language Features • Jump into Code, look into Architecture • Some ways to avoid common issues • Wrap-up and give away stuff

4. Geotrackable QR Codes

5. GeotrackableGeocoins

6. Geotrackable.org & Geotrackable.mobi http://Geotrackable.org http://Geotrackable.mobi

7. Coordinate Converter http://geotrackable.mobi/CoordinateConverter/

8. What is TypeScript? • TypeScript is a syntactic sugar for JavaScript. • TypeScriptsyntax is a superset of Ecmascript 5 (ES5) syntax • TypeScript syntax includes several proposed features of Ecmascript 6 (ES6) • Top 10 reasons why TypeScript will be widely adopted • http://www.pursuitofgreatdesign.com/2012/10/top-10-reasons-why-typescript-will-be.html

9. TypeScript, DART, & CoffeeScript Micorsoft / Open Source Google Jeremy Ashkenas / Open Source http://www.dartlang.org/ http://www.typescriptlang.org/ http://coffeescript.org/ Open Source http://typescript.codeplex.com/ Open Source https://code.google.com/p/dart/ Open Source https://github.com/jashkenas/coffee-script/

10. CoffeeScript, JavaScript, TypeScript, DART, and ECMA Script 6 Comparison Chart http://smthngsmwhr.wordpress.com/2013/02/25/javascript-and-friends-coffeescript-dart-and-typescript/ JavaScript and Friends: CoffeeScript, Dart and TypeScript

11. TypeScript Language Features • Type Inference • Type Annotations • Ambient Declarations • Classes • Modules • Interfaces • Enumerations var node = document.getElementById('test'); node.style.color= '#0f0'; varlink:HTMLAnchorElement = <HTMLAnchorElement>document.getElementById('test'); link.href = 'http://geotrackable.org'; declare varExternalModule: any; ExternalModule.anything = 'value'

12. Enumerations export module Enumerations { //Step 1 - Geographic coordinate conversion Types// //http://en.wikipedia.org/wiki/Geographic_coordinate_conversion// export enumDirectionTypes { North, East, South, West } export enumLatitudeLongitudeTypes { Latitude, Longitude } }

13. Classes export class PublicKeyInfo implements Interfaces.IPublicKey { private publicKey: string; constructor(publicKey: string) { this.publicKey = publicKey; } get PublicKey(): string { return this.publicKey; } }

14. Interfaces export interface IStringable { ToString(): string; } export interface ICoordinateConversions extends IStringable { ToCoordinateDecimal(): ICoordinateDecimal; ToCoordinateDms(): ICoordinateDms; ToCoordinateDm(): ICoordinateDm; }

15. Lambda Expressions export interface IEvent { add(listener: () => void ): void; remove(listener: () => void ): void; trigger(...a: any[]): void; }

16. Definition Files • https://github.com/borisyankov/DefinitelyTyped/tree/master/jquery • /// <reference path="../jquery.d.ts" /> • /// <reference path="../google.maps.d.ts" />

17. JavaScript Scope And Closures module Geo.Location { export function GetPosition() { navigator.geolocation.getCurrentPosition((position) => { this.GotPosition(new Geo…..Info(position.coords.latitude, position.coords.longitude)); }, (err) => { alert('navigator.geolocation.getCurrentPosition ERROR ' + err.message); }); } function GotPosition(position:Geo.CoordinateConverter.Interfaces.ICoordinateDecimal) { ViewModel.CoordinateInput = position.ToString(); } }

18. Avoiding Problems • If Visual Studio becomes unresponsive oven up the .ts file you last made changes to in Notepad and remove all the code. Removing code should fix visual studio so you can go back in and re-add it. • If Visual Studio lags adjust Automatic Formatting Tools->Options->Text Editor->TypeScript->Formatting

19. Helpful Links • Language Specification PDF 35z.com/typescript • TypeScriptvs Dart http://youtu.be/5AqbCQuK0gM • Contact Me http://MJK.tel • PowerPointhttp://35z.us/geotspp • Like Software Development Community on Facebook • https://www.facebook.com/pages/Software-Development-Community/205277332916057 • Like Geotrackable on Facebook https://www.facebook.com/Geotrackable

20. Geocaching http://www.opencaching.com/en/#!geocache/OXZTAHD