Publicité

Tu veux construire un site web 10 façons de créer un petit site Web simple et sans excèsWordPress peut être exagéré. Comme le prouvent ces autres excellents services, WordPress n'est pas la finalité de la création de sites Web. Si vous voulez des solutions plus simples, il existe une variété de choix. Lire la suite , mais vous ne savez pas par où commencer?

Il semble que le terrain de formation en développement Web typique soit aussi le plus cher: acheter un domaine, un serveur hôte, un compte WordPress, un thème, etc. Mais que se passe-t-il si vous n'êtes pas propriétaire d'une petite entreprise ou si vous essayez de créer une marque? Et si vous essayez simplement d'apprendre le développement Web, sans encombrement?

Lisez la suite pour savoir comment hébergez votre propre site web 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édéfinis, sur votre ordinateur et gratuitement. Oh, cela inclut également l'hébergement de votre propre compte WordPress!

instagram viewer

XAMPP: une introduction

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

Bien que la configuration d'un serveur local à l'aide de XAMPP soit quelque peu technique, le processus est également assez simple et direct. Une fois que tout est configuré, vous constaterez que la gestion et la modification de sites Web sont un jeu d'enfant.

Il y a ensuite la question d'un contrôle rapide et complet. En utilisant XAMPP pour créer et modifier des sites Web, vous pourrez modifier autant ou aussi peu de sites Web que vous le souhaitez. Cela dit, une grande puissance s'accompagne d'une grande responsabilité. Vous êtes également plus susceptible de perdre vos sites, surtout si vous ne le faites pas. créer des sauvegardes Le guide ultime de sauvegarde de données Windows 10Nous 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 conseils simples et ne désespérez plus jamais des données perdues! Lire la suite .

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

Installation de XAMPP

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

Dans la fenêtre de votre panneau de contrôle XAMPP, vous devriez voir une présentation simple des processus XAMPP en cours d'exécution. Pour nos besoins, nous nous concentrerons sur les deux premières options: Apache et MySQL.

Apache - Le nœud principal de XAMPP, l'option Apache crée un serveur Apache sur votre PC. C'est ce qui vous permettra d'exécuter et de modifier des sites Web sur votre PC via des navigateurs Web, tout comme un site Web. Sauf, bien sûr, que ce site Web 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, permettant aux utilisateurs de tester et de stocker des e-mails, des mots de passe et toute autre entrée de données. Nous l'utiliserons pour votre compte WordPress local.

appuyez sur la Début dans votre panneau de contrôle XAMPP sous Actions pour Apache et MySQL. Attendez que Apache et MySQL soient surlignés en vert dans la section de votre module. Une fois activé, vous êtes libre d'utiliser XAMPP.

panneau de contrôle xampp

Localhost et phpMyAdmin

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

page Web par défaut de xampp

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

phpmyadmin

Laissez-les tranquilles 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 de lecteur 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 aurez besoin d'un éditeur de texte. Bien que vous puissiez utiliser un éditeur de texte par défaut comme le Bloc-notes, 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 conseils de texte sublime pour la productivité et un flux de travail plus rapideSublime Text est un éditeur de texte polyvalent et une référence pour de nombreux programmeurs. Nos conseils se concentrent sur un codage efficace, mais les utilisateurs généraux apprécieront les raccourcis clavier. Lire la suite . Texte sublime est l'un des meilleurs du monde, 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. Je vais utiliser le Roadtrip modèle, 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é le mien roadtrip - essayez de garder votre nom simple. Décompressez ensuite et extrayez le contenu de votre fichier zip dans ce dossier htdocs.

extrait au roadtrip

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

Enfin, rendez-vous sur votre page Web dans votre navigateur web Les meilleurs navigateurs Web pour WindowsQuel 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 principaux acteurs éprouvés. Quelles sont les meilleures alternatives pour l'utilisation des ressources, la vitesse et la sécurité? Lire la suite . Votre site Internet, pour ainsi dire, sera accessible en utilisant l'hôte local mentionné précédemment avec le nom du dossier contenant vos fichiers d'échange. En effet, les sites Web sont essentiellement des fichiers contenus dans des dossiers, tous sous un seul nom de domaine - 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 à éditer le site Web localement.

