Les applications web recourent de plus en plus au javascript, et on commence maintenant à recourir au javascript pour les parties serveur avec des outils comme Node.js TypeScript est un nouveau language permettant d'annoter et de structurer son code javascript, afin d'en faciliter la fiabilité et la maintenance. Dans cette session, nous vous présenterons les bases de TypeScript et comment tirer le meilleur parti de ce nouvel outil dans vos applications.

1. 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

2. TypeScript pour les nuls
Guillaume Leborgne
Architecte logiciel
François Guillot
Développeur web
#typescript
www.typescriptlang.org
Code / Développement

3. 100 %
180 collaborateurs
Depuis 2007 à Paris - Lyon - Genève
Dot Share
NET Point
Business
Intelligence
Biz
Microsoft Talk Stand 97 – Zone bleu
foncé

4. Il y a à peine 10 ans…
JAVASCRIPT? COMME JAVA?
TypeScript pour les nuls

5. JavaScript il y a 10 ans
// Manipuler dynamiquement les CSS // Créer une requête Ajax
var myDiv = document.getElementById("main"); var XMLHttpFactories = [
function () {return new XMLHttpRequest()},
myDiv.style.display = "block"; function () {return new ActiveXObject("Msxml2.XMLHTTP")},
myDiv.style.backgroundColor = "#FF0000"; 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

6. JavaScript il y a 10 ans
TypeScript pour les nuls

7. 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

8. JavaScript aujourd’hui
• Incontournable pour le
développeur web
• Écosystème riche et
communauté importante
• Single page applications
TypeScript pour les nuls

9. La course aux performances
TypeScript pour les nuls

10. Où en est JavaScript?
L’ÉTAT DU LANGAGE
TypeScript pour les nuls

11. Ce qu’on lui reproche
• Typage dynamique
• Langage prototypé
• Encapsulation fastidieuse
TypeScript pour les nuls

12. Ce qu’on lui reproche
Peu adapté aux développements
dépassant une simple page web
TypeScript pour les nuls

13. Une norme à dépoussiérer
• 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/
TypeScript pour les nuls

14. TYPESCRIPT
TypeScript pour les nuls

15. Qu’est ce que TypeScript ?
TypeScript est un surensemble de
JavaScript destiné à améliorer la qualité
et la maintenabilité des bases de code
JavaScript.
TypeScript pour les nuls

16. Intégration à l’écosystème
• 100% compatible avec JavaScript
• Open source (licence Apache 2.0)
• Compilateur TypeScript écrit en TypeScript
• Compatible ECMAScript 3/5 (flag)
TypeScript pour les nuls

17. La syntaxe
• Typage statique
• Orienté objet
• Arrow functions (lambdas)
• Fichiers de définitions
TypeScript pour les nuls

18. Intérêts
• 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
TypeScript pour les nuls

19. TypeScript = JavaScript avec des supers
pouvoirs
TypeScript pour les nuls

20. http://www.typescriptlang.org/Playground/
TYPESCRIPT EN ACTION
TypeScript pour les nuls

21. Intégration aux IDE
• Plusieurs plugins disponibles :
– Visual Studio 2012 (IntelliSense)
– Vi
– EMAC
– Sublime Text
• Web essentials pour Visual Studio :
– Compilation automatique
– Options de compilation
TypeScript pour les nuls

22. Retour d’expérience
APPLICATION WINDOWS
STORE
TypeScript pour les nuls

23. Et demain?
LE FUTUR DE TYPESCRIPT
TypeScript pour les nuls

24. ROADMAP
• 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
TypeScript pour les nuls

25. Les challengers
•
•
• Script#
•
• JSLint et Google Closure
TypeScript pour les nuls

26. Vous pouvez participer
• Plugins pour les IDE (Eclipse, Notepad++…)
• Fichiers de syntaxe (.d.ts)
– https://github.com/borisyankov/DefinitelyTyped
• Suggestions sur CodePlex
TypeScript pour les nuls

27. 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

28. Développeurs Pros de l’IT
http://aka.ms/generation-app Formez-vous en ligne www.microsoftvirtualacademy.com
http://aka.ms/evenements-
developpeurs Retrouvez nos évènements http://aka.ms/itcamps-france
Les accélérateurs
Faites-vous accompagner
Windows Azure, Windows Phone,
gratuitement
Windows 8
Essayer gratuitement nos http://aka.ms/telechargements
solutions IT
La Dev’Team sur MSDN Retrouver nos experts L’IT Team sur TechNet
http://aka.ms/devteam Microsoft http://aka.ms/itteam