> Le Site du Zéro - Informatique > Cours > Tutoriels > Site Web > PHP > Général (PHP) > Concevez votre site web avec PHP et MySQL > Les bases de PHP > Préparer son ordinateur > Lecture du tutoriel

Préparer son ordinateur

Par

Mathieu Nebra (M@teo21)

Mise à jour : 03/04/2010

Difficulté : Facile Facile

164 536 visites depuis 7 jours , dont 5 981 sur ce chapitre , classé 3/777

Nous savons désormais que le PHP s'exécute sur le serveur et que son rôle est de générer des pages web. Cependant, seul un serveur peut lire du PHP et votre ordinateur n'est pas un serveur. Comment diable allez-vous pouvoir créer un site dynamique si le PHP ne fonctionne pas chez vous ? :euh:

Qu'à cela ne tienne : nous allons temporairement transformer votre ordinateur en serveur pour que vous puissiez exécuter du PHP et travailler sur votre site dynamique. Vous serez fin prêt à programmer après avoir lu ce chapitre !

Retour en haut

Sommaire du chapitre :

De quels programmes a-t-on besoin ?
Sous Windows : WAMP
Sous Mac OS X : MAMP
Sous Linux : XAMPP
Utiliser un bon éditeur de fichiers
Q.C.M.

Retour en haut

De quels programmes a-t-on besoin ?

Selon que l'on crée un site statique ou un site dynamique, on a besoin de logiciels différents. En fait, faire un site dynamique nécessite hélas pour nous un peu plus de logiciels !

Avec un site statique

Les webmasters qui créent des sites statiques avec XHTML et CSS ont de la chance, ils ont en général déjà tous les programmes dont ils ont besoin :

Mozilla Firefox

Un éditeur de texte : en théorie un programme tel que le Bloc-Notes livré avec Windows suffit, bien qu'il soit recommandé d'utiliser un outil un peu plus évolué comme Notepad++. Nous reparlerons du choix de l'éditeur à la fin de ce chapitre.
Un navigateur web : il permet de tester la page web. Vous pouvez utiliser par exemple Mozilla Firefox, Internet Explorer, Google Chrome, Opera, Safari, ou tout autre navigateur auquel vous êtes habitué pour aller sur le web. Il est conseillé de tester son site régulièrement sur différents navigateurs.

Cependant, pour ceux qui comme nous travaillent sur des sites dynamiques, ces outils ne suffisent pas. Il est nécessaire d'installer des programmes supplémentaires.

Avec un site dynamique

Pour que votre ordinateur puisse lire du PHP, il faut qu'il se comporte comme un serveur. Rassurez-vous, vous n'avez pas besoin d'acheter une machine spéciale pour cela : il suffit simplement d'installer les mêmes programmes que ceux que l'on trouve sur les serveurs qui délivrent les sites web aux internautes.

Ces programmes dont nous allons avoir besoin, quels sont-ils ?

Logo d'Apache

Apache : c'est ce qu'on appelle un serveur web. Il s'agit du plus important de tous les programmes, car c'est lui qui est chargé de délivrer les pages web aux visiteurs. Cependant, Apache ne gère que les sites web statiques (il ne peut traiter que des pages HTML). Il faut donc le compléter avec d'autres programmes.
PHP : c'est un plug-in pour Apache qui le rend capable de traiter des pages web dynamiques en PHP. En clair, en combinant Apache et PHP, notre ordinateur sera capable de lire des pages web en PHP.
MySQL : c'est le logiciel de gestion de base de données dont je vous ai parlé en introduction. Il permet d'enregistrer des données de manière organisée (comme la liste des membres de votre site). Nous n'en aurons pas besoin immédiatement, mais autant l'installer de suite.

Tous ces éléments qui vont nous aider à créer notre site dynamique sont libres et gratuits. Certes, il en existe d'autres (parfois payants), mais la combinaison Apache + PHP + MySQL est la plus courante sur les serveurs web, à tel point qu'on a créé des "packs" tous prêts qui contiennent tous ces éléments. Il est possible de les installer un à un mais cela prend plus de temps et vous n'allez rien y gagner (sauf si vous êtes administrateur de serveur, ce qui ne devrait pas être votre cas

).

