Formations à l'informatique et à l'électronique

Auteur : SD
Modifié le : 26-11-2014
Créé le : 03-09-2014

Premiers pas en PHP

Introduction

Logo PHP

PHP permet de réaliser des pages dynamiques, c'est à dire que le code HTML de la page n'est pas fixe. La page est générée par le serveur puis envoyée à l'internaute.

Une page web écrite en php s'exécute donc sur le serveur, qui, à partir du code PHP génère du HTML qu'il envoie alors à l'internaute. Il est donc très important de garder à l'esprit que le code PHP est exécuté par le serveur et non pas par l'ordinateur de l'internaute qui au final reçoit du HTML.

PHP permet donc de générer du HTML, il est donc important d'avoir quelques connaissances en HTML avant de commencer à coder en PHP.

Sommaire

Installation de EasyPHP
Utilisation de EasyPHP
Premier code php
Où écrire le code php
Première page dynamique
Deuxième page dynamique
Troisième page dynamique
Mini-projet N°1
Mini-projet N°2
Mini-projet N°3
Pour aller plus loin
Articles connexes
Webographie

Installation de EasyPHP

Comme le code PHP s'exécute sur le serveur, il faut naturellement un serveur WEB pour tester le code PHP que nous allons écrire. On peut directement utiliser un serveur WEB fournit par un hébergeur. Pour la partie développement et tests il est plus pratique d'utiliser un serveur local à exécuter sur son ordinateur comme EasyPHP par exemple (il en existe d'autres...).

Il peut être intéressant d'installer EasyPHP sur une clé USB afin de pouvoir emporter et exécuter votre projet sur n'importe quel ordinateur.

Pour installer EasyPHP sur votre clé USB, indiquer lors de l'exécution de l'assistant d'installation le chemin vers votre clé USB comme le montre la capture d'écran ci-dessous (la lettre correspondant à votre clé USB sera sans doute différente).

Eviter les espaces, les lettres accentuées et autres caractères spéciaux dans le chemin d'installation de EasyPHP!

Capture d'écran installation EasyPHP

Utilisation de EasyPHP

Pour lancer l'exécution d'EasyPHP, double cliquer sur le fichier "EasyPHP-Dev-Server-14.1VC9.exe" situé dans le dossier "EasyPHP" de votre clé USB.

Capture d'écran lancement exécution de EasyPHP
Capture d'écran icône EasyPHP dans la zone de notification

L'icône "EasyPHP" apparait alors dans la zone de notification (près de l'heure en bas à droite de l'écran).

Capture d'écran icône EasyPHP dans la zone de notification

Un clic droit sur l'icône EasyPHP dans la zone de notification permet d'accéder aux différents paramètres de réglages ainsi qu'au dossier où vos fichiers PHP devront être déposés (captures d'écrans ci-contre et ci-dessous).

Les fichiers PHP sont à déposer dans le dossier "localweb".

Capture d'écran dossier www EasyPHP racine du site
Capture d'écran EasyPHP

Un double clic sur l'icône EasyPHP dans la zone de notification permet d'ouvrir la fenêtre EasyPHP.

Premier code php

Dans notepad++, créer un nouveau fichier et taper le code suivant :

<?php echo "bonjour"; ?>

