Algorithmes et structures de données avancées Partie Conception de Sites Web dynamiques Cours 8 Patrick Reuter

Attributs : simple guillemets et double guillemets Image width Cliquer ICI

Conception de Site Webs Interactifs Déroulement Pages web statiques (HTML/XHTML) Mise en forme avec feuilles de styles (CSS) Programmation côté serveur –Pages web dynamiques (PHP) –avec connexion à une base de données (MySQL) Programmation côté client –JavaScript Référencement Internet (moteur de recherche)

CSS Le langage CSS (Cascading Style Sheets : feuilles de style en cascade) est utilisé pour décrire la présentation d'un document structuré écrit en HTMLHTML Pour séparer la mise en forme et le contenu Permet de gagner en temps, en simplicité de création, et en maintenance.

Exemple ma premiere page Ma Page ma première page web

Exemple : style.css body { background-color: #0099cc; text: #ffffff; } ;

CSS Avantages La structure du document et la présentation sont gérés dans des fichiers séparés. Le code XHTML est considérablement réduit en taille et en complexité, puisqu'il ne contient plus de balises de présentation. La conception d'un document se fait dans un premier temps sans se soucier de la présentation, ce qui permet d'être plus efficace. Plusieurs feuilles de style (p.ex. lecture ou impression) p.ex. pour lécran p.ex. pour impression

Exemple : p { color: #0000ff; text-align: center; } ;

Priorités de CSS p { color: #FF0000;/* rouge */ text-align: center; } p.vert { color: #008000; /* vert */ text-align: left; } p#mix2 { color: #0000FF; /* bleu */ } p#mix3 { color: #0000FF; /* bleu */ } Paragraphe 1 numero 2 numero 3 Paragraphe 4 Paragraphe 5 feuille.css index.php

Priorités de CSS p { color: #FF0000; /* rouge */ text-align: center; } p.vert { color: #00FF00; /* vert */ text-align: left; } p#mix { color: #0000FF; /* bleu */ } Enigme 1 Enigme 2 Enigme 3 Enigme 4 index.php style.css

Conception de Site Webs Interactifs Déroulement Pages web statiques (HTML/XHTML) Mise en forme avec feuilles de styles (CSS) Programmation côté serveur –Pages web dynamiques (PHP) –avec connexion à une base de données (MySQL) Programmation côté client –JavaScript Référencement Internet (moteur de recherche)

Qu'est-ce que le PHP ? PHP : Personal Home Pages / People Hate Perl / Hypertext PreProcessor PHP est un langage de programmation interprété côté serveur Inventé par Rasmus LEDOORF (v1 : 1994, v2 : 1996, … v5 : 2004) Il est dédié au Web : traitement des formulaires, communication avec des bases de données (souvent couplé à MySql) Avantages Il est simple (pas typé, interprété, …) Il est gratuit (?) Il est fait pour le Web Il est TRES répandu Inconvénient Code difficilement maintenable

PHP

PHP et MySQL

PHP

<?php echo "Hello World"; ?>

Remarques Extension du fichier doit être.php Le navigateur ne comprend que l'HTML Le code "php" inclus dans la page HTML est transformé par le serveur php Le code "php" est invisible dans la page HTML affichée car il est interpreté

Un exemple pratique : Hello World Ma premiere page Hello World Ma premiere page <?php echo " Hello World "; ?> helloworld.htm helloworld.php

Ecrire dans le fichier HTML echo "hello world";

Un exemple pratique : remarques Si on "éteint" le serveur web (EasyPHP) Si on met une extension.html au fichier php

Balise Les scripts php étant destinés à être utilisés à l'intérieur de pages HTML, il faut une balise spéciale permettant au "parser / interpréteur" php de savoir à quel endroit se trouve le code. Un code php est toujours compris entre les balise " " d'autre part. [...] <?php echo " Hello World "; ?> [...]

Commentaires Comme en C ou en Java Tout ce qui se trouve dans un commentaire est ignoré par le serveur php <?php // commentaire de fin de ligne /* commentaire sur plusieurs lignes */ ?>

echo 'j\'utilise php'; // FAUX echo "j'utilise php" ; // CORRECT echo "j\'utilise php" ; // CORRECT

Concatenation 1 <? echo "Salut"." Martin"; ?>

Variables php est interprété et faiblement typé. Il nest pas nécessaire de déclarer le type d'une variable. Les identificateurs de variable sont précédés du symbole « $ » (dollar). Types : - entier (integer)- réel (double) - tableau (array)- objet (object) - booléen (boolean)- chaîne de caractères (string) <?php $toto = 5; echo $toto; ?>

Variables <?php $a = 0; $nom = 'Horst'; echo $a; ?>

echo ' ';

Concatenation 2 <? $nom = "Martin"; echo "Salut ".$nom; ?>

Variables Portée Limitée au bloc dans lequel elle a été crée. Une variable créée dans un bloc nest pas connue dans les autres. Les variables de fonctions ne sont connues que dans la fonction. Opérateurs Par ordre de priorité –++, --, ! –+, -, *, /, % –==,, =, != –&&, ||, and, or –= Priorité plus faible Priorité plus forte

Condition Permet dexécuter ou non un bloc dinstructions. Rmq : la condition est une expression booléenne (lévaluation de son résultat rend vrai ou faux) if (condition1) { /* bloc dinstructions lorsque condition1 est vraie */ } else if (condition2) { /* autre bloc dinstructions, lorsque condition2 est vraie */ } else { /* bloc dinstructions lorsque les conditions antécédentes sont fausses */ }

Condition SI..SINON <?php $nombre = 512; if ($nombre =500 && $nombre<1000) { echo $nombre." est compris entre 500 et 999"; } else { echo $nombre." est plus grand que 999"; } ?>

Boucle for Permet dexécuter plusieurs fois un bloc dinstructions donné (nombre ditérations connu) for (initialisation ; condition_pour_continuer ; modification){ /* bloc dinstructions lorsque la condition darrêt nest pas vérifiée */ } /* typiquement : */ for ($i=0; $i<10; $i++){ /* traitement */ }

Boucle POUR "; } echo "i est égal à ".$i; ?>

Boucle while Permet dexécuter plusieurs fois un bloc dinstructions donné (nombre ditérations inconnu) Rmq : la condition est une expression booléenne (lévaluation de son résultat rend vrai ou faux) - si vrai : le bloc dinstructions est exécuté - si faux : la boucle nest plus itérée, et lexécution continue à la suite de la boucle while (condition_pour_continuer) { /* bloc dinstructions lorsque la condition est vérifiée */ }

Boucle TANT QUE <?php $i = 1; while ($i<=5) { echo "Ligne No. "; echo $i; echo " "; $i++; // $i = $i + 1; } ?>

Boucle TANT QUE <?php $i = 1; while ($i<=5) { ?> Salut <? $i++; } ?> <?php $i = 1; while ($i<=5) { echo "Salut "; $i++; } ?>

Passer des paramètres dynamiques Par lURL : méthode $_GET Par des formulaires HTML aussi méthode $_POST

Méthode _GET <?php $a = $_GET['param']; echo $a; ?> URL :

Méthode _GET URL : <?php $a = $_GET['param1']; echo $a; $b = $_GET['param2']; echo $b; ?> URL :

Fonction isset() <?php if isset($_GET['param1']) $param1 = $_GET['param1']; else { echo "Paramètre non donné"; $param1 = 1; // valeur par défaut } ?>

Boucle TANT QUE <?php... $i = 1; while ($i<=$param1) { echo "Ligne No. "; echo $i; echo " "; $i++; // $i = $i + 1; } ?>

Qu'est-ce que le PHP ? PHP : Personal Home Pages / People Hate Perl / Hypertext PreProcessor PHP est un langage de programmation interprété côté serveur Inventé par Rasmus LEDOORF (v1 : 1994, v2 : 1996, … v5 : 2004) Il est dédié au Web : traitement des formulaires, communication avec des bases de données (souvent couplé à MySql) Avantages Il est simple (pas typé, interprété, …) Il est gratuit (?) Il est fait pour le Web Il est TRES répandu Inconvénient Code difficilement maintenable

PHP et MySQL

PHP

Méthode _GET URL : <?php $nom = $_GET['nom']; echo "Bonjour ".$nom; ?>

Méthode _GET plusieurs paramètres <?php $a = $_GET['prenom']; echo $a; ?> URL : &nom=Roussel&datenaissance=

PHP et MySQL <?php $nom = $_GET['nom']; echo "Bonjour ".$nom; ?>

PHP et MySQL Demande de index.php?nom=Lisa <?php $nom = $_GET['nom']; echo "Bonjour ".$nom; ?>

PHP et MySQL Demande de index.php?nom=Lisa Retour de la page XHTML <?php $nom = $_GET['nom']; echo "Bonjour ".$nom; ?>

PHP et MySQL Demande de index.php?nom=Lisa Retour de la page XHTML Bonjour Lisa <?php $nom = $_GET['nom']; echo "Bonjour ".$nom; ?>

Remarques Extension du fichier doit être.php Le navigateur ne comprend que l'HTML Le code "php" inclus dans la page HTML est transformé par le serveur php Le code "php" est invisible dans la page HTML affichée car il est interpreté