Nous allons voir comment installer le "pack" qui convient en fonction de votre système d'exploitation dans la suite de ce chapitre.

Retour en haut

Sous Windows : WAMP

Il existe plusieurs paquetages tous prêts pour Windows. Je vous propose d'utiliser WAMP Server qui a l'avantage d'être régulièrement mis à jour et disponible en français.

Commencez par télécharger WAMP sur son site web officiel. Rendez-vous sur la page "Téléchargement". Vous n'êtes pas obligé de remplir le formulaire, il vous suffit de descendre tout en bas de la page et de cliquer sur "Télécharger WampServer".

Une fois téléchargé, installez-le en laissant toutes les options par défaut. Il devrait s'installer dans un répertoire comme C:\wamp et créer un raccourci dans le menu Démarrer.

Lorsque vous lancez WAMP, une icône doit apparaître en bas à droite de la barre des tâches, à côté de l'horloge :

Si une fenêtre apparaît pour vous indiquer que le pare-feu bloque Apache, cliquez sur Débloquer. Vous n'avez aucune raison de vous inquiéter, c'est parfaitement normal.

Par défaut, WAMP est en anglais. Vous pouvez facilement le passer en français en faisant un clic droit sur l'icône de WAMP dans la barre des tâches, puis en allant dans le menu Language / french.

WAMP est maintenant en français !

