TypeScript for dummies - [Download PPTX Powerpoint]

Donnez votre avis !Depuis votre smartphone, sur : http://notes.mstechdays.fr

De nombreux lots à gagner toutes les heures !!!

Claviers, souris et jeux Microsoft…

Merci de nous aider à améliorer les TechDays

http://notes.mstechdays.fr

TypeScript pour les nuls

Guillaume LeborgneArchitecte logiciel

François GuillotDéveloppeur web

Code / Développement

#typescriptwww.typescriptlang.org

http://www.typescriptlang.org/

180 collaborateurs Depuis 2007 à Paris - Lyon - Genève

Stand 97 – Zone bleu foncé

BusinessIntelligence Talk

Biz

NETDot Share

Point

Microsoft

100 %

JAVASCRIPT? COMME JAVA?Il y a à peine 10 ans…

TypeScript pour les nuls

TypeScript pour les nuls

JavaScript il y a 10 ans// Manipuler dynamiquement les CSSvar myDiv = document.getElementById("main");myDiv.style.display = "block";myDiv.style.backgroundColor = "#FF0000";

// Créer une requête Ajaxvar XMLHttpFactories = [ function () {return new XMLHttpRequest()}, function () {return new ActiveXObject("Msxml2.XMLHTTP")}, function () {return new ActiveXObject("Msxml3.XMLHTTP")}, function () {return new ActiveXObject("Microsoft.XMLHTTP")}];

function createXMLHTTPObject() { var xmlhttp = false; for (var i=0;i<XMLHttpFactories.length;i++) { try { xmlhttp = XMLHttpFactories[i](); } catch (e) { continue; } break; } return xmlhttp;}

TypeScript pour les nuls

JavaScript il y a 10 ans

TypeScript pour les nuls

JavaScript il y a 5 ans// Les librairies nous facilitent le travail$.ajax({ "url": "http://www.example.org", "type": "GET", "success": displayData});

function displayData(data) { $("#myDiv") .html(data) .fadeIn() .addClass("newData");}

TypeScript pour les nuls

• Incontournable pour le développeur web

• Écosystème riche et communauté importante

• Single page applications

JavaScript aujourd’hui

TypeScript pour les nuls

La course aux performances

L’ÉTAT DU LANGAGEOù en est JavaScript?

TypeScript pour les nuls

TypeScript pour les nuls

• Typage dynamique• Langage prototypé• Encapsulation fastidieuse

Ce qu’on lui reproche

TypeScript pour les nuls

Ce qu’on lui reproche

Peu adapté aux développements dépassant une simple page web

TypeScript pour les nuls

• ECMAScript 5 sur la dernière génération de navigateurs– http://kangax.github.com/es5-compat-table/

• ECMAScript 6 prometteur mais en chantier (pas avant 2014…)– http://kangax.github.com/es5-compat-table/es6/

Une norme à dépoussiérer

http://kangax.github.com/es5-compat-table/

http://kangax.github.com/es5-compat-table/es6/

TYPESCRIPT

TypeScript pour les nuls

TypeScript est un surensemble de JavaScript destiné à améliorer la qualité et la maintenabilité des bases de code JavaScript.

Qu’est ce que TypeScript ?

TypeScript pour les nuls

• 100% compatible avec JavaScript• Open source (licence Apache 2.0)• Compilateur TypeScript écrit en TypeScript• Compatible ECMAScript 3/5 (flag)

Intégration à l’écosystème

TypeScript pour les nuls

• Typage statique• Orienté objet• Arrow functions (lambdas)• Fichiers de définitions

La syntaxe

TypeScript pour les nuls

• Permettre aux IDE des fonctionnalités avancées– Intellisense– Refactoring– Audit de code

• Limiter les erreurs les plus communes• Améliorer la qualité du code

Intérêts

TypeScript pour les nuls

TypeScript = JavaScript avec des supers pouvoirs

demoTYPESCRIPT EN ACTIONhttp://www.typescriptlang.org/Playground/

TypeScript pour les nuls

http://www.typescriptlang.org/Playground/

TypeScript pour les nuls

• Plusieurs plugins disponibles :– Visual Studio 2012 (IntelliSense)– Vi– EMAC– Sublime Text

• Web essentials pour Visual Studio :– Compilation automatique– Options de compilation

Intégration aux IDE

demoAPPLICATION WINDOWS STORE

Retour d’expérience

TypeScript pour les nuls

LE FUTUR DE TYPESCRIPTEt demain?

TypeScript pour les nuls

TypeScript pour les nuls

• Version actuelle : 0.8.2 (21 janvier 2013)• 0.8.3 :

– Généricité– Améliorations du système de typage visant à permettre la modélisation

des librairies JavaScript

• 0.9.x :– Alignement des fonctionnalités avec ECMAScript 6– Site communautaire pour partager les fichiers de syntaxe– Amélioration du plugin Visual Studio

• 1.x :– Async/Await, Mixins, Protected access– Génération de code compatible ECMAScript 6

ROADMAP