Êtes-vous prêt à passer vos compétences en hébergement web au niveau supérieur en utilisant un modèle CSS ? Héberger un site web professionnel n'a pas besoin d'être compliqué, et avec AWS EC2, vous pouvez avoir votre site web en ligne en un rien de temps !

Dans ce guide, je vais vous montrer comment héberger un site web en utilisant un modèle préconçu de CSS templates directement sur votre instance EC2.

Avant de plonger dans ce guide, assurez-vous d'avoir suivi mon précédent blog sur la façon de lancer et de se connecter à une instance EC2. Si vous n'avez pas encore configuré une instance EC2, rendez-vous d'abord sur ce post pour mettre votre instance en route. Une fois que c'est fait, vous êtes prêt à continuer !

Étape 1 : Télécharger le modèle "Built Better"

Pour ce tutoriel, nous utiliserons le modèle Built Better, qui est gratuit et facile à configurer.

Rendez-vous sur ce lien et téléchargez le modèle.

Faites un clic droit sur le bouton de téléchargement et sélectionnez "Copier le lien propre". Nous utiliserons ce lien pour télécharger le modèle directement dans votre instance EC2.

Étape 2 : Télécharger le modèle directement sur votre instance EC2

Maintenant que vous avez le lien vers le modèle, téléchargeons-le directement sur votre instance EC2 en utilisant wget.

Connectez-vous à votre instance EC2 via SSH ou MobaXterm (comme couvert dans mon précédent blog) et naviguez jusqu'au répertoire /var/www/html où vos fichiers de site web seront stockés :

cd /var/www/html

Utilisez la commande wget suivie du lien copié pour télécharger le modèle "Built Better" directement dans votre instance EC2 :

sudo wget https://www.free-css.com/assets/files/free-css-templates/download/page284/built-better.zip

Note : Après le téléchargement, il est bon de vérifier le nom du fichier pour s'assurer qu'il correspond au fichier utilisé dans les commandes suivantes. Vous pouvez le faire en exécutant la commande ls :

ls

Étape 3 : Décompresser les fichiers du modèle

Maintenant que le modèle a été téléchargé, il est temps de l'extraire. Installez l'utilitaire unzip s'il n'est pas déjà installé :

sudo dnf install unzip -y

Puis décompressez le modèle :

sudo unzip built-better.zip -d /var/www/html/

Après avoir décompressé, assurez-vous de vérifier le nom du dossier où les fichiers ont été extraits. Vous pouvez le faire en listant le contenu du répertoire /var/www/html :

ls /var/www/html/

Dans ce cas, le contenu décompressé se trouve dans un dossier nommé html. Ce dossier contient tous les fichiers du modèle. Si le nom du dossier est différent dans votre cas, ajustez les étapes suivantes en conséquence.

Tout d'abord, déplacez les fichiers du dossier html vers le répertoire racine /var/www/html/ :

sudo mv /var/www/html/html/* /var/www/html/

Ensuite, supprimez le dossier inutile :

sudo rm -r /var/www/html/html

Enfin, supprimez le fichier ZIP :

sudo rm built-better.zip

Étape 4 : Configurer le serveur web pour héberger votre modèle

Si ce n'est pas déjà fait, assurez-vous que votre serveur web Apache HTTPD est installé et en cours d'exécution. Vous pouvez suivre ces étapes pour vous assurer que votre serveur est prêt :

Installez Apache (si ce n'est pas déjà fait) :

sudo yum install httpd -y

Démarrez le service Apache :

sudo systemctl start httpd

Activez Apache pour qu'il démarre au démarrage :

sudo systemctl enable httpd

Votre serveur web devrait maintenant être opérationnel et prêt à servir votre modèle.

Étape 5 : Tester votre site web

Maintenant, la partie excitante : voir votre site en ligne ! Ouvrez un navigateur et accédez à l'adresse IP publique de votre instance EC2. Vous devriez maintenant voir le modèle Built Better en ligne et prêt à l'emploi.

Voici comment vérifier :

  • Trouvez l'adresse IP publique de votre instance EC2 à partir du tableau de bord AWS EC2.

  • Entrez l'IP dans votre navigateur, comme ceci : http://votre-ip-publique-ec2

  • Votre site web devrait maintenant être en ligne avec le modèle Built Better ! 🎉

Conclusion

Félicitations ! Vous avez réussi à héberger un site web professionnel en utilisant le modèle CSS Built Better sur votre instance EC2.

En seulement quelques étapes, vous êtes passé du lancement d'une instance EC2 à l'hébergement d'un site web entièrement stylisé, le tout en utilisant l'infrastructure cloud puissante d'AWS.

Vous pouvez me suivre sur :