Vous pouvez maintenant lancer la page d'accueil de WAMP. Faites un clic gauche sur l'icône de WAMP (attention, j'ai bien dit un clic gauche cette fois), puis cliquez sur Localhost.

Une page web similaire à la capture ci-dessous devrait s'ouvrir dans votre navigateur favori (Firefox par exemple). Si la page s'affiche chez vous, cela signifie qu'Apache fonctionne.

La page web que vous voyez à l'écran vous a été envoyée par votre propre serveur Apache que vous avez installé en même temps que WAMP. Vous êtes en train de simuler le fonctionnement d'un serveur web sur votre propre machine. Pour le moment, vous êtes le seul internaute à pouvoir y accéder. On dit qu'on travaille "en local". Notez que l'URL affichée par le navigateur dans la barre d'adresse est http://localhost/, ce qui signifie que vous naviguez sur un site web situé sur votre propre ordinateur.

La section "Vos projets" de la page d'accueil de WAMP doit indiquer qu'aucun projet n'existe pour le moment. Considérez que chaque site web que vous entreprenez de faire est un nouveau projet.

Nous allons créer un projet de test que nous appellerons tests. Pour ce faire, ouvrez l'explorateur Windows et rendez-vous dans le dossier où WAMP a été installé, puis dans le sous-dossier intitulé www. Par exemple : c:\wamp\www. Vous pouvez aussi faire clic gauche / répertoire www sur l'icône de WAMP.

Une fois dans ce dossier, créez un nouveau sous-dossier que vous appellerez tests :

Retournez sur la page d'accueil de WAMP et actualisez la page (vous pouvez appuyer sur la touche F5). La section "Vos projets" devrait maintenant afficher "tests" car WAMP a détecté que vous avez créé un nouveau dossier :

Vous créerez là-dedans vos premières pages web en PHP.

Vous pouvez cliquer sur le lien "tests". Comme vous n'avez pas encore créé de fichier PHP, vous devriez voir une page vide comme ceci :

Si vous avez le même résultat, cela signifie que tout fonctionne. Bravo, vous avez installé WAMP et il fonctionne correctement. Vous êtes prêt à programmer en PHP ! :pirate:

Vous pouvez passer les sections suivantes qui ne concernent que les utilisateurs sous Mac OS X et Linux.

Retour en haut

Sous Mac OS X : MAMP

Pour ceux qui ont un Mac sous Mac OS X, je vous conseille le programme MAMP (Mac Apache MySQL PHP). Il est vraiment très simple à installer et à utiliser.

Rendez-vous sur le site officiel de MAMP et cliquez sur "Download Now" sur la page d'accueil :

Si vous avez une version de Mac OS X antérieure à Mac OS X 10.4, vous devrez télécharger une ancienne version de MAMP grâce aux liens présents un peu plus bas sur la même page.

Vous devriez avoir téléchargé une archive au format .dmg qui contient MAMP. Lorsque vous l'ouvrez, la fenêtre ci-dessous apparaît :

Vous devez tout simplement faire glisser le dossier MAMP en bas à gauche vers le dossier Applications au-dessus.

MAMP est maintenant installé. Vous le trouverez dans votre dossier "Applications". La fenêtre principale de MAMP indique que les serveurs Apache et MySQL ont été correctement démarrés. L'icône de chacun de ces éléments doit être verte :

Je vous invite à configurer le répertoire dans lequel Apache ira chercher les fichiers PHP de votre site web. Pour cela, cliquez sur le bouton Préférences de la fenêtre principale. Une boîte de dialogue de configuration s'ouvre. Cliquez sur l'onglet Apache en haut :

Cliquez sur le bouton "Choisir" pour sélectionner le dossier dans lequel vous placerez les fichiers de votre site web. Sous Mac OS, un dossier est déjà créé : il s'agit de "Sites" dans votre répertoire personnel.

Sélectionnez ce répertoire (notez que ce n'est pas une obligation : vous pouvez utiliser n'importe quel autre répertoire si vous le désirez), qui devrait être de la forme /Users/pseudo/Sites.

Validez les changements et retournez sur la fenêtre principale de MAMP. Là, cliquez sur "Ouvrir la page d'accueil". Votre navigateur (Firefox ou Safari par exemple) devrait alors s'ouvrir et afficher une page web.

Pour vous préparer pour la suite, je vous invite à créer un dossier "tests" dans votre répertoire "Sites". Nous placerons nos premiers fichiers PHP de test à l'intérieur.

Si le dossier "tests" a été correctement créé, vous pouvez visualiser son contenu en allant avec votre navigateur à l'adresse : http://localhost:8888/tests/

Si tout va bien, une page vide devrait s'afficher :

MAMP est correctement installé et configuré. Vous êtes maintenant prêt à travailler en PHP pour le chapitre suivant !

Retour en haut

Sous Linux : XAMPP

Sous Linux, il est courant d'installer Apache, PHP et MySQL séparément. Toutefois, il existe aussi des packs tous prêts comme XAMPP (X Apache MySQL Perl PHP), anciennement connu sous le nom de LAMPP.

Ce pack est plus complet que WAMP pour Windows ou MAMP pour Mac OS X. Nous n'utiliserons toutefois qu'une partie des éléments installés.

Sur le site officiel de XAMPP, recherchez le lien XAMPP pour Linux :

XAMPP est aussi disponible pour Windows et Mac OS X comme vous pourrez le constater sur le site. La méthode d'installation est sensiblement différente, mais vous pouvez l'essayer si vous avez déjà testé WAMP (pour Windows) ou MAMP (pour Mac OS X) et qu'il ne vous convient pas.

Sur la page qui s'affiche, recherchez le lien de téléchargement de XAMPP pour Linux un peu plus bas :

Une fois le téléchargement terminé, ouvrez une console. L'installation et le lancement de XAMPP se font en effet uniquement en console (allons allons, pas de chichis, vous n'allez pas me faire avaler que c'est la première fois que vous ouvrez la console

).

Rendez-vous dans le dossier où vous avez téléchargé XAMPP. Par exemple dans mon cas, le fichier se trouve sur le bureau :

Code : Console

cd ~/Desktop

Vous devez passer root pour installer et lancer XAMPP.
root est le compte administrateur de la machine qui a le droit notamment d'installer des programmes. Normalement, il suffit de taper su et de rentrer le mot de passe root. Sous Ubuntu, il faudra taper sudo su et taper votre mot de passe habituel.

Si comme moi vous utilisez Ubuntu, tapez donc :

Code : Console

sudo su

Vous devez maintenant extraire le dossier compressé dans /opt. Pour ce faire, recopiez simplement la commande suivante :

Code : Console

tar xvfz xampp-linux-1.6.7.tar.gz -C /opt

Il se peut que le nom du fichier soit légèrement différent si le numéro de version a changé. Adaptez le nom du fichier en le complétant automatiquement à l'aide de la touche Tabulation.

Lorsque la décompression des fichiers est terminée, c'est fait ! XAMPP est maintenant installé.

