Building Next Generation Apps with...

Post on 03-Jun-2020

2 views 0 download

Transcript of Building Next Generation Apps with...

Rachel Appel Appel Consulting

http://RachelAppel.com

http://Twitter.com/RachelAppel

http://Linkedin.com/rachelappel

Building Next Generation Apps with

TypeScript

Agenda

• TypeScript Intro

• Tools

• Compilation

• Types

• Classes

• Inheritance

• Debugging

• Web and Apps

Get TypeScript

http://www.typescriptlang.org

TypeScript in the Wild

• Bing

• Monaco

TypeScript Features ES5 / ES6

Type Checking

Superset of JavaScript

Next-gen JavaScript for the enterprise

Syntactic Sugar

Classes

Generics & Arrow

Functions

Dot notation for properties

Visual Studio Webstorm

Browser tools

Why use TypeScript? More and more server side

logic using JavaScript (Node.JS)

JavaScript was designed for a sapling DOM

tree

SPA App model

JavaScript apps are becoming quite complex

OOP is easier

C# coders forced into JavaScript

Web/HTML/ASP.NET

Windows Store JavaScript

http://www.typescriptlang.org/playground

Visual Studio

Program organization Program

Module

Class

Class

Method

Property

Members

Module

Class

Members

Class Members

Class Members

DEMO

• TypeScript programs in Visual Studio

TypeScript Compilation

TypeScript .ts

Compiler

JavaScript .js

TypeScript compilation

Types

• Primitive and Object

• Any

• Number

• Boolean

• String

• Null *

• Undefined *

• Object

• Void *

• HTMLElement

• Functions

• Enum

Type annotations

• Argument types

• Return types

• Type inference

DEMO

• Types and annotations

Classes

JS

TS

Classes: Constructors

TS

JS

Classes: Members

TS

JS

Enums

Classes: Access modifiers

Accessing a Class and its members

DEMO

• Creating and using a class

Inheritance

JS

TS

DEMO

• Inheritance

Debugging TypeScript

DEMO

• Debugging

Web and Apps

• HTML

• ASP.NET WebForms and ASP.NET MVC

• Windows Store JavaScript apps

http://bit.ly/15iOfFt

Thank You! Rachel Appel

rachel@rachelappel.com

http://RachelAppel.com

http://Twitter.com/RachelAppel

http://LinkedIn.com/RachelAppel

http://bit.ly/RachNOW Use code APPEL-13 for a 14 day free trial!