Applications web M1 Miage 2011-2012

Pages récentes

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

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/
Le web et son futur par Fabien Gandon. Cette présentation est détaillée dans l'article suivant :Les débuts du web sous l'oeil du W3C.
- Les présentations des 10 ans du W3C, en anglais.
Du Web aux wikis : une histoire des outils collaboratif (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 2006 :
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/
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.html

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.

Les transparents: cours1.pdf

TP 1: protocole HTTP, écriture d'un serveur web (TP noté, à rendre)

TP1 Applications web M1 Miage 2011-2012 : étude du protocole HTTP

Cours 2 : Servlets 2.x et 3.0, descripteurs web.xml et annotations

Support de cours : Servlets.pptx

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.

TP2 : Etude des servlets

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.pptx
Support de cours en anglais sur JSTL/EL (EL à partir du transparent 31, JSTL à partir du 61), le reste n'est pas pertinent : jsp2.pdf
- Autres supports en français : el.pdf et jstl.pdf
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.html

TP3 : Etude d'une application mêlant architecture en couches, servlets, jsps, et persistence en XML

TP3 : Jsp / JSTL / EL / Servlets et architecture en couches

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

IntroAuxEntityPart1.pptx

TP4 : application similaire au TP précédent mais utilisant JPA, stateless session beans, une base de données

TP Applications web : utilisation d'une base de données

Cours 5 : relations avec entity beans

IntroAuxEntityPart2.ppt

TP5 : ajout de relations au TP précédent

Gestion des relations avec JPA

Cours 6 : JavaScript/jQuery/Ajax

Cours JavaScript.zip : 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.ppt et aussi la présentation interactive de John Resig, auteur de jQuery : http://ejohn.org/blog/spring-2010-jquery-talks/ , 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 JQuery 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/
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 WWW2012