Hébergez et modifiez des sites Web sous Windows gratuitement avec XAMPP

Vous voulez construire un site web. Les frais généraux peuvent être coûteux. Que faire si vous voulez juste apprendre le développement web, sans fouillis? Laissez-nous vous montrer comment héberger un site web local gratuitement.

Vous voulez construire un site web.  Les frais généraux peuvent être coûteux.  Que faire si vous voulez juste apprendre le développement web, sans fouillis?  Laissez-nous vous montrer comment héberger un site web local gratuitement.
Publicité

Vous voulez construire un site Web 10 façons de créer un site Web petit et simple sans l'excès 10 façons de créer un site Web petit et simple sans l'excès WordPress peut être une exagération. Comme le prouvent ces excellents services, WordPress n'est pas la finalité de toute création de site web. Si vous voulez des solutions plus simples, il y a une variété à choisir. Lire la suite, mais ne savez pas par où commencer?

Il semble que le terrain de formation au développement web typique soit aussi le plus cher: acheter un domaine, serveur hôte, compte WordPress, thème, etc. Mais que faire si vous n'êtes pas propriétaire d'une petite entreprise ou que vous essayez de construire une marque? Que faire si vous essayez simplement d'apprendre le développement web, sans fouillis?

Lisez la suite pour apprendre comment héberger votre propre site Web Comment utiliser un blog WordPress auto-hébergé pour la gestion de projet Comment utiliser un blog WordPress auto-hébergé pour la gestion de projet Lire la suite, que vous pouvez créer à partir de zéro ou avec des modèles pré-faits, sur votre ordinateur, et gratuitement. Oh, cela inclut également l'hébergement de votre propre compte WordPress!

XAMPP: une introduction

XAMPP de Bitnami est "une distribution Apache contenant PHP et Perl." Pour nos besoins, nous avons seulement besoin de comprendre que XAMPP est un programme gratuit et simple qui permet aux utilisateurs d'héberger des sites Web sur leurs PC.

Bien que la mise en place d'un serveur local utilisant XAMPP soit quelque peu technique, le processus est également assez simple et direct. Une fois que tout a été mis en place, vous constaterez que la gestion et l'édition de sites Web est un jeu d'enfant.

Ensuite, il y a la question du contrôle rapide et complet. En utilisant XAMPP pour créer et éditer des sites Web, vous serez en mesure de modifier autant ou aussi peu d'un site Web que vous le souhaitez. Cela dit, avec une grande puissance vient une grande responsabilité. Le Guide de sauvegarde des données Ultimate Windows 10 Le Guide de sauvegarde des données Ultimate Windows 10 Nous avons résumé toutes les options de sauvegarde, de restauration, de récupération et de réparation que nous pouvions trouver sur Windows 10. Utilisez nos astuces simples et ne désespérez plus jamais de perdre des données! Lire la suite .

Si vous souhaitez un véritable projet de cours de démarrage en web dev, cependant, XAMPP est fait pour vous. Cela inclut tous les projets liés à HTML, CSS, Javascript, et au-delà!

Installation de XAMPP

Dirigez-vous vers le site Web XAMPP et téléchargez le package. Suivez le processus d'installation par défaut. Une fois que vous avez téléchargé XAMPP, votre panneau de contrôle XAMPP devrait s'ouvrir automatiquement. Si ce n'est pas le cas, vous pouvez localiser le programme XAMPP comme vous le feriez pour n'importe quel autre (via la recherche dans le menu Démarrer).

Dans votre fenêtre du panneau de configuration XAMPP, vous devriez voir une présentation simple des processus XAMPP en cours d'exécution. Pour notre propos, nous allons nous concentrer sur les deux premières options: Apache et MySQL.

Apache - Le point central de XAMPP, l'option Apache crée un serveur Apache sur votre PC. C'est ce qui vous permettra d'exécuter et d'éditer des sites Web sur votre PC via les navigateurs Web, un peu comme un site Web. Sauf, bien sûr, ce site fonctionne sur votre PC, par opposition à un serveur connecté à Internet.

MySQL -SQL permet la communication entre les bases de données et les sites Web, ce qui permet aux utilisateurs de tester et de stocker les courriels, les mots de passe et toutes les autres entrées de données. Nous allons l'utiliser pour votre compte WordPress local.

Appuyez sur le bouton Démarrer de votre panneau de configuration XAMPP sous Actions pour Apache et MySQL. Attendez que les deux Apache et MySQL soient surlignés en vert sous votre section de module. Une fois activé, vous êtes libre d'utiliser XAMPP.

