AngularJS vous permet d’écrire des applications web côté client comme si vous aviez un navigateur plus intelligent. Il vous permet d’utiliser de bons vieux HTML (ou HAML, Jade/Pug et compagnie !) comme langage de modèle et d’étendre la syntaxe HTML pour exprimer clairement et succinctement les composants de votre application. Il synchronise automatiquement les données de votre interface utilisateur (vue) avec les objets JavaScript (modèle) grâce à la liaison de données à deux sens. Pour vous aider à mieux structurer votre application et la rendre facile à tester, AngularJS apprend au navigateur comment faire l’injection de dépendances et l’inversion de contrôle.
Il aide également à la communication côté serveur, en maîtrisant les rappels asynchrones avec les promesses et les objets différés. Il facilite également la navigation côté client et les liens profonds avec les URL hashbang ou HTML5 pushState. Et le meilleur dans tout ça ? Il rend le développement amusant !
Le support officiel d’AngularJS a pris fin en janvier 2022. Consultez l’annonce de fin de vie pour comprendre ce que cela signifie.
Visitez angular.io pour Angular, activement soutenu.
Documentation
Rendez-vous sur https://docs.angularjs.org pour accéder à la documentation complète d’AngularJS.
Contribuer
Nous avons mis en place un document séparé pour nos directives de contribution.
Développement
Nous avons également créé un document séparé pour les développeurs.
Pourquoi utiliser AngularJS et quand l’utiliser ?
AngularJS est le framework de la prochaine génération où chaque composant est conçu pour fonctionner avec tous les autres composants de manière interconnectée, comme une machine bien huilée. AngularJS facilite la création de JavaScript MVC, et le fait bien (en réalité, ce n’est pas vraiment du MVC, mais nous y reviendrons).
MVC, non, MV* fait correctement !
MVC, pour Modèle-Vue-Contrôleur, est un modèle de conception, c’est-à-dire comment le code doit être organisé et comment les différentes parties d’une application doivent être séparées pour une lisibilité et un débogage appropriés. Le modèle représente les données et la base de données. La vue représente l’interface utilisateur et ce que l’utilisateur voit. Le contrôleur est le lien principal entre le modèle et la vue. Ce sont les trois piliers des frameworks de programmation majeurs présents sur le marché aujourd’hui. En revanche, AngularJS fonctionne sur MV*, pour Modèle-Vue-Quoi que ce soit. Le “Quoi que ce soit” est la manière d’AngularJS de dire que vous pouvez créer n’importe quel type de lien entre le modèle et la vue ici.
Contrairement aux autres frameworks dans n’importe quel langage de programmation, où les trois composants séparés du MVC doivent être écrits puis connectés par le programmeur, AngularJS aide le programmeur en lui demandant simplement de les créer et tout le reste sera pris en charge par AngularJS.
Interconnexion avec HTML au niveau racine
AngularJS utilise HTML pour définir l’interface utilisateur. Il permet également au programmeur d’écrire de nouvelles balises HTML (directives AngularJS) afin d’améliorer la lisibilité et la compréhension du code HTML. Les directives sont le moyen d’AngularJS d’apporter des fonctionnalités supplémentaires à HTML. Elles nous permettent d’inventer nos propres éléments HTML. Cela contribue également à rendre le code DRY (Don’t Repeat Yourself), ce qui signifie qu’une fois créée, une nouvelle directive peut être utilisée n’importe où dans l’application.
HTML est également utilisé pour déterminer le câblage de l’application. Des attributs spéciaux dans HTML déterminent où charger l’application, quels composants ou contrôleurs utiliser pour chaque élément, etc. Nous spécifions “quoi” charger, mais pas “comment”. Cette approche déclarative simplifie énormément le développement de l’application de manière WYSIWYG. Au lieu de passer du temps à comprendre le flux du programme et à orchestrer les différentes parties en mouvement, nous définissons simplement ce que nous voulons et AngularJS se charge des dépendances.
Manipulation des données simplifiée
Les données et les modèles de données dans AngularJS sont des objets JavaScript simples et on peut ajouter et modifier des propriétés directement dessus, et boucler sur des objets et des tableaux à volonté.
Liaison de données à deux sens
L’une des fonctionnalités les plus puissantes d’AngularJS. La liaison de données à deux sens signifie que si quelque chose change dans le modèle, le changement est immédiatement reflété dans la vue, et vice versa. Cela s’appelle également la programmation réactive, c’est-à-dire que si a = b + c est en train d’être programmé et que la valeur de b et/ou c change ensuite, la valeur de a sera automatiquement mise à jour pour refléter le changement. AngularJS utilise ses “scopes” comme colle entre le modèle et la vue et rend ces mises à jour dans l’un disponibles pour l’autre.
Moins de code écrit et code facilement maintenable
Tout dans AngularJS est conçu pour permettre au programmeur de réduire la quantité de code écrit, qui est ainsi facilement maintenable et lisible par toute autre personne nouvelle dans l’équipe. Croyez-le ou non, on peut écrire une application complète à liaison de données à deux sens en moins de 10 lignes de code. Essayez et voyez par vous-même !
Prêt pour les tests
AngularJS dispose de l’injection de dépendances, c’est-à-dire qu’il se charge de fournir toutes les dépendances nécessaires à ses contrôleurs et services chaque fois que nécessaire. Cela facilite les tests unitaires du code AngularJS en utilisant des dépendances simulées créées et injectées. Cela rend AngularJS plus modulaire et facilement testable, aidant ainsi une équipe à créer des applications plus robustes.
