INTRODUCTION
AU NODEJS
LANGAGE JAVASCRIPT
Introduction
[Link] est un environnement d'exécution JavaScript qui
permet d'exécuter du JavaScript côté serveur (en dehors du
navigateur).
• Permet de créer des serveurs, des API, des applications temps
réel, etc.
• Fonctionne avec un système d'événements rapide et non
bloquant.
Installation
1. Aller sur : [Link]
2. Télécharger la version LTS.
3. Vérifier l'installation :
node -v
npm -v
npm, c’est quoi ?
npm signifie Node Package Manager.
C’est le gestionnaire de paquets officiel de [Link]. Il
permet :
✓ D’installer des librairies (ou "paquets") créées par
d'autres développeurs.
✓ De gérer les dépendances d’un projet (ex. : Express,
Axios, etc.).
✓ De partager ton propre code en tant que paquet
réutilisable.
Quelques commandes utiles
Commande Description
npm init Initialise un projet [Link]
Installe tous les paquets listés dans
npm install
[Link]
npm install <nom> Installe un paquet spécifique
npm uninstall <nom> Supprime un paquet
npm run <script> Exécute un script défini dans [Link]
Premier script [Link]
Code : [Link]
[Link]("Bonjour depuis [Link] !");
Explication :
• [Link]() permet d'afficher un message dans le
terminal.
• Ce fichier est un simple script [Link].
Exécution :
node [Link]
Modules natifs : os
Code : [Link]
const os = require("os");
[Link]("Plateforme :", [Link]());
[Link]("Mémoire libre :", [Link]());
Explication :
• require("os") importe le module système.
• [Link]() donne le système (Windows, Linux...).
• [Link]() donne la mémoire vive libre.
Créer un serveur HTTP
Code : [Link]
const http = require("http");
const server = [Link]((req, res) => {
[Link](200, {"Content-Type": "text/plain"});
[Link]("Bienvenue sur le serveur [Link] de ouadi !");
});
[Link](3000, () => {
[Link]("Serveur en écoute sur [Link] });
Explication :
• [Link]() crée un serveur.
• req est la requête reçue, res est la réponse à envoyer.
• writeHead() définit le type de réponse (texte ici).
• listen(3000) met le serveur sur le port 3000.
Exemple concret
Imaginons que tu veux créer un serveur web.
Tu pourrais utiliser Express, une bibliothèque très populaire.
Voici comment tu ferais avec npm :
npm init -y
npm install express
Cela va :
[Link]éer un dossier node_modules/ avec les dépendances.
[Link] "express" dans le fichier [Link].
TP [Link]
avec
Express et npm
Créer le dossier du projet
Ouvre ton terminal , puis tape :
mkdir tp-node
cd tp-node
Initialiser le projet avec npm
npm init –y
Cela va créer un fichier [Link] contenant
les infos de base du projet.
Créer le dossier du projet
Ouvre ton terminal , puis tape :
mkdir tp-node
cd tp-node
Initialiser le projet avec npm
npm init –y
Cela va créer un fichier [Link] contenant
les infos de base du projet.
Installer Express
npm install express
Cela ajoute Express à ton projet et met à jour
[Link].
Créer [Link]
Crée un fichier [Link] et copie le code suivant :
const express = require('express');
const app = express();
[Link]('/', (req, res) => { [Link]('Bienvenue sur la page d\'accueil’); });
[Link]('/about', (req, res) => { [Link]('Page À propos’); });
[Link]('/contact', (req, res) => { [Link]('Page Contact’); });
const PORT = 3000;
[Link](PORT, () => {
[Link](`Serveur démarré sur [Link] });
Lancer le serveur
Dans le terminal :
node [Link]
Tester dans le navigateur
Ouvre ton navigateur et tape les URL suivantes :
•[Link]
•[Link]
•[Link]
Objectif du TP
Créer un mini site avec trois pages HTML accessibles via
un serveur Express :
URL Page affichée
/ Accueil
/about À propos
/contact Contact
Structure du projet final
mon-site-html/
├── node_modules/
├── public/
| ├── [Link]
| ├── [Link]
| └── [Link]
├── [Link]
├── [Link]
Créer le dossier et initialiser le projet
mkdir mon-site-html
cd mon-site-html
npm init –y
Installer Express
npm install express
Créer les fichiers HTML
Crée un dossier public/ :
mkdir public
public/[Link]
On cree un fichier html du nom index dans public.
<!DOCTYPE html>
<html>
<head> <title>Accueil</title></head>
<body> <h1>Bienvenue sur la page d'accueil</h1>
<a href="/about">À propos</a> |
<a href="/contact">Contact</a>
</body>
</html>
public/[Link]
<!DOCTYPE html>
<html>
<head><title>À propos</title></head>
<body>
<h1>À propos de nous</h1>
<a href="/">Accueil</a> |
<a href="/contact">Contact</a>
</body>
</html>
public/[Link]
<!DOCTYPE html>
<html>
<head><title>Contact</title>
</head>
<body>
<h1>Contactez-nous</h1>
<a href="/">Accueil</a> |
<a href="/about">À propos</a>
</body>
</html>
Créer [Link]
const express = require('express’);
const path = require('path’);
const app = express();
[Link]([Link]([Link](__dirname, 'public')));
[Link]('/', (req, res) => { [Link]([Link](__dirname, 'public’,
'[Link]'));});
[Link]('/about', (req, res) => { [Link]([Link](__dirname, 'public’,
'[Link]'));});
[Link]('/contact', (req, res) => { [Link]([Link](__dirname, 'public’,
'[Link]'));});
const PORT = 3000;
[Link](PORT, () => { [Link](`Serveur lancé sur [Link]
Créer [Link]
const express = require('express’);
const path = require('path’);
const app = express();
[Link]([Link]([Link](__dirname, 'public')));
[Link]('/', (req, res) => { [Link]([Link](__dirname, 'public’,
'[Link]'));});
[Link]('/about', (req, res) => { [Link]([Link](__dirname, 'public’,
'[Link]'));});
[Link]('/contact', (req, res) => { [Link]([Link](__dirname, 'public’,
'[Link]'));});
const PORT = 3000;
[Link](PORT, () => { [Link](`Serveur lancé sur [Link]
}
);
Ajoute un middleware (fonction qui
[Link](...)
intercepte les requêtes HTTP).
Middleware fourni par Express pour
servir des fichiers statiques (fichiers
[Link](...)
que le serveur ne modifie pas, comme
HTML, CSS, images, etc).
Construit le chemin complet vers le
[Link](__dirname, 'public') dossier public, peu importe le système
d’exploitation.
