
|
Applications web M1 Miage 2011-2012
De $1
Table des matières- 1. Introduction
- 2. Cours 1: Introduction et protocole HTTP
- 2.1. Petit rappel historique sur l'histoire de l'internet, du web, l'apparition du web 2.0, la suite...
- 2.2. Au coeur du web le protocole HTTP
- 2.3. TP 1: protocole HTTP, écriture d'un serveur web (TP noté, à rendre)
- 3.
Cours 2 : Servlets 2.x et 3.0, descripteurs web.xml et annotations
- 3.1. TP2 : Etude des servlets, descripteur web.xml, context listeners, etc
- 4. Cours 3 : Pages JSP "modernes", Java Standard Tag Library (JSTL), langage d'expressions Expression Langage (EL), principe de l'architecture en couches
- 4.1. TP3 : Etude d'une application mêlant architecture en couches, servlets, jsps, et persistence en XML
- 5. Cours 4 : étude de JPA première partie, utilisation d'une base de données et de techniques de mapping relationel/objet, stateless session beans
- 5.1. TP4 : application similaire au TP précédent mais utilisant JPA, stateless session beans, une base de données
- 6. Cours 5 : relations avec entity beans
- 6.1. TP5 : ajout de relations au TP précédent
- 7. Cours 6 : JavaScript/jQuery/Ajax
- 7.1. TP6 : prise en main de jQuery
- 8. Mini projet
- 1. Introduction1
- 2. Cours 1: Introduction et protocole HTTP2
- 2.1. Petit rappel historique sur l'histoire de l'internet, du web, l'apparition du web 2.0, la suite...
3
- 2.2. Au coeur du web le protocole HTTP4
- 2.3. TP 1: protocole HTTP, écriture d'un serveur web (TP noté, à rendre)5
- 3.
Cours 2 : Servlets 2.x et 3.0, descripteurs web.xml et annotations6
- 3.1. TP2 : Etude des servlets, descripteur web.xml, context listeners, etc7
- 4. Cours 3 : Pages JSP "modernes", Java Standard Tag Library (JSTL), langage d'expressions Expression Langage (EL), principe de l'architecture en couches8
- 4.1. TP3 : Etude d'une application mêlant architecture en couches, servlets, jsps, et persistence en XML9
- 5. Cours 4 : étude de JPA première partie, utilisation d'une base de données et de techniques de mapping relationel/objet, stateless session beans10
- 5.1. TP4 : application similaire au TP précédent mais utilisant JPA, stateless session beans, une base de données11
- 6. Cours 5 : relations avec entity beans12
- 6.1. TP5 : ajout de relations au TP précédent13
- 7. Cours 6 : JavaScript/jQuery/Ajax14
- 7.1. TP6 : prise en main de jQuery15
- 8. Mini projet16
Introduction
Il s'agit ici d'un cours qui se poursuit en M2 NTDP. Normalement vous avez du avoir des cours d'introduction aux technologies web pendant lesquels vous vous êtes familiarisés avec HTML, CSS, PHP et peut-être au développement d'applications web en Java. Ce cours va plus loin même s'il commence au tout début, c'est-à-dire avec l'étude du protocole HTTP. Mais vous verrez que rapidement on va aborder des concepts moins "basiques" que ceux que vous avez vus précédemment.
Cours 1: Introduction et protocole HTTP
Petit rappel historique sur l'histoire de l'internet, du web, l'apparition du web 2.0, la suite...
17
- Vidéo "histoire de l'internet de 1957 à nos jours", n'oubliez pas d'activer les sous-titres (petite flèche vers le haut, en bas à droite du lecteur) :
- Vidéo pour fêter l'anniversaire de Tim Berners Lee (anglais), linventeur du web, retrace à travers son parcours, l'histoire du Web : http://www.rocketboom.com/news-tim-berners-lee/18
- Le web et son futur19 par Fabien Gandon. Cette présentation est détaillée dans l'article suivant :Les débuts du web sous l'oeil du W3C20.
- Du Web aux wikis : une histoire des outils collaboratif22 (par Michel Buffa) : pour bien comprendre l'évolution du web vers le web 2.0 ou le "web social" que l'on connait aujourd'hui, cet article retrace les premiers pas de l'internet, la naissance du web et son évolution vers un web servant non pas à relier des documents entre eux, mais des personnes, des objets, etc.
- Principales caractéristiques du web 2.0 : cette vidéo détaille en réalité ce qu'a décrit Tim O'Reilly (l'inventeur du terme "web 2.0") dans son article fondateur de 200623 :
- Cette vidéo est également très "parlante" pour montrer cette évolution :
- Le web 3.0 (aussi appelé "web sémantique" ou "web de données"), super documentaire (anglais) : http://mashable.com/2010/05/10/seman...b-documentary/24
- Vidéo de Tim Berners Lee (anglais) pour le Ted's talk de février 2009, sur le "next web" : http://www.ted.com/talks/tim_berners..._next_web.html25
Au coeur du web le protocole HTTP
Le but de ce cours est d'offrir un panorama des différentes technologies qui seront traitées dans le cours. Mais aussi de bien comprendre le fonctionnement du protocole HTTP.
TP 1: protocole HTTP, écriture d'un serveur web (TP noté, à rendre)
28Cours 2 : Servlets 2.x et 3.0, descripteurs web.xml et annotations
TP2 : Etude des servlets, descripteur web.xml, context listeners, etc
Pour le moment, étude de ce qui se passe côté serveur. Ne vous inquiétez pas, nous verrons par la suite la partie "métier" (accès aux données, traitements, BD, etc) et la partie client ("pages html/ajax/ frameworks MVC) mais pour le moment, étudions quelques exemples de servlets + essayons de faire un petit projet.
Cours 3 : Pages JSP "modernes", Java Standard Tag Library (JSTL), langage d'expressions Expression Langage (EL), principe de l'architecture en couches
Les pages JSPs ont longtemps cohabité avec des Servlets, les pages JSP faisant office de "vues" là où les Servlets faisaient office de "contrôleurs HTTP". Les pages JSPs sont aujourd'hui remplacées avantageusement par divers frameworks, mais avant d'aborder l'étude de tels outils, voyons un peu comment on architecture un application web java en Model View Control d'une manière simple, à l'aide de JSPs et de Servlets. Au passage, voyons également comment apprendre à utiliser des pages JSPs sans faire d'horreurs (la tentation est grande !).
- Support de cours : JSPs.pptx31
- Support de cours en anglais sur JSTL/EL (EL à partir du transparent 31, JSTL à partir du 61), le reste n'est pas pertinent : jsp2.pdf32
- Support de cours utile pour le TP : un tutorial sur JAXB, la bibliothèque Java (standard, inclue dans le JDK) qui sert à sérialiser/déserialiser des objets Java vers XML ou JSON (format d'objets JavaScript que l'on manipulera dans quelques semaines) : http://www.vogella.de/articles/JAXB/article.html35
TP3 : Etude d'une application mêlant architecture en couches, servlets, jsps, et persistence en XML
Cours 4 : étude de JPA première partie, utilisation d'une base de données et de techniques de mapping relationel/objet, stateless session beans
TP4 : application similaire au TP précédent mais utilisant JPA, stateless session beans, une base de données
Cours 5 : relations avec entity beans
TP5 : ajout de relations au TP précédent
Cours 6 : JavaScript/jQuery/Ajax
- Cours JavaScript.zip41 : cours JavaScript de Michel Buffa (transparents HTML5 à ouvrir une fois l'archive sur votre machine, je ne les ai pas mis en ligne car c'est un cours sur lequel je travaille en ce moment). Ce cours couvre actuellement les bases de JavaScript, une grosse partie sur la programmation orientée objet (sans les Prototypes), JavaScript dans le navigateur web (BOM, DOM, évènements, AJAX). Revenez régulièrement voir si le cours a été complété.
- Transparents powerpoint sur jQuery : jquery.ppt42 et aussi la présentation interactive de John Resig, auteur de jQuery : http://ejohn.org/blog/spring-2010-jquery-talks/43 , la première "introduction to jQuery" est très bien pour un premier contact avec cette librairie.
- N'oubliez pas d'aller faire un tour sur la page : Ressources JQuery44 que j'ai préparée à votre attention et qui contient de nombreuses ressources intéressantes au sujet de cette librairie (tutorials, transparents, livres, etc). Je recommande à 200% d'imprimer ou d'avoir sous la main les "jQuery chart sheets", des images qui résument en un coup d'oeil toute la librairie.
- La page officielle avec la doc de jQuery (exemples interactifs) : http://api.jquery.com/45
- Les APIs JavaScript du DOM et du BOM ont énormément évolué avec HTML5, allez voir le tutorial HTML présenté récemment par un de vos enseignants à la conférence WWW 2012 : HTML5 Tutorial for WWW201246
TP6 : prise en main de jQuery
Notes de bas de page1 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Introduction 2 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Cours_1.3a_Introduction_et_protocole_HTTP 3 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Petit_rappel_historique_sur_l'histoire_de_l'internet.2c_du_web.2c_l'apparition_du_web_2.0.2c_la_suite... 4 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Au_coeur_du_web_le_protocole_HTTP 5 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#TP_1.3a_protocole_HTTP.2c_.c3.a9criture_d'un_serveur_web_(TP_not.c3.a9.2c_.c3.a0_rendre) 6 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Cours_2_.3a_Servlets_2.x_et_3.0.2c_descripteurs_web.xml_et_annotations 7 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#TP2_.3a_Etude_des_servlets.2c_descripteur_web.xml.2c_context_listeners.2c_etc 8 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Cours_3_.3a_Pages_JSP_.22modernes.22.2c_Java_Standard_Tag_Library_(JSTL).2c_langage_d'expressions_Expression_Langage_(EL).2c_principe_de_l'architecture_en_couches 9 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#TP3_.3a_Etude_d'une_application_m.c3.aalant_architecture_en_couches.2c_servlets.2c_jsps.2c_et_persistence_en_XML 10 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Cours_4_.3a_.c3.a9tude_de_JPA_premi.c3.a8re_partie.2c_utilisation_d'une_base_de_donn.c3.a9es_et_de_techniques_de_mapping_relationel.2fobjet.2c_stateless_session_beans 11 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#TP4_.3a_application_similaire_au_TP.c2.a0pr.c3.a9c.c3.a9dent_mais_utilisant_JPA.2c_stateless_session_beans.2c_une_base_de_donn.c3.a9es 12 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Cours_5.c2.a0.3a_relations_avec_entity_beans 13 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#TP5.c2.a0.3a_ajout_de_relations_au_TP_pr.c3.a9c.c3.a9dent 14 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Cours_6_.3a_JavaScript.2fjQuery.2fAjax 15 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#TP6_.3a_prise_en_main_de_jQuery 16 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012#Mini_projet 17 http://miageprojet2.unice.fr/../../../../Programme_des_enseignements/Applications_Web# 18 http://www.rocketboom.com/news-tim-berners-lee/ 19 http://www-sop.inria.fr/acacia/personnel/Fabien.Gandon/lecture/saint_louis_2007_02/seminar/ 20 http://interstices.info/jcms/c_41560/les-debuts-du-web-sous-l-il-du-w3c 21 http://www.w3.org/2004/Talks/w3c10-Overview/ 22 http://interstices.info/jcms/c_37151/du-web-aux-wikis-une-histoire-des-outils-collaboratifs?portal=j_97&printView=true 23 http://www.internetactu.net/2006/04/21/quest-ce-que-le-web-20-modeles-de-conception-et-daffaires-pour-la-prochaine-generation-de-logiciels/ 24 http://mashable.com/2010/05/10/semantic-web-documentary/ 25 http://www.ted.com/talks/tim_berners_lee_on_the_next_web.html 26 ../../../../@api/deki/files/69/=cours1.pdf 27 http://miageprojet2.unice.fr/Master_MIAGE_1/Applications_Web/TP1_Applications_web_M1_Miage_2010-2011_%3a_%c3%a9tude_du_protocole_HTTP 28 http://miageprojet2.unice.fr/../../../../Programme_des_enseignements/Applications_Web# 29 http://miageprojet2.unice.fr/@api/deki/files/1718/=Servlets.pptx 30 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web%2c_M1_Miage_2010-2011/TP2_%3a_Etude_des_servlets 31 http://miageprojet2.unice.fr/@api/deki/files/1730/=JSPs.pptx 32 http://miageprojet2.unice.fr/@api/deki/files/1731/=jsp2.pdf 33 http://miageprojet2.unice.fr/@api/deki/files/1732/=el.pdf 34 http://miageprojet2.unice.fr/@api/deki/files/1733/=jstl.pdf 35 http://www.vogella.de/articles/JAXB/article.html 36 http://miageprojet2.unice.fr/Master_MIAGE_1/Applications_Web/TP3_%3a_Jsp_%2f%2f_JSTL_%2f%2f_EL_%2f%2f_Servlets_et_architecture_en_couches 37 http://miageprojet2.unice.fr/@api/deki/files/1739/=IntroAuxEntityPart1.pptx 38 http://miageprojet2.unice.fr/Master_MIAGE_1/Applications_Web/TP7_Applications_web_%3a_utilisation_d'une_base_de_donn%c3%a9es 39 http://miageprojet2.unice.fr/@api/deki/files/1742/=IntroAuxEntityPart2.ppt 40 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web%2c_M1_Miage_2010-2011/Gestion_des_relations_avec_JPA 41 http://miageprojet2.unice.fr/@api/deki/files/1781/=Cours_JavaScript.zip 42 http://miageprojet2.unice.fr/@api/deki/files/1782/=jquery.ppt 43 http://ejohn.org/blog/spring-2010-jquery-talks/ 44 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Option_web_2.0_Master_1_informatique_2011/Ressources_JQuery 45 http://api.jquery.com/ 46 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/HTML5_Tutorial 47 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Option_web_2.0_Master_1_informatique_2011/TP_jQuery 48 http://miageprojet2.unice.fr/Intranet_de_Michel_Buffa/Applications_web_M1_Miage_2011-2012/M1_Miage_2011-2012_Mini_projet
|