II. PHP ETAPE 2▲
II-1. Comment ça marche ?▲
<html>
<head>
<title>Ma page de test</title>
</head>
<body>
<h1>Bienvenue sur le site de toto </h1>
<p>Le blabla de ma page...</p>
</body>
</html>
Voici une page HTML bien traditionnelle comme on les aime.
Copiez-collez en le contenu dans votre éditeur de texte notepad++.
Enregistrez et nommez-la test.html
Vous remarquerez que le code de la page se colore de façon syntaxique, ce qui le rend bien plus compréhensible. C'était l'intérêt de vous faire télécharger cet éditeur de texte.
Vous apprécierez beaucoup dès que l'affaire se corsera.
Pour l'instant, enregistrez ce fichier sur votre bureau, fermez notepad++, et double-cliquez maintenant directement sur votre fichier test.html, cela vous ouvrira une page web comme si vous étiez sur internet... Pourtant, vous n'y êtes pas, sur internet. Vous êtes "en local", bref, sur votre ordi, et vous ne faites que voir votre fichier à la façon d'une page web.
Rouvrez maintenant l'éditeur de texte et copiez/collez le bout de code suivant dans lequel on a introduit des balises PHP.
<html>
<head>
<title>Ma page d'accueil </title>
</head>
<body>
<h1>Bienvenue sur le site de toto </h1>
<p> Toto fait de l'anglais :</p>
<?php
echo '<p>Hello ! What is the day today ? It is '.date("l").' !</p>';
?>
</body>
</html>
Quand vous l'enregistrez, sur votre bureau, renommez-le test.php, (changez l'extension de .html en .php).
Ainsi, le serveur php est avisé que cette page contient du code PHP (que le navigateur ne sait pas afficher en ce qui le concerne).
Fermez votre éditeur. Double-cliquez directement sur votre page test.php : Quelle déception !
Cela ne vous ouvre pas une page web mais... le code que vous venez de quitter, sous un éditeur de texte qui est probablement bloc-notes sans coloration syntaxique.
(Au passage, profitez-en pour paramétrer votre ordi pour ouvrir notepad++ par défaut pour les fichiers PHP)...
C'est ici que le fait d'avoir installé WampServer sur votre machine va vous être utile. En effet, il vous faut un interpréteur PHP installé en local.
Ouvrez votre serveur wamp. Une fois démarré, cliquez sur son icône dans la barre d'état à droite, une sorte de demi-sphère jaune, un peu comme un demi-pamplemousse.
Choisissez www directory.
Dans la fenêtre qui s'ouvre, crééz un dossier PHP et glissez-y votre fichier test.php.
Vous passerez toujours par cette icône "pamplemousse" pour accéder à vos fichiers.
Cliquez maintenant sur cette icône, puis sur localhost. Dans la fenêtre qui s'ouvre, rubrique vos projets, ouvrez le dossier PHP...
Cliquez sur votre fichier test.php et admirez le travail... Le jour affiché en anglais, date qui sera toujours à jour...
Cliquez affichage/source sur votre navigateur : Vous pouvez constater qu'il n'y a plus trace de PHP, il ne reste que du code HTML...
Voici rapidement ce qui se passe à chaque rafraichissement :
le serveur PHP va droit aux fichiers qui ont une extension PHP, puis il va droit aux balises PHP de ce fichier, et interprète ce qu'il y a dedans :
ici, il affiche (echo) tout ce qui est entre parenthèses, puis concatène ou colle si vous voulez (le point) le résultat de la fonction date qui renvoie le jour en anglais...
Il a donc interprété du PHP pour le traduire en HTML.
Ensuite, il repasse le fichier au navigateur, qui lui ne sait afficher QUE du HTML (ou du CSS)... et bien ça tombe bien, il ne voit que du HTML dorénavant...
Mais si vous revenez demain sur cette page, la fonction date affichera un autre jour dans le HTML. Voici pour l'aspect technique.
Pour la prise en main de Wamp, ne retenez que ceci pour l'instant :
- Quand vous voulez retrouver votre code : icône puis wwwdirectory et PHP/votre fichier...
- Quand vous voulez voir le produit de votre travail, bref, tester votre code : icône puis localhost, répertoire PHP et votre fichier...
Ca deviendra vite un réflexe...
Maintenant que tout tourne, notre première étape portera sur les variables et sur la structure echo qui signifie donc affiche et que l'on utilise en permanence...
Voici quelques exemples... que vous testerez en les rajoutant sur votre fichier au sein des balises PHP bien entendu.
II-2. Les variables▲
$ devant une chaîne de caractères signifie que nous parlons d'une variable, on la nomme comme on veut ensuite, mais jamais d'accent ni d'espace dans un nom de variable.
Une variable est typée : elle peut prendre 4 types (dans l'ordre ci-dessous) :
- string (chaîne de caractères)
- integer (nombre entier)
- bool (booléen qui signifie logique binaire genre vrai ou faux)
- float (nombre réel)
<?php
$nom='Mickaël';
$age=17;
$gars=true;
$taille=1.75;
?>- Toutes les instructions (toutes) se terminent par un point virgule.
- Seule la variable string exige les guillemets (simples ou doubles, préférez les apostrophes pour l'instant, nous verrons pourquoi un peu plus loin)...
- La booléenne prend la valeur true, mais sans guillemets, elle a pour contraire... false.
- Le nombre réel prend un point à l'anglo-saxonne et non une virgule...
N'hésitez pas à personnaliser ces exemples et à les triturer en en changeant les données pour les assimiler.
II-3. echo▲
Bien maintenant que nous avons défini le type des variables en même temps que nous leur avons affecté une valeur, affichons les grâce à echo, dans un environnement HTML :
<?php
echo'<p>Bonjour à tous.<br/>
Mon vrai nom n\'est pas Toto.<br/>
Mon vrai nom est '.$nom.'<br/>
J\'ai '.$age.' ans et je mesure '.$taille.'m.<br/>
Et comme mon nom l\'indique, je suis ';
if ($gars==true){
echo 'un garçon.</p>';
}
else{
echo 'une fille. </p>';
}
?>
Commentaires sur cette instruction echo :
Ici je n'ai fait que deux instructions 'affiche' : Une automatique, et une conditionnelle.
Vous remarquerez que je suis allée à la ligne au sein de l'affichage grâce à la balise br/.
Vous remarquerez que toutes les apostrophes qui sont seulement du texte ont été neutralisées en plaçant \ devant chacune d'elle pour qu'elles ne soient pas considérées comme la fin de la chaîne de caractères.
Vous remarquerez que l'affichage du contenu de la variable se fait automatiquement, en mettant la variable nue dans le code.
Vous remarquerez que le point sert à concaténer (ou coller du texte bout à bout).
Il vous faut gérer les espaces à l'affichage au sein des guillemets. Ici la coloration syntaxique devient indispensable.
Enfin vous remarquerez que ma condition (si c'est un garçon ou une fille), bien qu'écrite à la ligne dans mon code et ouvrant une seconde instruction echo, s'affiche tout de même dans la continuité de mon précédent echo...
Autrement dit, c'est toujours au niveau du code HTML que se gèrent les retours à la ligne de l'affichage (balises br/, balises p ou autres).
Les retours à la ligne que vous faites spontanément dans votre code PHP après chaque instruction ne sont que des retours à la ligne à destination du programmeur pour une meilleure lisibilité de son code.
Dernière remarque : Prenez bien l'habitude de savoir à quel niveau vous êtes : au niveau du méta-langage PHP ou bien au niveau du code HTML qui aboutit à un affichage.
II-4. Guillemets ou Apostrophes ?▲
II-4-a. Ce que je ne conseille pas▲
Si vous êtes un peu flemmard, vous trouverez bien pratique de savoir que les guillemets "" (contrairement aux guillements simples ou apostrophes) permettent ceci en PHP:
<?php
$age=18;
//Ceci affichera directement
//J'ai 18 ans.
echo"J'ai $age ans.";
?>
Alors vous allez peut-être trouver cela un peu tordu d'utiliser les guillemets simples pour PHP du coup, puisque l'exemple ci-dessus règle en un seul coup de cuiller à pot le problème de l'interprétation directe de la variable et le problème de l'apostrophe du texte "J'ai"...
Pourtant, je pense que vous devrez procéder de façon plus rigoureuse si vous êtes amené à continuer avec PHP, aussi je vous prie d'adopter la convention suivante, pour ce tuto du moins :
II-4-b. Ce que je conseille▲
A l'avenir, vous allez fréquemment produire du HTML avec votre code PHP, puisque c'est sa fonction essentielle. Ainsi en adoptant la convention suivante, vous saurez toujours si vous êtes au niveau de PHP ou bien de HTML.
<?php
echo'<div class="contenu">blablabla</div>';
?>
Quand vous utilisez un ' : on est au niveau de PHP.
Quand vous utilisez un " : on est au niveau du HTML.
Pour la clarté de vos idées, je conseille donc ceci :
<?php
$age=18;
echo'J\'ai '.$age.' ans.';
?>
Bien sûr, il vous restera du coup à avoir le réflexe :
Attention, dans le contenu de mon HTML, entre deux balises, si j'ai une apostrophe dans mon texte (ce qui revient somme toute assez rarement) :
il faut que je pense au caractère d'échappement.
Mais ça ne devrait pas poser de problème majeur, toutes les phrases ne contenant pas autant d'apostrophes que dans l'exemple ci-dessous...
<?php
echo'<div class="contenu">L\'hirondelle vole à tire d\'ailes vers l\'Europe du Nord : L\'hiver s\'éteint.</div>';
?>II-5. TP2▲
Pour vos premiers travaux pratiques, vous programmerez ceci :
A partir d'une page vierge de notepad++ et sans copier-coller, vous ferez la page emploi.php qui devra afficher ceci :
Bien entendu les données suivantes : 2000, L'informatique, et 11.5 ainsi que mon option (dans laquelle je travaille ou souhaite travailler) sont des variables car on peut les modifier à souhait.
Vous prendrez soin de les afficher en gras, ces variables...
Bon courage... Et interdiction de courir à la solution au premier échec.
Lisez bien les messages d'erreur, ils indiquent la ligne à modifier (ou parfois la ligne du dessus).
Il est inévitable de faire beaucoup d'erreurs de ce type au début...
Donc patience, relisez le cours, mais ne venez à la solution que quand votre code produit quelque chose de satisfaisant et sans copier/coller.
II-6. Correction du TP2▲
Veuillez cliquer sur le symbole à droite pour découvrir la solution quand vous aurez fini.