Vous êtes sur la page 1sur 6

09/11/2010

MIF13 Programmation Web


OUTILS DAIDE LA CONCEPTION DAPPLICATIONS WEB
LIONEL MDINI SEPTEMBRE-DCEMBRE 2010

Objectif de ce cours
Prendre conscience de lexistence de nombreux outils daide au dveloppement Web
ne plus dvelopper from scratch gagner du temps se placer dans des conditions relles de conception

Savoir les catgoriser


langages / environnements de dveloppement fonctionnalits proposes [in]/compatibilits

Prsentation [relativement] dtaille de certains dentre eux Savoir choisir un outil adapt aux besoins dune application Remarques
Liste ncessairement non exhaustive Prsentations ncessairement succinctes

Plan du cours
Bibliothques et frameworks
Principe de linversion de contrle Diffrence entre bibliothques et frameworks

Inversion de contrle
Principe gnral
Une application (Web) complexe fait ncessairement appel du code externe pour grer des services non mtier
scurit persistance

Aperu des outils


Bibliothques Web
Bibliothques de composants Bibliothques AJAX

Frameworks Web
MVC Conteneurs lgers Conteneurs lourds

Qui contrle le flot dexcution dune application ?


votre code un des outils que vous utilisez

Autres types doutils Web applicatifs


CMS Portlets APIs des applis Web connues

En programmation classique
Do provient le main ?

Conclusion

En MVC
Qui dirige le contrleur ?

Inversion de contrle
Diffrence bibliothque / framework
Bibliothque Code de lapplication

Aperu des outils


La rutilisation comme principe gnral de conception
Mme dmarche quen conception classique
AWT, Swing

Flot dexcution

Flot dexcution

Spcificit des outils Web


Framework

Code de lapplication

Bibliothque

Code de lapplication

Nombreux Htrognes Notion de framework plus rpandue

Problmatique : quel(s) outil(s) choisir ?

Bibliothque

Code de lapplication

Remarque : dans la littrature, on trouve lappellation framework pour beaucoup de choses qui nen sont pas

09/11/2010

Bibliothques Web
But
Ensemble de composants pour raliser une ou plusieurs fonctionnalits

Bibliothques Web
Bibliothques de services ct serveur
Persistance
Java : non spcifiquement ddi au Web ORMs, JPA PHP : bibliothques de code MySQL Flat-file SQL

Spcificits de la plupart des bibliothques ddies au Web


Ddies la couche interface Ddies aux communications AJAX Services spcifiques aux serveurs Web (scurit)

Scurit
Java : WebCastellum

Choix dune bibliothque


Diffusion / adoption par une communaut Adapte aux autres outils utiliss Doit tre transparent pour lutilisateur

Authentification
Java : JGuard (bas sur JAAS) ; JXplorer (support LDAP) PHP : PHP OpenID Library

Compilateurs JavaScript

Bibliothques Web
Bibliothques dinterface
Tags JSP
JSF

Bibliothques Web
Bibliothques AJAX
Bibliothques directes
Bibliothques de fonctions JavaScript pour faciliter le codage Peu structures, ne sont utilisables que pour de petites applications ventuellement, des outils ct serveur facilitant la gnration de pages lies ces bibliothques Ncessitent davoir une vue claire de lapplication Exemples Gnriques : Jquery, SAJAX, DHTMLX, Fleejix.js, JsHTTPRequest, My Library Java : JSP Tags Library PHP : XAJAX, PhpLiveX .Net : DotNetRemoting Rich Web Client SDK for ASP.NET , ASP.Net AJAX

Templates de sites
Prsentation basique De moins en moins utilises (au profit de CSS) Composants de pages Gnrs dynamiquement Exemples : tableaux de donnes, formulaires, menus

JavaScript
Composants dinterface Composants de programmation Tri, organisation, ajout, transformation XSLT

Bibliothques Web
Bibliothques AJAX
Bibliothques indirectes
Ddies un langage de programmation Utilisent un compilateur pour gnrer du JavaScript Programmation plus claire / propre quavec plusieurs langages Code gnr ct client non matris Exemples Java
DWR, GWT, IceFaces

Bibliothques Web : Exemple


Google Web Toolkit
Prsentation
Bibliothque de composants et de gnration dapplications Web Bibliothque de composants de communication HTTP asynchrone Compilateur Java JavaScript Existence dune bibliothque dextensions : GWTexT

Remarque
Sutilise plutt comme une API de dveloppement dapplications classiques que Web-based

Python
Pyjamas

Site Web
http://code.google.com/webtoolkit/

.Net
ASP.Net AJAX

JavaDoc
http://google-web-toolkit.googlecode.com/svn/javadoc/1.6/index.html