Enregistrer ce fichier sous le nom "premier.php" dans le dossier "F:\EasyPHP\data\localweb" (Votre clé n'aura peut-être pas la lettre F...). Avec un navigateur Web, pointer sur l'adresse "http://127.0.0.1/premier.php". Visualiser le code source de la page "premier.php".

Dans votre rapport, placer côte à côte le code php et le code source de la page que le navigateur à reçu.

Capture d'écran rendu premier programme php

Ce qu'il faut retenir

Où écrire le code php

Le code php peut s'écrire directement dans du code html. Créer un nouveau fichier et taper le code suivant :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Titre de votre page WEB</title>
</head>
<body>
<p>Contenu de votre page WEB.</p>
<p><?php echo "Le contenu de ce paragraphe est généré par php!"; ?></p>
</body>
</html>

Pour un affichage correct des caractères accentués, convertir votre fichier en UTF-8 comme indiqué ci-dessous :

Convertir en UTF8 notepad++

Enregistrer ce fichier sous le nom "second.php" dans le dossier "F:\EasyPHP\data\localweb" (Votre clé n'aura peut-être pas la lettre F...). Avec un navigateur Web, pointer sur l'adresse "http://127.0.0.1/second.php". Visualiser le code source de la page "second.php".

Dans votre rapport, placer côte à côte le code php et le code source de la page que le navigateur à reçu.

Ce qu'il faut retenir

Première page dynamique

Créer un nouveau fichier et taper le code suivant :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Titre de votre page WEB</title>
</head>
<body>
<p>Contenu de votre page WEB.</p>
<p><?php echo "Le contenu de ce paragraphe est généré par php!"; ?></p>
<p><?php
echo "Bonjour, nous sommes le <b>" . date("d-m-Y") . "</b>";
echo " il est : <b>" . date("H:i:s") . "</b>";
?></p>
</body>
</html>

Enregistrer ce fichier sous le nom "dynamic.php" dans le dossier "F:\EasyPHP\data\localweb". Avec un navigateur Web, pointer sur l'adresse "http://127.0.0.1/dynamic.php". Visualiser le code source de la page "dynamic.php". Rafraichir la page, l'heure doit changer! Visualiser de nouveau le code source de la page "dynamic.php" et comparer au précédent.

Dans votre rapport, placer côte à côte le code php et le code source de la page que le navigateur à reçu.

Ce qu'il faut retenir

Deuxième page dynamique

Modifier le fichier dynamic.php comme indiqué ci-dessous :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Titre de votre page WEB</title>
</head>
<body>
<p>Contenu de votre page WEB.</p>
<p><?php echo "Le contenu de ce paragraphe est généré par php!"; ?></p>
<p><?php
$heure = date("H");// Si l'heure est comprise entre 0:00 et 17h59
if ($heure>=0 && $heure<17)
{/* Alors on affichera Bonjour */
$message = "Bonjour";
}
else
{// Sinon on affiche Bonsoir
$message = "Bonsoir";
}
echo "$message, nous sommes le <b>" . date("d-m-Y") . "</b>";
echo " il est : <b>" . date("H:i:s") . "</b>";
?></p>
</body>
</html>

Observer le fonctionnement (remplacer dans la ligne $heure = date("H"); le H par s pour faciliter l'observation!)

Dans votre rapport, placer côte à côte le code php et le code source de la page que le navigateur à reçu.

Ce qu'il faut retenir

Troisième page dynamique

Créer un nouveau fichier "tablesdemultiplications.php" et y coller le code ci-dessous :

<?php
function LigneTable($table,$multiplicateur) { // Déclaration et implémentation de la fonction "LigneTable"
$result = '<tr><td>' . $table . ' x ' . $multiplicateur . '</td><td>= ' . $table * $multiplicateur . '</td></tr>';
return ($result); // La fonction "LigneTable" renvoie la chaine de caractères $result
}
?>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Les tables de multiplication</title>
<style type="text/css"> <!-- Un peu de CSS ! -->
a:link {color: blue;}
a:visited {color: blue;}
a:hover {color: red;}
a:active {color: red;}
td {width:50px;}
</style>
</head>
<body>
<?php
if (isset($_GET['table'])) {
$t = $_GET['table'];
}
else {
$t = 2; // Par défaut la table de 2 est affichée
}
echo '<h1>La table de ' . $t . '</h1>';
?>
<p>
<?php
for($j=0;$j<=10;$j++) { // Une boucle affiche des liens vers les 11 tables (de 0 à 10)
echo ' <a style="width:15px; align:center; padding-left:10px; padding-right:10px; display:inline-block;"';
echo ' href="tablesdemultiplications.php?table=' . $j . '">' . $j . '</a> ';
}
?>
</p>
<table>
<?php
for($i=0;$i<=10;$i++) { // Une deuxième boucle for affiche la table sélectionnée
echo LigneTable($t,$i); // Utilisation de la fonction "LigneTable" définie au début du programme
}
?>
</table>
</body>
</html>

Vous devez obtenir l'affichage ci-dessous. La table affichée change en fonction du lien cliqué. Observez l'URL de la page à chaque fois que vous cliquez sur un des liens.

Copie d'écran du résultat du script php : affichage des tables de mult

Dans votre rapport, placer côte à côte le code php et le code source de la page que le navigateur à reçu (pour la table de 6).

Ce qu'il faut retenir

ATTENTION

Le passage de paramètres dans l'URL est un risque car un utilisateur mal intentionné peut directement le modifier à sa guise (voir capture d'écran ci-dessous). Dans cet exemple la conséquence n'est pas très grave mais pourrait l'être dans d'autres cas.

Dans le cas où on utilise cette méthode, il faut impérativement tester les paramètres reçus dans l'URL afin d'être certain qu'ils ne comportent pas de risques.

Copie d'écran du résultat du script php hacké

Mini-projet N°1

Faire un tableau qui affiche toutes les couleurs en fonction de leur code RGB :

<table style="width:250px;"><col span="2" style="width:125px;">

<tr><td>rgb(255,0,0)</td><td style="background-color:rgb(255,0,0);"></td></tr>

<tr><td>rgb(0,255,0)</td><td style="background-color:rgb(0,255,0);"></td></tr>

<tr><td>rgb(0,0,128)</td><td style="background-color:rgb(0,0,128);"></td></tr>

<tr><td>rgb(255,255,64)</td><td style="background-color:rgb(255,255,64);"></td></tr>

</table>

L'image ci-dessous montre le tableau obtenue avec le morceau de code HTML ci-dessus :

Copie d'écran du tableau obtenue avec le code HTML
function AfficheLigneCouleur($red, $green, $blue)
{
$result = '<tr><td>rgb(' . $red . ',' . $green . ',' . $blue . ')</td>';
$result = $result . '<td style="background-color:rgb(' . $red . ',' . $green . ',' . $blue . ');"></td></tr>';
return ($result);
}

Dans votre rapport, placer côte à côte le code php et l'algorithme correspondant. Insérer également une copie d'écran du rendu de la page web dans un navigateur.

Voir le résultat attendu

Mini-projet N°2

Afficher un tableau affichant la conversion des nombres de 1 à 2014 en chiffres Romains.

Dans votre rapport, placer côte à côte le code php et l'algorithme correspondant. Insérer également une copie d'écran du rendu de la page web dans un navigateur.

Vidéo montrant la méthode de conversion d'un nombre en chiffres Romains :

Voir le résultat attendu

Remarques :

Le code HTML généré par votre code PHP devra être valide.

La déclaration et le parcours d'un tableau se fait de la manière ci-dessous :

Exemple de déclaration et de parcours d'un tableau en PHP

Mini-projet N°3

Afficher un tableau affichant les mille premiers nombres premiers.

Vous devez créer 2 fonctions :

Faire les algorithmes des deux fonctions avant de commencer à coder et les montrer au professeur.

Dans votre rapport, placer côte à côte le code php et l'algorithme correspondant. Insérer également une copie d'écran du rendu de la page web dans un navigateur.

Voir le résultat attendu

Remarques :

Pour aller plus loin

Articles connexes

Premiers pas en HTML
Les formulaires en PHP
Premiers pas en CSS
Les structures algorithmiques de base
Accéder à une base Access (.mdb) en PHP

Webographie

http://www.siteduzero.com
http://www.phpdebutant.org

Le site php.net est le site de référence du langage PHP.
Le site w3schools est le site de référence des langages du WEB.
De nombreuses ressources en Français!
Pour valider le code HTML de vos pages : w3.org
Pour valider le code CSS de vos pages : w3.org


Vous avez apprécié cet article ? Partagez le !

Article connexe : Premiers pas en HTML