Modification de sites Web

Ouvrez Sublime Text. Se diriger vers Fichier et sélectionnez Dossier ouvert. Recherchez et sélectionnez votre dossier Web dans le dossier XAMPP. Vous pourrez désormais modifier plusieurs pages du même site Web dans votre éditeur de texte sublime.

texte sublime

Sublime Text fournit également une excellente interface pour 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 (à l'aide de la commande clavier Ctrl + S) et actualisez votre site Web dans le navigateur.

modifier le texte sublime localhost

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

Utilisez WordPress avec XAMPP

Si vous ne souhaitez pas modifier le code brut, ou 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 que 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 plus de clarté.

Utilisation de phpMyAdmin

Étant donné que WordPress nécessite que vous créiez des informations de connexion, vous devrez créer une entrée dans votre répertoire PHP pour la page Web. Se diriger vers votre page phpMyAdmin Configurer votre blog avec WordPress: le guide ultimeVous voulez créer votre propre blog mais vous ne savez pas comment? Regardez WordPress, la plateforme de blogging 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 Créer une base de données paramètre, entrez wordpress puis appuyez 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 de 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 réel afin que vous puissiez vous connecter et utiliser le site. Cela se fait via le fichier de configuration PHP principal de WordPress. Dans votre dossier WordPress, recherchez le fichier intitulé wp-config-sample.php, cliquez avec le bouton droit sur le fichier, sélectionnez Éditer (ou Ouvrir avec pour un éditeur de texte séparé). Le bloc-notes devrait très bien fonctionner.

Voici le code sur lequel nous allons nous concentrer:

// ** Paramètres MySQL - Vous pouvez obtenir ces informations auprès de votre hébergeur ** // / ** Le nom de la base de données pour WordPress * / définir ('DB_NAME', 'base_nom_ici'); / ** Nom d'utilisateur de la base de données MySQL * / define ('DB_USER', 'nom_utilisateur_ici'); / ** Mot de passe de la base de données MySQL * / define ('DB_PASSWORD', 'mot_de_passe'); 

Vous devrez apporter trois modifications au code ci-dessus dans le guillemet.

base_nom_ici - Modifiez 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.

nom_utilisateur_ici - Changez ceci en racine. 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 sans les autorisations appropriées.

mot_de_passe - Modifiez-le 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 sous wp-config.php - par opposition à la précédente wp-config-sample.php - et sortir. Ensuite, rendez-vous à l'adresse locale suivante: http://localhost/wordpress.

Poursuivez l'installation, y compris la création de votre WordPress Nom d'utilisateur et Mot de passe. Vous pouvez saisir les valeurs que vous préférez. Une fois que vous avez fini de saisir vos valeurs, cliquez sur le Installez WordPress pour terminer le processus. Une fois cela fait, connectez-vous à votre WordPress local en utilisant le nom d'utilisateur et le mot de passe fournis sur la page précédente.

localhost wordpress

Vous avez terminé! Maintenant, vous pouvez passer le contenu de votre cœur à éditer, modifier et créer des pages Web à partir de zéro et via WordPress, hors ligne et gratuitement Les meilleurs plugins WordPress Lire la suite !

Le développement Web commence par une seule page

Avant, vous commenciez 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. Mieux encore, vous contrôlez complètement. La seule chose qui reste est de commencer votre expérimentation, alors allez-y!

Vous avez décidé de ne pas passer par tout ce travail? Essayez l'un des les meilleurs services d'hébergement de sites Web gratuits Les meilleurs services d'hébergement de sites Web gratuits en 2019Voici les meilleurs services d'hébergement Web gratuits qui offrent beaucoup et ont une meilleure réputation que la plupart. Lire la suite au lieu.

Crédits image: Dmitry Tishchenko / Shutterstock

Christian est un ajout récent à la communauté MakeUseOf et un lecteur avide de tout, de la littérature dense aux bandes dessinées de Calvin et Hobbes. Sa passion pour la technologie n'a d'égal que son envie et sa volonté d'aider; si vous avez des questions concernant (principalement) quoi que ce soit, n'hésitez pas à envoyer un courriel!