09/11/2010

Frameworks Web
Remarque prliminaire
Un serveur Web est dj un framework en soi

Frameworks Web
Fonctionnalits proposes
Scurit
Authentification, gestion des droits, des rles, limitation des accs

Un framework Web est une couche dabstraction supplmentaire par rapport au serveur
Il doit apporter une valeur ajoute supplmentaire
Pattern MVC Orient-AJAX Prise en charge daspects (services) annexes : Transactions, scurit, communication avec des objets distants philosophie particulire : Ddi la GED, la communication entre utilisateurs, lducation

Interfaces avec les BD


Dispense davoir crire du code spcifique une base (API standardises, ORM, transaction, migration de versions)

Rcriture dURLs
Permet dviter les URL CGI Ex. : /page.cgi?cat=science&topic=physics /page/science/physics

Templates (modles) Web


Structure des pages qui reviennent rgulirement Ex. : tableaux de donnes, graphiques, etc.

Il doit tre ncessaire pour la ralisation du cahier des charges

Frameworks Web
Fonctionnalits proposes
Ajax Configuration automatique
Utiliser lintrospection pour gnrer des lments de pages ou de la logique mtier Ex. : intgrer un ORM capable de persister directement des objets

Frameworks Web MVC


Problmatique
Structurer lensemble des servlets et JSP dune application Organiser le flot de contrle de lapplication

Historique de la structuration dapplications


Modle 1 : des JSP dans tous les sens Modle 2 : des servlets pour contrler le flot, des JSP pour les traitements Modle MVC push-based Modle MVC pull-based

Services Web
Gnrer des sorties sous forme de services Web entre les couches application et vue Souvent lie lexistence dun moteur de templates

Source
http://struts.apache.org/1.x/userGuide/introduction.html

Frameworks Web MVC


Diffrents types de frameworks
Push-based
Un contrleur qui utilise des actions pour calculer les contenus Ces contenus sont pousss la couche vue Exemples Java : Struts, Python : Django Ruby : Ruby on Rails PHP : Symfony, CakePHP .Net : ASP .Net MVC

Frameworks Web MVC


Diffrents types de frameworks
Pull-based (ou component-based)
La vue tire les contenus de plusieurs contrleurs ddis des tches spcifiques Plusieurs contrleurs utilisent des actions peuvent participer la cration dune seule vue Cf. contrleurs de cas dutilisation Exemples Java : Struts2, Tapestry, JBoss Seam Python : Zope .Net : DotNetNuke

09/11/2010

Frameworks Web MVC


Comparatif des frameworks Web
http://en.wikipedia.org/wiki/ Comparison_of_web_application_frameworks

Frameworks MVC : exemple


Struts
Prsentation
Framework MVC de type 2 Origine : Mai 2000, Craig R. McClanahan URL : http://struts.apache.org/ Javadoc : http://struts.apache.org/1.x/struts-core/apidocs/

Contenu
Un contrleur principal et des contrleurs dlgus Une bibliothque de tags JSP spcifique Un outil de gestion des formulaires mapping formulaires / objets Java validation des formulaires Moteur de templates (Tiles)

Frameworks MVC : exemple


Struts
Contrleur
ActionServlet (contrleur gnral) : intercepte les requtes et les dispatche en fontion des URL (fichier struts-config.xml) vers les actions correspondantes Actions (contrleurs dlgus) : grent la communication avec le modle et renvoient les rsultats la vue

Frameworks MVC : exemple


Struts
Architecture de Struts 1

Modle
Nimporte quelles classes connues par les actions (POJO) JavaBeans : standardisent les proprits accdes par la vue

Vue
La plupart du temps, des JSP qui affichent le rsultat des traitements du modle Peuvent tre tendues : JSF, AJAX, etc.
Source : http://www.vaannila.com/images/struts1/ MvcArchitecture.gif

Autres types doutils Web applicatifs


Systmes de gestion de contenus (CMS)
Outils collaboratifs gestion des utilisateurs Outils de gestion lectronique de documents (GED) moteur de workflow support de stockage et de publication de diffrents types de contenus templates de pages et diteurs WYSIWYG Modules divers en fonction de la finalit du framework Exemples
PHP : SPIP, PHP-Nuke, Joomla! Python : Plone Java : OpenCMS, AlFresco

Autres types doutils Web applicatifs


Outils base de portlets / widgets
Principe : juxtaposer plusieurs contenus issus dapplications diffrentes dans la mme interface Web Souvent associ la notion de portail Exemple : le portail tudiant de luniversit, IGoogle, NetVibes Technologies
Java : WSRP (JSR 168 et 286) PHP : PhpPortlet

