Angular Lib: Utilitaires

Dans cette section vous pouvez trouver des utilitaires qui se concentrent sur un besoin spécifique mais récurent lors du développement d’application web.

• angularfire est la bibliothèque Angular officielle pour Firebase, elle offre un wrapper pour utiliser les différentes fonctionnalités de Firebase de façon convenante aux conventions Angular. Avec cette librairie ajoutez facilement des modules complexes tels que l’authentification, les base de données, le temps-réel, le monitoring, la publicité et plus encore... angularfire
• angular/cdk est l'infrastructure de composants officielle pour Angular créée par l'équipe Angular. Le CDK est une bibliothèque très utile qui vous aide à créer des composants d'interface utilisateur personnalisés avec des modèles d'interaction courants tels que le responsive, le scrolling, l'accessibilité... angular/cdk
• ngx-feature-toggle est un module Angular pour gérer les bascules de fonctionnalités dans les applications de manière normalisée. ngx-feature-toggle
• ng-feature-flags est une autre bibliothèque Angular qui facilite la création de feature flags de manière normalisée. ng-feature-flags
• ng-keyboard-shortcuts est un module Angular qui fournit une API déclarative utilisant des composants / directive pour gérer les raccourcis clavier de manière évolutive. ng-keyboard-shortcuts
• angular2-hotkeys est une autre bibliothèque qui aide à l'intégration de la combinaison de raccourcis clavier dans les applications Angular. angular2-hotkeys
• ngneat/hotkeys est une autre bibliothèque qui veut faciliter la création de raccourcis dans votre application grâce à une directive et un service de raccourcis clavier personnalisables. ngneat/hotkeys
• ngx-template-streams est une bibliothèque pour une utilisation déclarative d'événements, tels que des événements DOM natifs, ou les outputs de composants de manière réactive en utilisant observable. ngx-template-streams
• ng-dynamic-component est une bibliothèque qui permet d'utiliser des composants dynamiques avec une prise en charge complète du cycle de vie pour les inputs et les outputs. ng-dynamic-component
• property-watch-decorator est une bibliothèque qui fournit un décorateur OnChange qui peut être facilement utilisé pour écouter des propriétés de classe. property-watch-decorator
• angular-formatter-parser fournit une option pour se connecter au flux de valeur des inputs et d'autres éléments html "modifiables". C'est un outil idéal pour formater des inputs telles que l'ajout d'espacement au numéro de téléphone ou à la carte de crédit. angular-formatter-parser
• ngx-route-params-input permet d'utiliser facilement les paramètres du routeur Angular et les paramètres de query comme input de composant avec moins de code boilerplate. ngx-route-params-input
• ng-effects est une bibliothèque qui permet d'écrire du code plus réactif en Angular. ng-effects
• ng-polymorpheus est une minuscule bibliothèque de modèles polymorphes en Angular. Il aide à écrire des composants agnostiques aux données et à la conception afin d'aider votre équipe à écrire des composants plus génériques et réutilisables. ng-polymorpheus
• ngx-responsive est une bibliothèque qui contient un surensemble de directives responsive afin d'afficher ou de masquer des éléments selon la taille de l'écran de l'appareil ou selon les informations de l'appareil. ngx-responsive
• ng-event-bus est un service de bus de messages basé sur RxJS pour Angular. Il permet de centraliser la communication entre tous les services et composants d'une application. ng-event-bus
• ngx-dynamic-hooks est un utilitaire pour insérer automatiquement des composants Angular vivants dans une chaîne de caractères dynamique et rendre le résultat dans le DOM. ngx-dynamic-hooks
• workers est une petite librairie avec de grand avantage, en effet elle offre une usage confortable de l'API Web Workers. workers
• flex-layout est une bibliothèque Angular officielle qui fournit une disposition d'interface utilisateur HTML pour les applications Angular utilisant Flexbox et une API réactive. flex-layout
• angular-hmr est une bibliothèque qui fournit le rechargement de modules à chaud pour Webpack et Angular. Cela permet d'améliorer l'expérience de développement par exemple en préservant l'état pendant le rafraîchissement. A partir de Angular 11 ce paquet n'est plus utile car le HMR a été introduit dans Angular CLI. angular-hmr
• observable-webworker est une bibliothèque qui offre une API réactive simplifiée pour travailler avec les Web Workers. observable-webworker
• ng-web-apis/speech est une bibliothèque permettant d'utiliser l'API Web Speech avec Angular.ng-web-apis/speech
• ng-web-apis/permissions est une bibliothèque permettant d'utiliser l'API Permissions dans les applications Angular. ng-web-apis/permissions
• runtime-config-loader est une bibliothèque qui fournit un moyen simple d'intégrer une configuration d'exécution via un fichier json dans votre application Angular. runtime-config-loader
• ngx-device-detector est une bibliothèque utilitaire qui fournit un moyen simple de détecter les détails de l'appareil, du système d'exploitation et du navigateur... ngx-device-detector
• ngx-reexportr est une directive Angular simple similaire à NgRx/component qui permet de réexporter une entrée observable donnée en tant que nouvelle variable. ngx-reexportr
• ngneat/overview est un ensemble de fonctions visant à rendre les vues Angular plus modulables, évolutives et maintenables : dynamicView est une directive pour rendre un composant dynamiquement. teleportOutlet est une directive pour rendre une vue à un emplacement différent de sa déclaration. createComponent est une méthode de service qui permet d'instancier un composant par programmation et de l'injecter dans le DOM ou dans une bibliothèque tierce. ngneat/overview
• ng2-idle est une bibliothèque utilitaire destinée à gérer les utilisateurs inactifs dans les applications Angular. ng2-idle

