4.1. Le Module

Un module est une brique de votre application, qui une fois assemblée avec d’autres briques, forme une application à part entière. Chaque module est dédié à une fonctionnalité particulière.

Par exemple, la librairie @angular/core est une librairie Angular qui contient la plupart des éléments de base dont nous aurons besoin pour construire notre application. Si nous voulons créer un composant, il faudra importer la classe de base d’un composant depuis ce composant :

import { Component } from '@angular/core';

Souvent, on aura besoin d’importer des éléments depuis notre propre code, sans passer par une librairie. Dans ce cas on renseigne un chemin relatif à la place du nom de la librairie :

import { MaClasse } from './ce-dossier';

Heu … c’est quoi cette syntaxe exactement ?

On importe et exporte des éléments grâce à la syntaxe des modules ECMAScript 2015. Si ça ne vous avance pas beaucoup, sachez que cette syntaxe a vu le jour pour répondre à un problème précis.

Si vous avez déjà développé un site avec une grosse dose de JavaScript, vous vous êtes rendu compte que l’on se retrouve vite avec beaucoup de fichiers JavaScript qui dépendent tous les uns des autres, et on ne sait plus dans quel ordre les charger. Il a vite fallu améliorer l’organisation de ce code et les développeurs se sont tournés vers des outils comme require.js par exemple.

Vous n’avez pas besoin de connaître ces outils pour continuer à suivre le cours, mais sachez que nous utiliserons Webpack avec Angular, et que cet outil s’occupe pour nous de charger les modules et leurs dépendances.

ECMAScript 2015, ES6 ou ES2015 désignent le même standard, que je vous présenterai dans un chapitre dédié.