panneau de contrôle xampp

Localhost et phpMyAdmin

Pour vous assurer que tout fonctionne correctement, ouvrez un navigateur Web, entrez http: // localhost / dans votre barre d'adresse et appuyez sur Entrée . Vous devriez être redirigé vers http: // localhost / dashboard /, qui est la page XAMPP par défaut.

xampp page web par défaut

Ensuite, cliquez sur le bouton phpMyAdmin dans le menu de navigation supérieur. Vous serez dirigé vers votre page phpMyAdmin par défaut.

phpmyadmin

Laissez-les seuls pour l'instant, mais si les deux fonctionnent vous êtes prêt à commencer à créer des sites Web!

Création de sites Web à l'aide de XAMPP

Maintenant vient la partie amusante. Dirigez-vous vers le dossier XAMPP situé dans votre répertoire racine ( C: \ xampp par défaut). Ensuite, dirigez-vous vers htdocs . Ce sera le référentiel principal du site Web que vous utiliserez pour afficher les sites Web.

Avant de créer et de modifier un site Web, vous avez besoin d'un éditeur de texte. Bien que vous puissiez utiliser un éditeur de texte par défaut comme Notepad, il est généralement préférable de télécharger un éditeur tiers spécialement conçu pour le code et le balisage. 11 Sublime Text Tips pour Productivity and a Faster Workflow 11 Sublime Text Tips pour Productivity and a Faster Workflow un éditeur de texte polyvalent et un étalon-or pour de nombreux programmeurs. Nos conseils sont axés sur un codage efficace, mais les utilisateurs en général apprécieront les raccourcis clavier. Lire la suite . Sublime Text est l'un des meilleurs, alors rendez-vous sur leur site web et téléchargez le logiciel pour commencer.

Vous pouvez maintenant commencer à télécharger et à installer des sites Web dans XAMPP. J'utiliserai le modèle Roadtrip, mais vous pouvez utiliser le modèle que vous souhaitez. Téléchargez le fichier zip du site Web et conservez-le dans un endroit dont vous vous souviendrez. Ensuite, créez un dossier dans le dossier htdocs de XAMPP pour votre site Web. J'ai nommé mine roadtrip - essayez de garder votre nom simple. Ensuite, décompressez et extrayez le contenu de votre fichier zip dans ce dossier htdocs.

extraire au roadtrip

Une fois que vous avez extrait les fichiers, dirigez-vous vers le référentiel de votre site Web dans htdocs pour vous assurer qu'ils ont été extraits correctement.

Enfin, dirigez-vous vers votre page Web dans votre navigateur Web Les meilleurs navigateurs Web pour Windows Les meilleurs navigateurs Web pour Windows Quel est votre navigateur Web par défaut? Même si nous avons l'embarras du choix, la majorité d'entre nous s'en tiennent aux joueurs majeurs testés et testés. Quelles sont les meilleures alternatives pour l'utilisation des ressources, la vitesse et la sécurité? Lire la suite . Votre site Web, pour ainsi dire, sera accessible en utilisant le localhost mentionné précédemment ainsi que le nom du dossier contenant vos fichiers de page. C'est parce que les sites Web sont essentiellement des fichiers contenus dans des dossiers, tous sous un nom de domaine unique - ou racine -. Vous apprenez déjà!

Notre dossier précédemment créé a été nommé roadtrip, donc l'adresse complète du site est http: // localhost / roadtrip .

modèle de roadtrip

Vous avez terminé! Vous pouvez maintenant commencer à modifier le site Web localement.

Modification de sites Web

Ouvrez le texte sublime. Allez dans Fichier et sélectionnez Ouvrir le dossier . Recherchez et sélectionnez votre dossier Web dans le dossier XAMPP. Vous serez maintenant en mesure de modifier plusieurs pages du même site Web dans votre éditeur de texte Sublime.

texte sublime

Sublime Text fournit également une excellente interface pour que vous puissiez voir tous les fichiers et dossiers de votre site web. Pour créer des modifications sur votre site Web, modifiez le code de votre site Web, enregistrez-le (en utilisant la commande clavier Ctrl + S ) et actualisez votre site Web dans le navigateur.

Le processus est simple et direct: éditez la page Web, puis vérifiez si votre code fonctionne. Au fur et à mesure que vous progresserez dans votre développement Web, vous tenterez d'intégrer des fonctionnalités plus complexes dans votre page Web. Cependant, peu importe le niveau de compétence, le format de base pour éditer des pages reste le même.

Utilisez WordPress avec XAMPP