Pipes, Directives & Decorators

• ngx-pipes est une collection de pipes utiles pour Angular sans dépendances externes. La bibliothèque est divisée en différents modules afin que vous puissiez ajouter le tout ou uniquement les types de pipes dont vous avez besoin.ngx-pipes
• safe-pipe est un pipe Angular prévue pour désinfecter votre contenu dangereux. En effet le pipe prend en paramètre le type de contenu qui peut être soit html, css, script ou url et va retourner en résultat un contenu sécurisé. safe-pipe
• ng-inline-svg est une directive Angular pour insérer un fichier SVG en ligne dans un élément.ng-inline-svg
• ngx-date-fns est une librairie basée sur la librairie moderne date-fns et offre un pipe Angular pour l'affichage de date et heure d'une manière pratique. ngx-date-fns
• ngx-moment est une bibliothèque qui fournit un ensemble de pipes moment.js utiles pour Angular. ngx-moment
• luxon-angular Luxon est une collection de pipes de date/heure pour Angular basée sur Luxon, un wrapper puissant, moderne et convivial pour les dates et heures en Javascript. luxon-angular
• ngneat/helipopper est un wrapper pour tippyjs qui fournit une directive appelée tippy et vous permet de créer des infobulles, des menus, des listes déroulantes et des popovers puissants et personnalisables pour vos applications. ngneat/helipopper
• ng2-tooltip-directive est une autre bibliothèque pour faciliter la création d'info-bulles dans Angular via une simple directive appelée tooltip. ng2-tooltip-directive
• ngneat/from-event est une petite bibliothèque qui fournit un décorateur appelé FromEvent destiné à être utilisé avec le ViewChild ou le ContentChild standard du framework Angular afin de mapper directement les événements de l'interface utilisateur dans un flux RxJS sans avoir à écrire le boilerplate standard pour le faire. ngneat/from-event
• ngneat/copy-to-clipboard est une autre petite bibliothèque créée par ngneat qui fournit une seule directive appelée copyToClipboard destinée à simplifier la copie de texte à partir d'une application Web. ngneat/copy-to-clipboard
• ng-directives est une collection de directives qui peuvent être utilisées dans différents scénarios, par exemple pour afficher une flèche de delta de valeur, un bouton pour passer en plein écran, un élément conditionnel basé sur des autorisations ou mettre un texte en surbrillance. ng-directives

Utilitaires mixtes

Dans cette section vous pouvez retrouver des utilitaires divers et variés qui offrent plusieurs types d’extensions sans rapport spécifique. Le développeur a probablement préféré rassembler son travail dans un unique repository pour faciliter le travail de maintenance de son travail.

• ng-helpers est une bibliothèque qui fournit différents helpers (composant fragment, helpers NgRX) pour travailler avec des projets Angular. Ces helpers ont pour but d'accélerer le développement ou de résoudre des problèmes délicats. ng-helpers
• mindspace-utils est une bibliothèque qui fournit divers utilitaires (untilViewDestroyed, switchCase, eventBus) pour travailler avec des projets Angular et qui permettent d'écrire du code plus propre. mindspace-utils
• ngrx-utils est une bibliothèque qui fournit divers utilitaires (routerLinkMatch, push pipe, let directive) pour travailler avec des projets Angular ngrx-utils
• rx-angular est une bibliothèque qui fournit un ensemble d'aides (Reactive Component State, Reactive Template Rendering) pour gérer des applications Angular entièrement réactives avec l'accent principal sur les performances d'exécution et le rendu de modèle. rx-angular
• wishtack-steroids est une bibliothèque qui fournit divers assistants (reactive-component-loader, rx-scavenger, scam schematics) wishtack-steroids
• ng-stack contient plusieurs projets tels qu'une directive contenteditable pour rendre toute balise HTML modifiable, api-mock pour aider au développement de tests et enfin un wrapper de formulaire pour des typages plus forts. ng-stack
• herodevs-packages est un ensemble de packages réalisés par la société HeroDevs, un groupe de consultants Angular / frontend de niveau expert. herodevs-packages
• myndpm/open-source est un ensemble de bibliothèques rendues open source par la société Mynd. Pour le moment, il n'y a qu'une seule bibliothèque appelée dyn-forms qui vise à être une couche abstraite pour générer facilement des formulaires dynamiques pour Angular. myndpm/open-source
• ngx-betalabs est un petit référentiel qui contient des fichiers utilitaires pour travailler avec Angular. Par exemple, vous trouverez une implémentation du célèbre take-until-destroy ainsi qu'une autre fonction utilitaire appelée observable-input. ngx-betalabs
• trellisorg/platform est un ensemble d'outils rendus open source par la société Trellis. Vous trouverez à l'intérieur du référentiel de nombreuses bibliothèques très intéressantes liées à Angular, NX, NgRx et même Nest. trellisorg/platform
• daffodil/packages est un ensemble de packages indépendants relatifs au ecommerce publiés par Graycore lors du développement de leur framework PWA Angular Ecommerce appelé Daffodil. https://github.com/graycoreio/daffodil#packages
• ngx-lib-workspace contient des utilitaires notamment pour styliser une application Angular. https://github.com/abdulnijamudeen/ngx-lib-workspace