Les technologies web client

739 vues

Publié le

A french presentation about client-side web technologies

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

Aucun téléchargement
Vues
Nombre de vues
739
Sur SlideShare
0
Issues des intégrations
0
Intégrations
6
Actions
Partages
0
Téléchargements
7
Commentaires
0
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Les technologies web client

  1. 1. Le web de demainDe zéro à héros – Côté clientPar Freyburger Romain et Quentin Sallat
  2. 2. Feedback• Please provide feedback• http://goo.gl/FXsYw
  3. 3. Sommaire• Hier, aujourd’hui, demain• La famille Jquery• L’indispensable Modernizr• L’Artillerie lourde : GWT• Coffeescript et Dart• MVVM/MVC avec Batman.js et Knockout.js• Et les RIA ?
  4. 4. Le Javascript : hier• LiveScript
  5. 5. Le Javascript : aujourd’hui• AJAX
  6. 6. Le Javascript : demain• One platform to rule them all
  7. 7. Les défis du web de demain• Productif• Cross-browser• Mobile• Performant
  8. 8. La famille JQuery
  9. 9. Avant JQuery• Prototype : ancêtre de JQuery• Scriptaculous• Ajax à la main
  10. 10. Jquery c’est quoi ?• Framework Javascript open-source• Relativement léger• Nombreuses fonctionnalités• Nombreux plug-ins
  11. 11. A quoi ça sert ?• Sélecteurs• Effets• Manipulation DOM/CSS• AJAX• Parser json• …
  12. 12. Et les enfants…• Jquery UI • Nouveaux effets • Contrôles UI : calendrier, fenêtres, progressbar… • Gestionnaire de thème• Jquery mobile • Adapté aux applications web mobiles • Léger • Large compatibilité • Transitions, style, AJAX…
  13. 13. L’indispensable Modernizr• Framework Javascript très répandu• Détecte la compatibilité html5/CSS 3• Compatibilité html5 avec les vieux navigateurs (sémantique)• Chargement de ressources à la volée• Personnalisable
  14. 14. Démo Modernizr ?
  15. 15. L’artillerie lourde : GWT• Google Web Toolkit• Puissant framework de développement web• Compilation Java ->HTML/CSS/Javascript• Cross-browser• Ultra productif
  16. 16. Démo GWT
  17. 17. Coffeescript et Dart• Langages de substitution au Javascript• Censés être plus productifs• Orientés objet
  18. 18. Coffeescript• Open-source• Ressemble au Python• Compilation en Javascript (serveur ou à la main)• Disponible sur Github• https://github.com/jashkenas/coffee-script
  19. 19. Dart• Créé par Google• Compilation en Javascript (serveur ou à la main)• Compilation client sur Google Chrome• Se veut être un remplaçant du Javascript• Plus performant
  20. 20. Démo : Coffeescript
  21. 21. MVVM/MVC avec Batman.js et Knockout.js• MVVM : Model-View-ViewModel• Ressemble à MVC• Principe du binding• Surtout présent en .NET• Maintenant en Javascript !
  22. 22. Batman.js• Open-source• Créé en coffeescript• Orienté objet• Architecture MVC
  23. 23. Knockout.js• Architecture MVVM• Système de templates• Orienté objet• Améliore la productivité
  24. 24. Démo Knockout.js
  25. 25. Et les RIA ?• Flash et Silverlight : technologies mortes ?• HTML 5 introduit video, audio et canvas• Support du offline• HTML 5 multi-plateformes de base
  26. 26. Flash• Enorme communauté• Designers-friendly• Quasi-omniprésent dans le jeu en ligne• 3D ultra-poussée
  27. 27. Silverlight• Ultra-productif• Enterprise-ready• Grosse communauté• Smooth Streaming• Windows Phone 7/Windows 8/XBOX
  28. 28. Bien démarrer votre projet web• Choix du langage : Javascript, Coffeescript, Dart, GWT…• Jquery et Modernizr• Plug-ins Jquery/autres librairies suivant les besoins• Architecture MVC ou MVVM (Knockout.js/Batman.js/Autres)
  29. 29. Conclusion• Javascript peu productif de base• Devient intéressant avec des librairies• Langage du futur• Compétence obligatoire du dev de demain
  30. 30. Merci !

×