NodeJS + Express partie 1 : Introduction

Voici une série d'articles qui vous permettra créer des applications backend avec NodeJS + Express.

Cette série est la suite de ma série sur les bases de NodeJS. Si vous n'avez pas les connaissances de bases en NodeJS lisez cette série d'abord : Introduction à NodeJS

Node.js est aujourd'hui un incontournable, il est donc essentiel pour un développeur de le maitriser.

Je vais donc publier un nouvel article environ au deux jours et petit à petit vous apprendrez tout ce qu'il y a à savoir sur Node.js + Espress

Pour ne rien manquer suivez moi sur twitter : https://twitter.com/EricLeCodeur

Rappel: Qu'est-ce qu'un serveur web ?

Un serveur web est un ensemble matériel et logiciel qui permettent l'accès aux fichiers hébergés, page web et base de données stocké sur un ordinateur.

Le serveur web est constitué en autre d'un serveur HTTP. Le serveur HTTP est un logiciel qui comprend/reçoit les URL et les requêtes via le protocole HTTP (le protocole utilisé par le navigateur pour afficher les pages web).

Au niveau le plus simple, à chaque fois qu'un navigateur a besoin d'un fichier ou autre hébergé sur un serveur web, le navigateur fait la demande au serveur (on dit qu'il envoie une requête HTTP). Quand la requête atteint le serveur, le serveur HTTP la traite et renvoie le réponse.

En résumé, ce qu'il faut retenir c'est que bien que un serveur HTTP peut semblé compliqué, en faite ce n'est qu'un succession de requêtes et réponses. Vous verrez ici bas que NodeJS+Express vous permet très facilement de créer un serveur HTTP et qu'il est très facile d'y lire une requête et d'envoyer une réponse

Qu'est-ce que ExpressJS

EspressJS est un framework NodeJS qui permet de créer plus facilement des applications web. En effet, pourquoi ré-inventer la roue ? Avec ExpressJS vous avez accès à plusieurs fonctions qui vont facilité et réduire le temps de développement de votre application web. Créer un serveur HTTP avec Express c'est très simple.

Création d'une nouvelle application

Pour bien démontrer le potentiel d'ExpressJS et bien comprendre tous les concepts, nous allons construire une nouvelle application web complète.

D'abord créer un dossier pour accueillir votre application

$ mkdir demo-express
$ cd demo-express

La première étape est de créer le fichier package.json.

$ npm init

Ensuite, installation du package ExpressJS et nodemon

$ npm install express
$ npm nodemon

À noter que comme spécifié dans la section sur NodeJS, le package nodemon permet de recharger le serveur à chaque modification de notre code.

API vs SSR

Express peut être utilisé pour créer API JSON ou un site Web avec rendu côté serveur. Aujourd'hui, nous allons créer une API, c'est de loin le type d'application le plus créé avec Express.

Qu'est-ce qu'un API ?

API signifie Interface de programmation d'applications.

Bref, c'est un programme qui peut être utilisé par un autre programme, afin de permettre aux applications de dialoguer entre elles.

Une API permet au serveur et au client de communiquer entre eux et d'échanger des informations.

Par exemple, un client demande une page client spécifique sur le serveur : www.example.com/customers/3814

Le serveur peut-il savoir comment gérer cette requête ? Il ne le peut pas. Il ne saura pas quoi faire de la requête. C'est pourquoi nous devons créer une API. Il s'agit d'une application serveur qui déterminera comment répondre aux différentes requêtes concernant une ressource spécifique. Dans ce cas, retournez les informations client.

L'API que vous avez créée peut rechercher l'enregistrement 3814 dans la base de données client, convertir ces informations au format JSON (texte structuré) et renvoyer cette réponse au client.

Notez que toutes les requêtes aux serveurs sont effectuées via des actions HTTP.

requêtes HTTP

L'action que vous souhaitez effectuer sur la ressource indiquée. Bien que des noms soient également rencontrés, ces méthodes sont souvent appelées verbes HTTP.

Voici les verbes/actions HTTP les plus couramment utilisés

GET : Les requêtes GET sont utilisées que pour récupérer des données.

POST : Les requêtes GET sont utilisées pour envoyer des nouvelles données.

PUT : Les requêtes PUT sont utilisées pour modifier des données.

PATCH : Les requêtes PATCH sont utilisées pour modifier partiellement des données.

DELETE : Les requêtes DELETE supprime les données indiquées.

Architecture REST

Lorsque le client et le serveur se parlent, cela peut rapidement devenir incontrôlable.

Par exemple, le client peut faire une demande comme celle-ci : http://www.example/send-me-customer-3804-file ou une demande de suppression comme celle-ci : http://www.example.com/delete-customer=3815

Comment le serveur peut-il comprendre ces différentes requêtes ? Pour avoir une communication réussie, nous avons besoin de normes et de conventions.

C'est le rôle de l'architecture REST. REST est un ensemble de normes pour créer une API que le client et le serveur utiliseront.

Aujourd'hui, nous n'apprendrons pas tout sur REST, mais vous pouvez rechercher sur le Web pour plus d'informations si vous en avez besoin.

Pour les débutants, l'important est de savoir que la façon dont nous construisons notre API n'est pas basée sur des goûts ou des opinions personnelles, mais sur la norme d'architecture REST. Alors suivez-les et tout ira bien.

Conventions des routes CRUD

L'une de ces conventions REST est la façon dont les routes sont définies. Il existe des normes pour chaque voie d'action CRUD.

CRUD signifie Créer, Lire, Mettre à jour et Supprimer.

Lorsque nous traitons avec une ressource API. Par exemple Client. Chaque ressource Client a ses propres routes CRUD.

Voici un exemple de ces routes REST CRUD :

Create : POST www.example.com/customers

Read : GET www.example.com/customers/3814

Update : PUT www.example.com/customers/3814

Destroy : DELETE www.example.com/customer/3814

Vous avez donc maintenant une idée plus précise de ce qu'est une API.

Sur le serveur, l'API exposera toutes ces routes et fonctionnalités. Sur le front-end, l'application Web cliente demandera à ces API d'obtenir les données souhaitées.

Peut-être que pour l'instant le concept est encore un peu flou mais les choses deviendront plus claires lorsque nous construirons notre propre API

Votre premier API avec Express

Créez le fichier app.js et ajoutez le code suivant.

const express = require('express')
const app = express()

app.listen(5000, () => {
    console.log('server is listening on port 5000')
})

app.get('/api/products', (req, res) => {
    res.json([
        { name: 'iPhone', price: 800 },
        { name: 'iPad', price: 650 },
        { name: 'iWatch', price: 750 }
    ])
})

Dans ce code, le app.listen() va créer un serveur HTTP et lire les requêtes entrantes

Le app.get() définit un chemin URL qui retourne une liste de produit JSON.

Vous pouvez tester cette application avec

$ npx nodemon app.js

Accédez à localhost:5000/api/products, vous devriez voir une représentation JSON de la liste des produits

[
  {
    "name": "iPhone",
    "price": 800
  },
  {
    "name": "iPad",
    "price": 650
  },
  {
    "name": "iWatch",
    "price": 750
  }
]

Félicitations, vous venez de créer votre première API avec NodeJS + Express

Dans les prochains articles nous allons apprendre pas à pas tous les détails sur comment créer une API NodeJS+Express.

Conclusion

C'est tout pour aujourd'hui, suivez moi sur twitter : https://twitter.com/EricLeCodeur afin d'être avisé de la parution du prochain article (d'ici deux jours).