Se connecter Recherche

Au vue du développement du numérique et des possibilités de communication offertes, la plus grande majorité d’entre nous cherche aujourd’hui à disposer personnellement de sa page web, de son petit site statique de présentation ou d’un site dynamique disposant de son back-office et autorisant l’interactivité avec les visiteurs.

Mais avant de voir sa création en ligne, outre l’hébergement et le nom de domaine, il faut d’abord la créer! Je devrais plutôt dire la coder!

Afin de vous permettre de développer votre(s) fichier(s) html (php, css, … et tout le reste), je vais vous informer des quelques outils indispensables permettant de transformer votre ordinateur en une petite machine de développement web.

Que ce soit clair! Le but de cet ensemble d’article n’est pas de vous apprendre les différents langages, d’autres sites le feront mieux que moi, mais de vous permettre de mettre en place une structure qui vous permettra de créer, tester, essayer vos pages ou CMS dans des conditions optimales et prévenir toutes questions qui pourrait vous entrainer dans des heures de recherches sur la toile.

Mettre en place un serveur local avec WAMP

Infos: cet article à été écris sur la base de l’utilisation de la version 2.5 de WAMP.

WAMP, qu’est-ce que c’est? Une plate-forme de développement Web sous Windows pour des applications Web dynamiques à l’aide du serveur Apache2, du langage de scripts PHP et d’une base de données MySQL. Il possède également PHPMyAdmin pour gérer plus facilement vos bases de données.

Pourquoi ce choix de WAMP? Simplement parce que je tourne sous Windows et que cette plate-forme est, à mes yeux, performante et fonctionnelle. WAMP vous permettra de créer et tester des scripts PHP, des bases de données, des formulaires de contact ou encore installer et configurer pleinement des CMS tels que WordPress, Prestashop et autres. Pour les utilisateurs de Mac, l’équivalent se nomme MAMP.

Installer WAMP sur son ordinateur ne merite pas réellement un tuto, tellement cette démarche est simple, mais je vous l’indique pour les plus néophites afin de faciliter leur premier pas.

Première étape : télécharger l’installateur sur le site officiel, ce qui vous garantira de disposer de la dernière version. Le choix se limite à déterminer si votre OS est en version 32bits ou 64bits.

Une fois téléchargé, il ne vous reste plus qu’à cliquer sur ce fichier .exe et suivre la procédure d’installation. Celle-ci terminée, WAMP est d’ores et déjà installé sur votre ordinateur. Par défaut, la procédure installe également,de mémoire, Mcafee security blablabla sans trop vous demander votre avis; un petit tour dans l’explorateur Windows vous permettra de désinstaller cet utilitaire en un clic.

Démarrer WAMP

C’est installé?! Super! et maintenant je fais quoi?

Pour démarrer Wamp, il vous suffit de cliquer sur le W rose, raccourci disponible sur votre bureau ou via l’explorateur, attendre que celui-ci passe au vert, ouvrir votre navigateur web préféré et saisir l’url http://localhost (ou 127.0.0.1 pour certains).

Vous voilà rendu sur la home page de WAMP, votre serveur local.

epica design

Premier projet

Si vous souhaitez essayer tout de suite votre nouvel outil, je vous invite à faire l’essai avec WordPress. En plus de vous permettre de créer un site performant, celui-ci vous permettra, de part l’installation de quelques plugins, de tester les différents outils abordés dans les articles suivants.

Info: Depuis sa version 2.5, WAMP à modifier son fonctionnement habituel! Les anciennes versions permettaient de créer un nouveau projet par un simple ajout de dossier et un accès à celui-ci via un clic dans l’interface de WAMP, ce fameux localhost précédent toutes les URL.

Ce système à été révisé pour, aujourd’hui, demander la création d’information spécique à chaque nouveau projet. Je n’étendrais pas sur cette démarche que je trouve complexe pour un non initié (les infos complètes sont disponibles ici), je vais juste vous donner la démarche pour revenir au fonctionnement précédent.

