La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

Architecture et Développement Web

Présentations similaires


Présentation au sujet: "Architecture et Développement Web"— Transcription de la présentation:

1 Architecture et Développement Web
Développement php-mysql et java 30 heures de cours-tp environs 5 Chapitres

2 INTRODUCTION Présentation des formateurs Objectifs du cours
Structure du cours Les questions

3 Structure du cours Les bases du développement web
L'approche par script avec Php Le modèle Model-Vue-Controleur La réponse de Java

4 Les outils Editeur de texte ou Dreamweaver
Le serveur apache 1.3.x d'EasyPhp Le module php d'EasyPhp Le SGBD Mysql d'EasyPhp Jbuilder et le JDK 1.4.2

5 La sauvegarde des données:
Attention l'utilisation des ordinateurs en réseau obligent une sauvegarde spécifiques des données: Les bases de données Mysql Les données Html et Php Les fichiers de configurations spécifiques

6 Les informations de configuration 1/2
Httpd.conf DocumentRoot "D:/Apache/htdocs" <Directory /> Options FollowSymLinks AllowOverride None </Directory> Php.ini ( <? Phpinfo(); ?>

7 Les informations de configuration 2/2
Httpd.conf <Directory "D:/Apache/htdocs"> Options Indexes FollowSymLinks MultiViews AllowOverride None Order allow,deny Allow from all </Directory> My.ini [mysqld] basedir=D:/mysql/ datadir=Z:/mysql-data/

8 Base de l'architecture Le protocole TCP/IP La publication HTML
Le serveur Apache Le Web dynamique CGI et scripts Les serveurs d'applications

9 Le protocole TCP/IP Transmissions d'informations par paquets
Chaque paquet à l'adresse expéditeur et destinataire Publication publique de documents: le Web Transmission de données par FTP Support de commandes Telnet Le mail, les News et l'ICQ P2P (Napster, Morpheus, Edonkey,etc) L'hébergement et le FAI

10 Historique d'Internet 1969 Arpanet sous l'impulsion du DoD
1972 Meta réseau, armée, industries, universités 1982 Europe 1984 Départ du DoD Intro

11 Client/Serveur et Web Connexion Forte Echange de données Serveur
+La perte de connexion est signalée +La perte d'informations est faible +La vitesse est adaptée -Le client et le serveur sont connus -La connexion est coûteuse en ressource -Le client est lourd ( logiciels spécifiques ) Client Serveur Echange de données +Le transfert sur de longues distances +La connexion est peu coûteuse +Le client est léger +Le client est international -L'identification est peu fiable -la déconnexion est permanente -La perte de données est possible -Le client n'est pas identifiable Intro ?

12 Le Web : échange d'informations
Requête URL: Unified Ressource Locator Navigateur Serveur Web nom: www sous domaine: test domaine: com fichier: index.html <HTML><HEAD>...<HEAD><BODY> ... </BODY></HTML> Intro

13 HTML Hyper Text Markup Language HTML interprété par le navigateur
Normé par le W3C Language de présentation de l'information Les Tags Ouverture/Fermeture du Tag Navigateur pas toujours compatible avec la norme <HTML> <HEAD>Yahoo<HEAD> <BODY> <IMG SRC=  "logo.gif"> Yahoo </BODY> </HTML> Intro

14 Structure d'une page HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> ... </HEAD> <BODY> ... </BODY> </HTML> <!-- le commentaire --> Intro

15 Tag HTML:exemples Dans le <head>
<TITLE>Le titre de la page </TITLE> <meta tag name="keywords" content="mots"> Dans le <body> <H1>Titre1</H1> <H2>Titre2</H2> <CENTER> A centrer </CENTER> <P> un paragraphe </P> Intro

16 Tag HTML Imbrications des tags
<center><b>Centrer&gras</b></center> Tag solitaire <BR> ou <HR> Attributs de tag <p align="right">Paragraphe</p> <IMG SRC="monimg.gif" ALT="Image"> <A HREF="in.html" TARGET="_"> Target ="_blank"|"_parent"|_"self"|"_top"| frame Intro

17 Tag HTML: tableaux <TABLE border="1">
<CAPTION>le titre</CAPTION> <TR><TH>Ref</TH><TH>€</TH></TR> <TR><TD>az5</TD><TD>4</TH></TR> <TR><TD>er5</TD><TD>7</TH></TR> <TR><TD>yv2</TD><TD>1</TH></TR> </TABLE> Ref az5 4 er5 7 yv2 1 Intro

18 Formulaire GET et POST 1/3
<FORM NAME='T' ACTION='test.php' METHOD='POST' > <INPUT TYPE='text' NAME='Nom'> <INPUT TYPE='radio' NAME= 'Civ' VALUE='Mr'> <INPUT TYPE='radio' NAME= 'Civ' VALUE='Mme'> </FORM> Bonjour: Serveur web Nom: Mr Mme OK

19 Formulaire GET et POST 2/3
<FORM Name="Login" Method="GET" Action="login.php"> <INPUT Type="text" Name="Nom" Value="Entrez votre nom"> <INPUT Type="hidden" Name="idsession" Value="367821"> <INPUT Type="radio" Name="Civ" Value="M"> <INPUT Type="radio" Name="Civ" Value="Mme"> <INPUT Type="Submit" Name="Action" Value="login"> </FORM>

20 Formulaire GET et POST 3/3
<FORM Name="Login" Method="GET" Action="test.php"> <INPUT Type="checkbox" Name="Diplome" Value="Bac"><INPUT Type="checkbox" Name="Diplome" Value="Bac+4"><INPUT Type="checkbox" Name="Diplome" Value="Bac+5"> <SELECT Name="Langues" Multiple> <OPTION Value="US">Anglais</OPTION> <OPTION Value="ES">Espagnol</OPTION> <OPTION Value="ES">Allemand</OPTION> </SELECT> <TEXTAREA Name="Info"></TEXTAREA> <INPUT Type="Submit" Name="Action" Value="Envoyer"> </FORM>

21 De l'URL à l'Information Virtualisation du serveur Web représentant une arborescence URL: Pages HTML Serveur Web Répertoires Site(s) Requête Ordinateur Disque Répertoires Fichiers URI: file://d:/web/wwwroot/site1/rep1/srep12/page4.html

22 Côté serveur Soit simple recopie du fichier HTML vers le navigateur ayant demandé cette page Soit scripts et autres programmes côté serveur Serveur Web avec option Php Requête Script en Php <HTML><HEAD>Yahoo<HEAD> <BODY> <IMG SRC=  "logo.gif"> Yahoo </BODY></HTML>

23 Web dynamique 1/3 $_POST("Nom") $_POST("Civilité") $_POST("Valider")
<HTML>...<BODY> <FORM NAME="Inscription" METHOD="GET/POST" ACTION= "inscription.php"> <INPUT TYPE="Text" NAME="Nom" VALUE=""> <INPUT TYPE="Radio" NAME= "Civilité" VALUE="Mr"> <INPUT TYPE="Radio" NAME= "Civilité" VALUE="Mdme"> <INPUT TYPE="Submit" NAME="Valider"> </FORM> </BODY></HTML> Inscription.php Objets Php $_POST("Nom") $_POST("Civilité") $_POST("Valider")

24 Web dynamique 2/3 Processeur PHP Page virtuelle
Navigateur Nom=Dupond Civilite=Mr Objets PHP Inscription.php Processeur PHP Page virtuelle <HTML>...<BODY> Bonjour <?echo($_POST["Civilite"])?> <?echo($_POST["Nom"])%> </BODY></HTML> <HTML>...<BODY> Bonjour Mr Dupond </BODY></HTML>

25 Web dynamique 3/3 <? $Article= array {"CD unplug","CD live","CD impor US"} $PrixHT=array{12.50,149,160} ?> <HTML>... <TABLE> <TR><TD>N°</TD> <TD>Article</TD> <TD>Prix</TD> </TR> <? for ($i=1;$i<sizeof($Article);$i++) { echo(" <TR><TD>"); echo($i); echo(" </TD><TD>"); echo($Article[$i]); echo(" </TD><TD>"); echo($PrixHT[$i]*1.155%); echo(" </TR>"); } ?> </TABLE></HTML>

26 Javascript Language embarqué dans la page HTML
Il faut éviter les échanges inutiles entre le Serveur et le Navigateur ! <html><head><title>j'achete.com</title> </head><body> <script> Sub CheckDate( strDate ) { If ( not isDate( strDate ) ) then alert('Date incorrecte'); Else document.form.date.submit(); End If End Sub </script> <FORM NAME="Date" ACTION="Date.asp" METHOD="POST"> Entrez votre date de naissance<BR> <INPUT TYPE="text" NAME="LaDate"> <INPUT TYPE="Button" VALUE="OK" onclick="CheckDate(document.Date.LaDate.value);"> </FORM> </body></html>

27 Architecture 3 tiers 1/3 Architecture de base d'une application Web
Division de l'application en 3 grandes parties : Partie Présentation de l'information HTML, Javascript, Flash, ActiveX, PDF, Applet Java, etc Partie Application programme ASP, PHP, Java, ColdFusion, CGI, Perl, Java, etc Partie Base de Données avec Mysql, Oracle, MSSQL, PostGress, SapDB, etc

28 Architecture 3 tiers 2/3 <?
$Article= array {"CD unplug","CD live","CD impor US"} $PrixHT=array{12.50,149,160} ?> <HTML>... <TABLE> <TR><TD>N°</TD> <TD>Article</TD> <TD>Prix</TD> </TR> <? for ($i=1;$i<sizeof($Article);$i++) { echo(" <TR><TD>"); echo($i); echo(" </TD><TD>"); echo($Article[$i]); echo(" </TD><TD>"); echo($PrixHT[$i]*1.155%); echo(" </TR>"); } ?> </TABLE> </HTML>

29 Architecture 3 tiers 3/3 -Host: nom de l'ordinateur
-DB: nom de la base de données -User: nom de l'utilisateur de la BD -Password: mot de passe de cet utilisateur WEB Site Web en PHP Objets PHP BD Base de données SGBD <? $connect = mysql_connect("localhost","userDB","passwordDB","","-D mabasedonnées"); if (! $connect ) die("Erreur de connection à la base de données"); $resultat = mysql_query("SELECT * FROM CARNET"); // mysql_select_db("NouvelleBasedeDonnées"); mysql_close($connect); ?>

30 Base de données 1/3 Un Système de Gestion de Base de Données (SGBD) permet le stockage de grosses quantités d'informations structurées Extraction d'informations à partir de tables où sont structurées et stockées les données Travail d'analyse important : DBAdministrateur Interrogation en SQL (Structured Query Language) "proche" du langage naturel

31 Base de données 2/3 Une table contient des données typées et structurées en colonnes (les champs) et en lignes (les enregistrements) Un ensemble de tables sont regroupées dans un "schéma" de base de données Liaison virtuelle entre les tables Conducteur Numéro de Permis Nom du Conducteur Date du Permis Voiture Immatriculation Type Nombre de Passager Kilométrage Trajet Date de départ Kilométrage

32 Base de données 3/3 INSERT INTO "Conducteur"(Numéro de Permis,Nom du Conducteur) VALUE("12RT1","Jean"); UPDATE "Conducteur" SET "Nom Du Conducteur"="Jean P." (*); SELECT "Nom du Conducteur" FROM "Conducteur" (*); DELETE "Conducteur" (*); (*) WHERE "Nom Du Conducteur" = "Jean" AND "Numéro de Permis"="12RT1";

33 Exemples de requêtes SQL 1/2
Table Trajet N° Permis Immatriculation Date Trajet Km ST954A 523FG30 08/07/01 44 SU4532 212RT30 11/07/01 54 ST954A 212RT30 19/07/01 32 SELECT Nom FROM Conducteur,Trajet WHERE Conducteur.N°Permis = Trajet.N°Permis Table Voiture Table Conducteur Immatriculation Modèle N° Permis Nom 523FG30 Clio ST954A Dupont 212RT30 Twingo SU4532 Tintin 878AR30 206 WR123T Haddock

34 Exemples de requêtes SQL 2/2
SELECT C.Nom,V.Modèle FROM Conducteur as C ,Trajet as T,Voiture as V WHERE C.N°Permis = T.N°Permis AND T.Immatriculation = V. Immatriculation AND C.Nom = "Tintin" SELECT SUM(T.Km) FROM Trajet as T, Voiture as V WHERE T.Immatriculation = V. Immatriculation AND V.Modèle = "Clio";


Télécharger ppt "Architecture et Développement Web"

Présentations similaires


Annonces Google