Pour démarrer XAMPP (et donc Apache, PHP et MySQL), tapez la commande suivante :

Code : Console

/opt/lampp/lampp start

Pour arrêter XAMPP plus tard si vous le désirez, tapez :

Code : Console

/opt/lampp/lampp stop

N'oubliez pas que vous devez être root lorsque vous démarrez ou arrêtez XAMPP.

Ce n'est pas bien compliqué comme vous pouvez le voir !

Vous pouvez maintenant tester XAMPP en ouvrant votre navigateur favori et en tapant l'adresse suivante : http://localhost

Vous devriez voir la page de sélection de la langue de XAMPP. Cliquez sur "Français" :

La page principale de configuration de XAMPP s'affiche ensuite. Elle est plus complète que ses homologues WAMP et MAMP, notamment parce que XAMPP contient plus de logiciels et propose donc plus de fonctionnalités (beaucoup plus :-°

).

Vous pouvez vérifier si tout fonctionne correctement en allant dans le menu Statut :

Au minimum, les modules MySQL et PHP doivent être en vert. Quant aux autres, nous ne les utiliserons pas donc peu importe.

Les fichiers PHP devront être placés dans le répertoire /opt/lampp/htdocs. Vous pouvez y créer un sous-répertoire tests pour vos premiers tests.

Code : Console

cd /opt/lampp/htdocs
mkdir tests

Une fois le dossier créé, vous pouvez y accéder depuis votre navigateur à l'adresse : http://localhost/tests

Vous devriez voir une page similaire à ceci :

Dossier vide XAMPP

Vous êtes prêts à travailler en PHP ! :soleil:

Si vous rencontrez des problèmes concernant les droits des fichiers du répertoire /opt/lampp/htdocs, dirigez-vous vers la documentation Ubuntu sur XAMPP (section Démarrer XAMPP).

Retour en haut

Utiliser un bon éditeur de fichiers

Comme vous devez déjà le savoir, pour éditer le code d'une page web vous avez plusieurs solutions :

Utiliser un éditeur de texte tout simple que vous avez déjà, comme Bloc-Notes. Pour l'ouvrir, faites Démarrer / Programmes / Accessoires / Bloc-notes. Ce logiciel suffit normalement à écrire des pages web en XHTML et même en PHP mais...
Le mieux reste d'utiliser un logiciel spécialisé qui colore votre code (très pratique) et qui numérote vos lignes (très pratique aussi). Il existe des centaines et des centaines de logiciels gratuits faits pour les développeurs comme vous.

Je vous propose donc d'installer un logiciel qui va vous permettre d'éditer vos fichiers source de manière efficace. Vous en avez probablement déjà installé un si vous avez appris à programmer en XHTML / CSS à l'aide de mon cours, mais comme on n'est jamais trop prudent, je vais rapidement vous en présenter quelques-uns en fonction de votre système d'exploitation.

Voici le code source XHTML que nous allons utiliser pour commencer en terrain connu. Copiez-collez ce code dans l'éditeur de texte que je vais vous faire installer :

Code : HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    <head>
        <title>Ceci est une page (x)HTML de test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    </head>
    <body>
        <h2>Page de test</h2>
        
        <p>
            Cette page contient <strong>uniquement</strong> du code (X)HTML.<br />
            Voici quelques petits tests :
        </p>
        
        <ul>
        <li style="color: blue;">Texte en bleu</li>
        <li style="color: red;">Texte en rouge</li>
        <li style="color: green;">Texte en vert</li>
        </ul>
    </body>
</html>

Il n'y a pas de PHP pour l'instant afin de commencer en douceur. Nous allons simplement essayer d'enregistrer un fichier XHTML avec ce code pour nous échauffer.

Sous Windows

Il existe beaucoup de logiciels gratuits à télécharger pour éditer du texte sous Windows. Il m'est impossible de tous vous les présenter donc je vais vous en recommander un qui est très utilisé et en lequel vous pouvez avoir confiance : Notepad++.

Ce logiciel est petit et rapide à télécharger. N'hésitez pas à l'essayer :

Page de téléchargement de Notepad++

Lorsque Notepad++ s'ouvre, il présente généralement un fichier vide (vous pouvez en créer un nouveau au besoin en allant dans le menu Fichier / Nouveau) :