Comme chez WAMP, il y a plein de gens sympas, ils nous ont laissé la possibilité de désactiver cette nouvel configuration. Pour se faire, rendez vous dans C: > WAMP > www > … , ouvrez le fichier index.php (avec votre éditeur de code ou le bloc-note de Windows) et modifier cette ligne (placée juste après les premiers commentaires)

 

$suppress_localhost = true;

pour obtenir

$suppress_localhost = false;

 

Redémarrer WAMP (clic gauche sur le W vert > Restart all services), et voilà, vous venez de ré-autoriser l’utilisation du localhost.

Revenons à nos moutons. Vous allez donc télécharger WordPress sur le site officiel et le décompresser disons … sur votre bureau pour l’instant.

Tout nouveau projet utilisant WAMP doit être placé dans le dossier www où nous nous sommes rendu tout à l’heure. Nous réouvrons donc C: > WAMP > www > … et y créons un dossier que nous nommerons « wordpresstest » (le nom du dossier n’à absolument aucune importance, mettez ce que vous voulez) et y placerons l’ensemble des fichiers et dossiers décompressés précédemment (wp-blog-header.php, wp-load.php, wp-content, …).

Avant de faire quoi que ce soit, nous allons créer la base de données requise à l’installation de WordPress. Comment? Grace à phpmyadmin, intégré à WAMP.

epica design

 

Dans votre navigateur, retournez à l’url localhost, vous devriez y apercevoir votre nouveau dossier dans la colonne « Vos Projets » et un accès phpmyadmin dans la colonne « Outils« . Cliquez sur phpmyadmin et vous voilà redirigez vers l’interface vous permettant de créer, modifier, sauvegarder, supprimer vos bases de données (cet outls est également disponible dans la majorité des offres d’hébergement de qualité). Sélectionnez l’onglet Base de données et renseignez le nom de base que vous souhaitez (pour l’exemple, nous dirons wordpress-bdd).

Laissez en interclassement et cliquez sur créer. Voilà, la base est disponible.

Retourner maintenant sur localhost et cliquez sur le dossier qui héberge vos fichiers et dossiers WordPress

La procédure d’installation se lance et vous demande de renseigner quelques champs. Pour info: votre nom de BDD est wordpress-bdd (ou le votre), votre nom d’utilisateur est root (toujours), il n’y a pas de mot de passe (laissez le champ vide), hébergement de BDD est localhost (toujours) et le prefixe de table est wp_ par defaut.

Suivez la suite de la procédure d’installation de WordPress qui concernera cette fois des paramètres concernant le « site » en lui même, validez.

WAMP, c'est cool

Cette installation d’un serveur local vous à donc permis de créer une base de données, d’installer sur votre ordinateur un CMS comme WordPress, de pouvoir utiliser l’ensemble de ces fonctionnalités puisque le PHP est interprété.

Grâce à ce type d’outils, vous pouvez sans crainte faire des tests, essayer des plugins, tester des modifications, des codes, … Le tout sans risque puisque vous être en local, que c’est plus réactif que de travailler en ligne, que vos sauvegardes sont à portée de souris et ne nécessite pas de client FTP pour être utilisée ou mise en place.

Ce qu’il ne faut pas oublier: Créez un dossier spécifique (toujours dans le www/) pour chacun de vos projets, afin de vous évitez des conflits ou simplement de vous perdre dans l’ensemble.

Dans le prochain article, je vous aide à mettre en place un système vous permettant de vous envoyer des mails en local pour tester vos formulaires.

Commentaires Écrire un commentaire

  • MAILCATCHER : Envoyer des emails en local | epica design le 17 janvier 2015 at 9 h 09 min Répondre

    […] WAMP sur votre ordinateur. Si ce n’est déjà fais, je vous laisse vous référer à cet article pour connaître la démarche à suivre. Configuration dans laquelle cet article à été vérifié: WAMPSERVER 2.5 – Ruby 1.9.3 […]


Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.

*