Building End to-End Web Apps Using TypeScript
-
Upload
gil-fink -
Category
Technology
-
view
1.728 -
download
0
description
Transcript of Building End to-End Web Apps Using TypeScript
![Page 1: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/1.jpg)
Gil FinkSenior Architect
SELA
Building End-to-End Web Apps
Using TypeScript
![Page 2: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/2.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
AGENDA
The Why Introduction to TypeScript Building a Simple App with TypeScript Q&A Summary
![Page 3: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/3.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
GETTING STARTED
JavaScript can feel messy We want a maintainable code We want to use familiar JavaScript
patterns
![Page 4: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/4.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
THE ALTERNATIVES
We have several alternatives: Hard core JavaScript development
CoffeeScript – http://coffeescript.org
Dart – http://dartlang.org
Script# - http://scriptsharp.com/
![Page 5: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/5.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
WHAT IS TYPESCRIPT?
“TypeScript is a typed superset of JavaScript that compiles to plain JavaScript” ~typescriptlang.org
5
![Page 6: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/6.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
DEMO
Hello TypeScript
![Page 7: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/7.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
TYPESCRIPT IS FLEXIBLE
7
Any Browser Any Host
Any OS Tool Support
![Page 8: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/8.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
TYPESCRIPT KEY FEATURES
8
Support standard JavaScript code with
static typing
Encapsulation
through classes
and modules
Support for
constructors,
properties and
functions
Interfaces and enums
support
Lambda support => and generics
Intellisense and syntax
checking
![Page 9: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/9.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
FROM TYPESCRIPT TO JAVASCRIPT
9
class Greeter {
greeting: string;
constructor(message: string) {
this.greeting = message;
}
greet() {
return “Hi," + this.greeting;
}
}
TypeScript Code JavaScript CodeTypeScri
pt Compiler
var Greeter = (function () { function Greeter(message) { this.greeting = message; } Greeter.prototype.greet = function () { return “Hi," + this.greeting; }; return Greeter;})();
tsc
![Page 10: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/10.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
DEMO
Building a Simple App with TypeScript
![Page 11: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/11.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
QUESTIONS
![Page 12: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/12.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
SUMMARY
• Open source language that compiles into JavaScript
• Key features:• Code encapsulation
• Maintainable code
• Tooling support
• Learn TypeScript today!
![Page 13: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/13.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
RESOURCES
Session slide deck and demos – http://sdrv.ms/1eGoSUM
TypeScript – http://www.typescriptlang.org
My Website – http://www.gilfink.net Follow me on Twitter – @gilfink
![Page 14: Building End to-End Web Apps Using TypeScript](https://reader036.fdocuments.net/reader036/viewer/2022062511/54b739484a795966598b456a/html5/thumbnails/14.jpg)
www.devconnections.com
BUILDING END-TO-END WEB APPS USING TYPESCRIPT
THANK YOUGil FinkSenior Architect [email protected]@gilfinkhttp://www.gilfink.net