AMBIENT INTELLIGENCE
tech days•
2015
#mstechdays techdays.microsoft.fr
Frameworks JavaScript en environnement
Microsoft – Etat des lieux
Sébastien Ollivier Adrien Siffermann
@SebastienOll
solli...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 TechDays News Feed
 Dynamise...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Créé en Janvier 2006 par John...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Des sélecteurs pour parcourir...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Intégré par défaut dans les p...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Créé en 2011 par Twitter
 Fr...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Layout divisé en lignes de 12...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Intégré par défaut dans les p...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Présentation
 Créé en 2010 par...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Des attributs data-bind dans ...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Récupération des packages dan...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Créé en 2009 par Google
 Fra...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Une fonction JavaScript pour ...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Récupération des packages dan...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Créé en 2012 par Microsoft
 ...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Typage des variables
 Créati...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Inclus par défaut dans Visual...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Développé depuis 2011 par Apa...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Encapsulation dans un composa...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Type de projet spécifique
 D...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
Démo
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Application métier
 Applicat...
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
 Sessions
Pour en savoir plus…
tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
© 2015 Microsoft Corporation. All rights reserved.
tech days•
2015
#mstechdays techdays.microsoft.fr
Prochain SlideShare
Chargement dans…5
×

Frameworks JavaScript en environnement MS

499 vues

Publié le

Les technologies web sont en évolution constante et de nombreux frameworks JavaScript sont régulièrement créés afin de répondre à de nouveaux besoins. Dans sa stratégie d'ouverture, Microsoft intègre régulièrement les principaux framework dans ses outils.

Dans cette session, nous vous proposons de faire un tour d'horizon des frameworks les plus utilisés par la communauté Web: de KnockoutJS à AngularJS en passant par Bootstrap et Cordova. Puis nous verrons leurs intégrations dans Visual Studio.

