dÉveloppement web · 2018. 3. 7. · mvc web j2ee . sommaire . chapitre 0 : la formation 4...
TRANSCRIPT
-
DÉVELOPPEMENT WEB ET DESIGN PATTERN
-
PIERRE JEAN INGÉNIEUR DE RECHERCHE
LGI2P – TIC & SANTÉ – EUROMOV
[email protected] http://pierrejean.wp.imt.fr/
-
1. PRINCIPES
2. WEB
3. MVC WEB J2EE
SOMMAIRE
-
CHAPITRE 0 : LA FORMATION 4
L’objectif est la base du développement web MVC J2EE
2 cours + 6 TPs sur ordinateur
Projet individuel en temps limité
A voir : ► Serveur Web et URL ► HTML / CSS / JSON ► Servlet et debugger sur Tomcat ► JSP et MVC ► Test unitaires et Loggeur ► Javascript ► Couche de persistance
-
CHAPITRE 1 : PRINCIPES 5 Réseau TCP-IP et Adresses IP
Réseau adresses IP ipconfig /all
Boucle locale 127.0.0.1 localhost
-
CHAPITRE 1 : PRINCIPES 6 DNS et résolution de noms
Top level DNS
nslookup
Zone DNS
-
CHAPITRE 1 : PRINCIPES 7 Communication asynchrone
http://www.example.com/index.html
Outils de développements du navigateur
-
CHAPITRE 1 : PRINCIPES 8 URL = Uniform Ressource Locator et DocumentRoot
Ordinateur D:\wamp\ www\ rep1\srep12\ page4.html URI file://d:/web/www/rep1/srep12/page4.html
URL http://www.test.fr/rep1/srep12/page4.html Serveur Web Sites www/ rep1/srep12/ page4.html
-
CHAPITRE 1 : PRINCIPES 9 HTML / CSS / Image
-
CHAPITRE 1 : PRINCIPES 10 Architecture 3-tiers
Http Get Post SQL
Variables/Objets html
Ajax
json
-
CHAPITRE 2 : WEB DYNAMIQUE 11
Fabrique du HTML + Css + javascript ► Fabriquer depuis un serveur Web ► A partir d’un langage de
programmation ► Généré à la demande ► HTML / CSS + Javascript inline ► CSS / SASS ► Javascript / Framework JS
-
CHAPITRE 1 : PRINCIPES 12 HTML5
► https://validator.w3.org/ ► ► Code source + inspecteur DOM ► Tags imbriqués
-
CHAPITRE 2 : WEB DYNAMIQUE 13
Http Get Post Programmes
Variables/Objets html
Ajax
json
-
CHAPITRE 2 : WEB DYNAMIQUE 14 Génération du HTML depuis un programme et un serveur Web
exécution par le Serveur Web
Le navigateur de l’internaute demande
l’URL suivante http://localhost/index.php
-
CHAPITRE 2 : WEB DYNAMIQUE 15 Génération du HTML depuis un code Java/JSP
-
CHAPITRE 2 : WEB DYNAMIQUE 16 Formulaire GET/POST
http://localhost/test.php?Nom=Jean&Civ=Mr&go=go
Votre Nom: Mr: Mme:
-
CHAPITRE 2 : WEB DYNAMIQUE 17 Formulaire GET/POST
-
CHAPITRE 2 : WEB DYNAMIQUE 18 Récupération des valeurs côté serveur en PHP
test.php
$_REQUEST["Nom"] $_REQUEST["Civ"] $_REQUEST["Valider"]
http://localhost/test.php?Nom=Jean&Civ=Mr&Valider=ok
-
CHAPITRE 2 : WEB DYNAMIQUE 19 Récupération des valeurs côté serveur en Java
http://localhost/test.php?Nom=Jean&Civ=Mr&Valider=ok
request.getParameter("Civ") request.getParameter("Nom") request.getParameter("Valider")
-
CHAPITRE 2 : WEB DYNAMIQUE 20 Session utilisateur
-
CHAPITRE 2 : WEB DYNAMIQUE 21 Différence Servlet / JSP
ma première jsp Bonjour
-
CHAPITRE 2 : WEB DYNAMIQUE 22 Différence Servlet / JSP
import java.io.*; import javax.servlet.*; import javax.servlet.http.*; public class HelloWorldExample extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException{ response.setContentType("text/html"); PrintWriter out = response.getWriter(); out.println(""); out.println("première servlet"); out.println("bonjour"); out.println( request.getParameter("nom")); out.println(""); out.println(""); } }
-
CHAPITRE 2 : WEB DYNAMIQUE 23 Architecture du projet
► Servlet Contrôleur ► Data Access Object ► Classes Métier ► Dossiers css / img ► Jars spécifique au projet ► Pages JSPs
-
CHAPITRE 2 : WEB DYNAMIQUE 24 Architecture du projet
-
CHAPITRE 2 : WEB DYNAMIQUE 25 Automate à état avec la variable action
String action = request.getParameter("action"); if ("addTodo".equals(action)) { String texte = request.getParameter("todo_texte"); Application.getInstance().addTodo(texte, false); vue = "index.jsp"; } if ("delTodo".equals(action)) { String idTodo = request.getParameter("todo_id"); Application.getInstance().deleteTodo( idTodo ); vue = "confirm.jsp"; } request.getRequestDispatcher( vue ).forward(request, response);
-
CHAPITRE 2 : WEB DYNAMIQUE 26 CSS
-
CHAPITRE 2 : WEB DYNAMIQUE 27 CSS link, inline, CSS éditeur, CSS Zen Garden
-
CHAPITRE 3 : EXTENSIONS 28
-
CHAPITRE 3 : JAVASCRIPT 29 Javascript, executé dans le navigateur
Javascript version Vanilla (sans framework JS)
-
CHAPITRE 3 : FORMAT JSON 30 En remplacement du XML
var textJson = '{ "employees" : [' + '{ "firstName":"John" , "lastName":"Doe" },' + '{ "firstName":"Anna" , "lastName":"Smith" },' + '{ "firstName":"Peter" , "lastName":"Jones" } ]}'; var employeList = JSON.parse( textJson );
-
CHAPITRE 3 : JAVASCRIPT 31 Javascript version Jquery
$( "recherche d’un element dans le DOM" )
-
CHAPITRE 3 : AJAX 32 En arrière plan appel à une URL
-
CHAPITRE 3 : TEST UNITAIRE 33 Junit
Class TodoTest
Class Todo
-
CHAPITRE 3 : SYSTÈME DE LOG 34 Log4j
Criticité de Log
► Debug ► Info ► Warm ► Error ► Fatal Log vers Console
-
CHAPITRE 3 : ORM 35 Hibernate
-
Diapositive numéro 1Diapositive numéro 2sommaireChapitre 0 : la formationChapitre 1 : PRINCIPESChapitre 1 : PRINCIPESChapitre 1 : PRINCIPESChapitre 1 : PRINCIPESChapitre 1 : PRINCIPESChapitre 1 : PRINCIPESChapitre 2 : WEB DYNAMIQUEChapitre 1 : PRINCIPESChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 2 : WEB DYNAMIQUEChapitre 3 : ExtensionsChapitre 3 : JavascriptChapitre 3 : format jsonChapitre 3 : javascriptChapitre 3 : AJAXChapitre 3 : Test unitaireChapitre 3 : Système de logChapitre 3 : ORMDiapositive numéro 36