Copiez-collez le code XHTML que je viens de vous donner dans Notepad++. Vous devriez voir l'écran suivant :

Comme vous pouvez le voir, le code n'est pas coloré. La raison vient du fait que Notepad++ ne sait pas de quel type de code source il s'agit. Vous devez au préalable enregistrer le fichier.

Allez dans Fichier / Enregistrer, puis choisissez le dossier où vous souhaitez enregistrer le fichier. Je vous conseille d'aller dans le dossier C:\wamp\www\tests que vous avez créé à l'installation de WAMP.
Choisissez le type de fichier .html (Hyper Text Markup Language File) puis donnez un nom à votre fichier :

Une fois le fichier enregistré, le code source apparaît coloré :

Vous pourrez suivre la même procédure avec les fichiers PHP tout à l'heure, à condition d'enregistrer le fichier en .php. Ca vous entraînera vous verrez.

Sous Mac OS X

Si vous êtes sous Mac, je peux vous recommander l'éditeur TextWrangler qui est gratuit. Il existe aussi Fraise que vous pouvez essayer.
D'autres éditeurs de texte payants de qualité existent, notamment l'excellent TextMate.

L'éditeur de texte TextWrangler sous Mac OS X

Sous Linux

Sous Linux, les bons éditeurs ne manquent pas. Si vous êtes un habitué de la console, vous travaillerez sûrement avec plaisir avec vim ou emacs.

Si vous recherchez un éditeur graphique plus facile à utiliser, je vous recommande gedit ou tout autre logiciel installé avec votre distribution Linux, cela fera l'affaire.

L'éditeur de texte gedit sous Linux

Quel que soit le logiciel que vous utilisez, rassurez-vous, ça ne change pas du tout la manière dont vous allez apprendre le PHP : les manipulations seront exactement les mêmes pour tout le monde.

Retour en haut

Q.C.M.

A-t-on besoin de plus de logiciels lorsqu'on crée un site dynamique ou lorsqu'on crée un site statique ?

Site dynamique
Site statique

Votre ordinateur peut-il comprendre les fichiers PHP sans installer de programme particulier ?

Lequel de ces programmes ne nous sera pas utile ?

Java
Apache
MySQL

Statistiques de réponses au QCM

Retour en haut

Vous devriez maintenant avoir installé un pack type WAMP, MAMP ou XAMPP pour pouvoir exécuter du PHP ainsi qu'un éditeur de texte comme Notepad++ ou TextWrangler pour travailler sur le code source de vos fichiers.

Dès le prochain chapitre on attaque le code : on va commencer à découvrir des instructions PHP. Cela veut dire que vous allez faire vos premières manipulations !

Retour en haut

Retour en haut

119 commentaires pour "Préparer son ordinateur"

Note moyenne : 3.61 / 4 (2417 votes)

Pseudo	Commentaire
timoboll	# Posté le 30/12/2011 à 11:23:35
	merci pour les conseils^^ c'était bien skype le probleme!
Amarr	# Posté le 13/01/2012 à 10:32:36
Avis : Très bon	Pour ceux qui galère essayer de désactiver votre anti-virus Artiste : Nelson Lamborghini Mo$$
brahimbo	# Posté le 31/01/2012 à 21:37:53
	bonjour, j'ai Windows type de systèmes est de :64 bits donc j'ai téléchargé 'wampserver 2.2 64bits',alors après l’installation la couleur de l'icone wampe est en orange 'server hors ligne' et quand je clique sur localhost il affiche une page de(internet information sevices IIS7 le mot 'bienvenue' sur plusieurs langues et puis le lien: http://www.iis.net/.
Matruck	# Posté le 05/02/2012 à 10:21:09
lutin de nowèlle Avis : Bon	Pour ceux qui ont un peu trifouiller les réglages des fichiers hosts, qui ont changer le port 80 en 8080 du fichier httpd.con il faut se rendre l'adresse http://localhost:8080/
Vizion	# Posté aujourd'hui à 14:26:00
Avis : Mitigé	Je suis très motivé, malheureusement, Apache ne veut pas s'installer! Peut importe où je vais, l'installation est "suspendue".. Je ne peux donc plus continuer.. HELP?