09/11/2010

Autres types doutils Web applicatifs


APIs dapplications Web externes
Principe : interfacer son application avec une plus connue Nombreux exemples dans le Web 2.0 : Google (Calendar, Mail, Wave), FaceBook, YouTube, Ebay Un moyen rapide damliorer vos applications Permet dattirer des utilisateurs Ne doit pas vous faire perdre de vue la finalit initiale de votre application Liste de 600 API disponibles (octobre 2009) http://www.programmableweb.com/apis/directory

Conclusion
La rutilisation comme principe gnral de conception
Objectif : limiter le plus possible les dveloppements la logique mtier Spcificits des outils Web
peut-tre le domaine le plus explor et o il y a le plus doutils disponibles volution rapide des technologies (et des modes) Cependant, de nombreuses technos lintrieur dune mme application Autant de fonctionnalits pour lesquelles trouver des outils

Conclusion
La rutilisation comme principe gnral de conception
Slectionner les outils disponibles
Un framework Des bibliothques

Conclusion
La rutilisation comme principe gnral de conception
Vrifier la compatibilit
Entre les outils Avec les navigateurs Avec les autres systmes avec lesquels vous voulez vous interfacer

en fonction de vos besoins


Ncessite davoir correctement spcifi les besoins et ralis le travail danalyse

valuer le travail dintgration

Conclusion
Choix dun framework
Identifier le gain : services proposs / lourdeur de loutil Sattacher la finalit dun framework et non ce que lon peut faire avec
Les utilisateurs peuvent tre perdus par une utilisation non standard dun outil

Conclusion
Modularit : penser composants ds les spcifications
Prcision de la phase de conception et danalyse (cahier des charges) Rechercher lexistant avant de dvelopper (bibliothques disponibles) Si linterface dune bibliothque ne correspond pas vos besoins :
Pouvez-vous / devez-vous modifier vos specs ? ventuellement, utiliser un pattern adapter Sinon, le produit est-il fait pour vous ?

volutivit des solutions proposes


Penser lvolution de votre application Passage lchelle Nouveaux services Intgration de technologies futures

09/11/2010

Conclusion
Modularit : penser composants ds les spcifications
Utiliser des solutions standard
Surtout si vos applications sinsrent dans un SI existant et si dautres peuvent devoir sinterfacer avec Prvoir la possibilit de changer radicalement dinterface RIA / RDA Adaptation aux navigateurs / terminaux mobiles Services Web Web 2.0 et 3.0

Conclusion gnrale
Tendances actuelles du Web
Social Collaboratif Smantique (y compris dans les contenus non textuels)

Web hautement dynamique et communication


VOD Communication quasi-synchrone (RSS, Twitter) Webconfrence

Mobilit
Plateformes mobiles Services golocaliss (cartogrtaphie, retrouver ses amis) Utilisation des capacits des tlphones mobiles (GPS, lecture de codesbarre)

Source principale : JDN, 2009

Conclusion gnrale
Tendances actuelles des technologies Web (HTML5)
Standards quasiment matures Mise en forme avance Prise en charge native de nombreux types de contenus Interaction dynamique avec ces contenus Capacit dinteraction de lutilisateur amliore

Rfrences
Rfrences utilises pour ce cours
Bibliothques et frameworks
Gnral http://sourceforge.net/softwaremap/index.php http://en.wikipedia.org/wiki/Web_application_framework Listes et comparatif doutils http://en.wikipedia.org/wiki/Comparison_of_web_application_ frameworks http://java-source.net/open-source/content-managment-systems Tendances http://www.journaldunet.com/ebusiness/le-net/dossier/lestendances-du-web-en-2009/vers-un-marche-de-l-internetmobile.shtml

Sources principales : TPAC, MeetUp 2010 Quelques exemples


http://www.youtube.com/watch?v=OxoFcyKYwr0 http://people.opera.com/howcome/2010/forms/ http://www.youtube.com/watch?v=EdDc7sWjCL4

Rfrences
Rfrences utilises pour ce cours
Bibliothques et frameworks
Spcifiques OpenID : https://openid.pbworks.com/Libraries LDAP : http://en.wikipedia.org/wiki/List_of_LDAP_software AJAX : http://en.wikipedia.org/wiki/Ajax_framework http://chandlerproject.org/Projects/AjaxLibraries http://ajaxpatterns.org/Java_Ajax_Frameworks http://ajaxpatterns.org/PHP_Ajax_Frameworks Outils spcifiques Struts : http://struts.apache.org/primer.html http://blog.lecacheur.com/2004/11/03/struts-unframework-mvc2-pour-vos-webapp-j2ee/