Presentation is loading. Please wait.

Presentation is loading. Please wait.

North Shore.NET User Group Our Sponsors. North Shore.NET User Group Check out our new web site Next Meeting

Similar presentations


Presentation on theme: "North Shore.NET User Group Our Sponsors. North Shore.NET User Group Check out our new web site Next Meeting"— Presentation transcript:

1 North Shore.NET User Group Our Sponsors

2 North Shore.NET User Group Check out our new web site http://northshore.netusergroup.org.nz/ Next Meeting http://northshore.netusergroup.org.nz/Meeting/Meetup/?id=M20140327

3 Write JavaScript the way you really want to

4 About Us Andy Mark Aderant

5 Our Project Web based Case and ERP. Customisable by the customer 67 KLOC script so far A large project (9+4+7=20 devs for 18-24 months) Quite a few grads, some with 3 years experience, 4ish seniors Staff familiar with OO and C# Knockout, Kendo UI, JQuery, MVC, Web API

6 Erich Gamma – Building a Large Scale JavaScript Application in TypeScript patterns TypeScript size

7 TypeScript JavaScript for large applications A superset of JavaScript (you're already doing TypeScript!) (no big migrate) Optional Static Types, OO and Modules Announced 2012, Anders Hejlsberg Open source (written in TypeScript) 'Javascript the good bits' - over 30% is what NOT to do, TypeScript helps

8 Advantages of TypeScript Easy to debug ES6 now (classes, modules, lambdas) Produces clean idiomatic JavaScript Tools - VS 2012/2013, R#, Eclipse, Sublime, vi etc. etc. TSLint

9 Disadvantages Extra compile step (“Transpile”) Source maps to debug, Personal preference is to debug JS avoids TS evaluation and the this versus _this problems Browser dev tools are JS environments not TS Can't evaluate TS code, eg if it has types. ThirdParty.d.ts files, find them, sometimes correct them

10 Features. Don’t talk, demo. Type annotations Lambdas (better this) Compile time type checking Enums Interfaces (API, option bags, JSON, external libraries etc.) Classes Inheritance Generics Modules

11 Internal Modules Simple to get started Implements module pattern provides namespacing can put entire application in one global BUT Open and too flexible Can add to an internal module from any file Leads to code organisation rot.

12 Simple Modules Demo

13 External Modules Supports AMD (Browser) and CommonJS (Node) Common and easier syntax. Structured: 1 file = 1 module Use 'export=' syntax to make consumption cleaner. Demo...

14 Bundling Modules Typescript compiler can bundle files. Not external modules. Can also use ASP.Net bundling - it's just JS External Modules Require Optimization tool can combine external modules Creates a single minified JS file. Use require to get other JS modules on demand.

15 Definitely typed Types for 375+ libraries Provides nice intellisense of 3rd party libraries, eg: JQuery knockout Angular

16 Create Your Own Type Defs Aderant uses an oData query service Model our data to produce: nHibernate & Entity Framework maps C# and Typescript DTO's Show our query service type defs (demo) Typescript meets oData (demo) Generate type definitions from oData metadata. Why? Intellisense and compile time checking Pick up typos early in the dev cycle

17 Debugging Browser dev tools are JS environments not TS Can't evaluate TS code, eg if it has types. Personal preference is to debug JS Avoids TS evaluation and the this versus _this problems Debugging in VS (Not us) Demo Chrome & IE with source maps.

18 Unit Testing Initially we started writing our tests in Javascript Now write all our Unit Tests in Typescript. Use QUnit, QUnit-promise, Mockjax. All these have type definitions available. Run unit tests on each CI build

19 Team Foundation Server Source Control js, js.map, and.d.ts files not checked in. Builds Typescript is compiled as part of Solution/Project If not using MS Build one can use the NPM package Grunt etc.

20 Erich Gamma – Building a Large Scale JavaScript Application in TypeScript patterns TypeScript size


Download ppt "North Shore.NET User Group Our Sponsors. North Shore.NET User Group Check out our new web site Next Meeting"

Similar presentations


Ads by Google