Créer un site Web personnel en utilisant nodejs

En tant que développeur, avoir un site Web personnel est une chose très importante. Non seulement il peut être utilisé pour mettre en valeur vos compétences et votre expérience, mais il peut également servir de plateforme expérimentale pour essayer de nouvelles technologies et de nouveaux concepts.

De nos jours, Node.js devient de plus en plus populaire dans le développement Web, et de plus en plus de personnes choisissent de l'utiliser pour créer des sites Web personnels. Cet article vous expliquera comment utiliser Node.js et certains packages npm populaires pour créer votre propre site Web personnel.

1. Installez Node.js

Tout d'abord, nous devons installer Node.js. Vous pouvez trouver le package d'installation sur le site officiel de Node.js (https://nodejs.org/) et cliquer sur le bouton "Télécharger". Le processus d'installation est très simple, suivez simplement les instructions.

2. Créer un projet

Une fois Node.js installé, nous pouvons commencer à créer notre projet. Ouvrez un dossier vide et saisissez-le sur la ligne de commande. Ensuite, entrez la commande suivante :

npm init

Cela vous guidera pour créer un nouveau projet npm. Au cours de ce processus, vous devrez fournir des informations sur le projet, telles que le nom, le numéro de version, etc. Une fois terminé, vous trouverez un fichier package.json dans le dossier du projet contenant des métadonnées sur le projet.

3. Installer les dépendances

Ensuite, nous devons installer nos dépendances. Entrez la commande suivante dans la ligne de commande :

npm install express jade body-parser --save

Cela installera les packages Express, Jade et Body-parser afin que nous puissions créer des sites Web et faire circuler les données entre les sites Web. Notez que nous utilisons l'option --save pour ajouter ces packages aux dépendances du projet. Cela signifie que lorsque nous utilisons la commande npm install, ils sont installés ensemble.

4. Créer un serveur

Maintenant, nous pouvons commencer à créer notre serveur. Créez un nouveau fichier server.js et tapez le code suivant :

var express = require('express');
var app = express();

app.set('view engine', 'jade');

app.get('/', function(req, res) {
  res.render('index');
});

app.listen(3000, function() {
  console.log('Server started on port 3000');
});

Jetons un coup d'œil rapide à ce bloc de code.

var express = require('express');
var app = express();

Tout d'abord, nous utilisons la fonction require pour introduire le module Express et créer une nouvelle instance Express. Nous stockons cela dans une variable appelée app.

app.set('view engine', 'jade');

Ensuite, nous disons à Express que nous utiliserons le moteur de modèles Jade pour restituer nos vues. Nous utilisons la méthode app.set pour définir l'extension du moteur de vue et des fichiers modèles.

app.get('/', function(req, res) {
  res.render('index');
});

C'est notre routeur. Il indique à Express à quelles URL il doit renvoyer les réponses. Dans ce cas, nous le définissons sur le chemin racine "/". Lorsque le routeur reçoit la demande, il restitue notre vue Jade.

app.listen(3000, function() {
  console.log('Server started on port 3000');
});

Enfin, nous utilisons la méthode app.listen d'Express pour démarrer notre serveur. Nous définissons le port sur 3000 et imprimons un message sur la console pour indiquer que le serveur a démarré.

5. Créer une vue

Nous allons maintenant créer notre vue Jade. Jade est un moteur de modèles pour HTML qui utilise l'indentation pour organiser le code HTML. Créez un nouveau dossier de vues et créez un nouveau fichier appelé index.jade à l'intérieur. Tapez le code suivant :

html
  head
    title My Personal Website
  body
    h1 Hello, World!

Ceci est un exemple minimal de vue Jade. Il affiche uniquement un titre sur la page. Ici, nous voulons simplement dire que le moteur de modèles Jade génère du code HTML. Contrairement au HTML, Jade utilise l'indentation au lieu des balises.

6. Testez le site Web

Nous avons terminé toutes les étapes de construction. Il est maintenant temps de tester notre site Web. Entrez la commande suivante dans la ligne de commande :

node server.js

Cela démarrera notre serveur et le définira sur le port 3000. Maintenant, ouvrez votre navigateur et tapez « localhost:3000 » dans la barre d'adresse. Vous verrez la page afficher "Hello, World!".

Félicitations, nous avons utilisé avec succès Node.js et certains packages npm populaires pour créer notre site Web personnel !

Résumé

Dans cet article, nous avons appris à utiliser Node.js et certains packages npm populaires pour créer notre site Web personnel. Nous avons construit notre site Web étape par étape, depuis l'installation de Node.js jusqu'à la création d'un simple serveur Express et d'une vue Jade.

Bien sûr, ce n'est que le début. Vous pouvez utiliser des technologies et des packages plus avancés pour étendre les fonctionnalités et l’apparence de votre site Web. Mais vous savez maintenant comment créer votre site Web personnel. Que votre site Internet réussisse !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!