Si vous ne voulez pas éditer de code brut ou si vous préférez utiliser un système de gestion de contenu (CMS) plus familier, WordPress fournit également sa fantastique ressource de conception Web dans un fichier ZIP facile à utiliser! Pour installer WordPress sur XAMPP, rendez-vous sur le site WordPress et téléchargez l'application officielle.

Utilisez le même format pour créer un site Web comme vous l'avez fait précédemment, avec votre dossier WordPress extrait présent dans le répertoire htdoc dans le dossier wordpress . Conservez le nom du dossier pour des raisons de clarté.

Utiliser phpMyAdmin

Puisque WordPress exige que vous créiez des informations de connexion, vous devez créer une entrée dans votre répertoire PHP pour la page Web. Dirigez-vous vers votre page phpMyAdmin Configurer votre blog avec Wordpress: le guide ultime Configurer votre blog avec Wordpress: le guide ultime Vous voulez démarrer votre propre blog, mais vous ne savez pas par où commencer? Vous devriez vraiment regarder dans Wordpress, la plate-forme de blogs la plus simple et la plus puissante disponible aujourd'hui. Lire la suite - http: // localhost / phpmyadmin / par défaut - pour commencer.

Depuis cette page, cliquez sur Bases de données . Sous le paramètre Créer une base de données, entrez wordpress, puis cliquez sur Créer . Vous devriez voir un popup vous indiquant que la base de données a été créée. Ensuite, fermez cette fenêtre du navigateur et entrez votre dossier WordPress dans le répertoire XAMPP htdocs. Ce dossier doit posséder le contenu de vos fichiers WordPress décompressés.

Configuration de la connexion

Nous devons configurer le site Web WordPress afin que vous puissiez vous connecter et utiliser le site. Ceci est fait à travers le fichier de configuration PHP principal de WordPress. Dans votre dossier WordPress, recherchez le fichier intitulé wp-config-sample.php, faites un clic droit sur le fichier, sélectionnez Modifier (ou Ouvrir avec pour un éditeur de texte séparé). Le bloc-notes devrait fonctionner correctement.

Voici le code sur lequel nous allons nous concentrer:

// ** MySQL settings - You can get this info from your web host ** // /** The name of the database for WordPress */ define('DB_NAME', ' database_name_here '); /** MySQL database username */ define('DB_USER', ' username_here '); /** MySQL database password */ define('DB_PASSWORD', ' password_here '); 

Vous devrez apporter trois modifications au code ci-dessus entre guillemets.

database_name_here - Change ce paramètre en wordpress . Le site Web utilisera alors la base de données précédemment créée dans phpMyAdmin étiquetée comme telle.

username_here - Change cela en root . Le nom d'utilisateur root possède les privilèges d'administrateur appropriés par défaut, il sera donc autorisé via phpMyAdmin. Les autres noms d'utilisateur ne fonctionneront pas à moins d'avoir reçu les autorisations appropriées.

password_here - Change cela en un mot de passe facilement identifiable. Si vous préférez ne pas utiliser de mot de passe, supprimez le paramètre.

Enregistrez ce fichier en tant que wp-config.php - par opposition à wp-config-sample.php précédent - et quittez. Ensuite, dirigez-vous vers l'adresse localhost suivante: http: // localhost / wordpress .

Procéder à l'installation, y compris la création de votre nom d' utilisateur et mot de passe WordPress. Vous pouvez entrer les valeurs que vous préférez. Une fois que vous avez entré vos valeurs, cliquez sur le bouton Installer WordPress pour terminer le processus. Une fois cela fait, connectez-vous à votre WordPress local en utilisant le nom d'utilisateur et mot de passe donné sur la page précédente.

localhost wordpress

Vous avez terminé! Maintenant, vous pouvez passer votre contenu du cœur à modifier, modifier et créer des pages Web à partir de zéro et via WordPress, hors ligne, et gratuitement Les meilleurs plugins WordPress Les meilleurs plugins WordPress En savoir plus!

Le développement Web commence avec une seule page

Avant, vous débutiez tout juste votre parcours de développement web. Maintenant, vous avez créé un serveur local sur votre PC grâce auquel vous pouvez créer, modifier et adapter des pages Web à votre guise. Le meilleur de tous, vous êtes complètement en contrôle. La seule chose qui reste est de commencer votre expérimentation, alors allez-y!

Quel logiciel utilisez-vous pour le développement web? Avez-vous des conseils pour les futurs développeurs? Faites-nous savoir dans les commentaires ci-dessous!

Crédits image: Dmitry Tishchenko / Shutterstock

In this article