Publié dans : Technologie
0 commentaire
2 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
499
Sur SlideShare
0
Issues des intégrations
0
Intégrations
4
Actions
Partages
0
Téléchargements
14
Commentaires
0
J’aime
2
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive
  • Sébastien (11h00)
  • Sébastien (11h00)
  • Sébastien (11h01)
  • Adrien (11h03)
  • Adrien (11h04)
  • Adrien (11h05)
  • Adrien (11h06)
  • Sébastien (11h09)
  • Sébastien (11h10)
  • Sébastien (11h11)
  • Sébastien (11h12)
  • Adrien (11h15)
  • Adrien (11h16)
  • Adrien (11h17)
  • Adrien (11h18)
  • Sébastien (11h21)
  • Sébastien (11h22)
  • Sébastien (11h23)
  • Sébastien (11h24)
  • Adrien (11h27)
  • Adrien (11h28)
  • Adrien (11h29)
  • Adrien (11h30)
  • Sébastien (11h33)
    Parler à l’oral de PhoneGap
  • Sébastien (11h34)
  • Sébastien (11h35)
  • Sébastien (11h36)
  • Adrien (11h39)
  • Adrien (11h40)
  • Frameworks JavaScript en environnement MS

    1. 1. AMBIENT INTELLIGENCE tech days• 2015 #mstechdays techdays.microsoft.fr
    2. 2. Frameworks JavaScript en environnement Microsoft – Etat des lieux Sébastien Ollivier Adrien Siffermann @SebastienOll sollivier@infinitesquare.com @asiffermann asiffermann@infinitesquare.com
    3. 3. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  TechDays News Feed  Dynamiser le rendu avec jQuery  Améliorer l’interface graphique avec Bootstrap  Profiter du binding Knockout.js  Créer une application avec AngularJS  Tirer parti du compilateur TypeScript  Publier une application mobile avec Cordova  Conclusion
    4. 4. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    5. 5. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Créé en Janvier 2006 par John Resig  Librairie JavaScript pour augmenter la productivité et assurer la compatibilité cross-browser  Avantages de jQuery Présentation
    6. 6. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Des sélecteurs pour parcourir le DOM  Des fonctions pour manipuler le DOM  Des fonctions pour travailler avec les évènements  Des outils pour travailler plus simplement en AJAX  Validation avec jQuery Validate Principes de base
    7. 7. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Intégré par défaut dans les projets Starter Web  Récupération des packages dans les projets  Intellisense JavaScript  Génération des attributs de validation avec les Helpers MVC Intégration dans Visual Studio
    8. 8. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    9. 9. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Créé en 2011 par Twitter  Framework CSS et JavaScript pour adapter vos sites à tous les types d’écrans  Avantages de Bootstrap Présentation
    10. 10. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Layout divisé en lignes de 12 colonnes  Positionnement via des classes CSS Principes de base
    11. 11. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Intégré par défaut dans les projets Starter Web  Récupération des packages dans les projets  Intellisense JavaScript  Intellisense CSS Intégration dans Visual Studio
    12. 12. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    13. 13. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Présentation  Créé en 2010 par Steve Sanderson (Microsoft)  Simplification des interfaces dynamiques avec le pattern Model- View-View Model (MVVM) en JavaScript  Avantages de Knockout.js
    14. 14. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Des attributs data-bind dans le layout HTML  Une fonction JavaScript pour le ViewModel Principes de base <p>Nom: <strong data-bind="text: firstName"></strong></p> function PersonViewModel() { this.firstName = "Sébastien"; } ko.applyBindings(new PersonViewModel());
    15. 15. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Récupération des packages dans les projets  Intellisense JavaScript  Détection des attributs data-bind  Intellisense dans les attributs data-bind Intégration dans Visual Studio
    16. 16. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    17. 17. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Créé en 2009 par Google  Framework MVC pour construire des Single Page Applications (SPA)  Avantages d’AngularJS Présentation
    18. 18. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Une fonction JavaScript pour le contrôleur  Des services sous forme de singleton  Des vues HTML avec du binding déclaratif Principes de base function ListController($scope, listService) { $scope.items = []; } angular.module("NewsfeedApp").controller("listController", listController); <ul data-ng-hide="isLoading"> <li data-ng-repeat="item in items"> <a href="#/items/{{item.Id}}">{{item.Title}}</a> </li> </ul>
    19. 19. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Récupération des packages dans les projets  Intellisense  Templates de projets  Templates d’éléments (controller, modules, directives…) Intégration dans Visual Studio
    20. 20. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    21. 21. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Créé en 2012 par Microsoft  TypeScript est un langage de programmation qui se transcompile en JavaScript afin d’améliorer et de sécuriser la production de code  Avantages de TypeScript Présentation
    22. 22. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Typage des variables  Création de classes, d’interfaces… Principes de base export class Item { constructor(id: number, label: string) { this.id = id; this.label = label; } public id: number; public label: string; }
    23. 23. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Inclus par défaut dans Visual Studio  Compilation  Intellisense  Erreurs de compilation Intégration dans Visual Studio
    24. 24. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    25. 25. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Développé depuis 2011 par Apache Fondation  Permet d’encapsuler une application Web dans une application native (WP, iOS, Android, …)  Avantages de Cordova Présentation
    26. 26. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Encapsulation dans un composant WebView de la plateforme cible  APIs JS permettant d’accéder aux APIs Native  Mécanismes de plugin pour enrichir Cordova (environ 700)  Permet d’inclure du code spécifique par plateforme dans les dossiers « merge » Principes de base
    27. 27. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Type de projet spécifique  Debug directement depuis Visual Studio  Intellisense des APIs Cordova Intégration dans Visual Studio
    28. 28. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux Démo
    29. 29. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Application métier  Application avec une interface plus dynamique (calculs côté client, données locales…)  Application cliente « pure » (navigation animée, cache local, offline…)  Application destinée à la fois au Web et au mobile Quel framework pour quel type de projet ?
    30. 30. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux  Sessions Pour en savoir plus…
    31. 31. tech.days 2015#mstechdaysFrameworks JavaScript en environnement Microsoft – Etat des lieux
    32. 32. © 2015 Microsoft Corporation. All rights reserved. tech days• 2015 #mstechdays techdays.microsoft.fr

    ×