Fermer

juillet 2, 2018

Le quoi et le comment des schémas angulaires


Si vous êtes un développeur Angular moyen qui n'a pas encore atteint le niveau d'éclairage de l'utilisateur, cet article est pour vous! Si vous avez entendu parler d'un mot de trois syllabes (schémas) mais n'avez pas compris ce qu'il fait ou comment cela fonctionne, alors cet article est aussi pour vous! Nous allons couvrir les bases de ce que sont les schémas et ce que vous pouvez en faire.

Qu'est-ce que les schémas?

Si vous avez été dans la communauté angulaire pendant une minute, vous avez probablement entendu parler de Schémas Mais que sont-ils et, plus important encore, à quoi pouvons-nous les utiliser?

Si vous recherchez le terme "Angular Schematics", vous vous retrouverez inévitablement au Ango DevKit repo sur GitHub :

Prochaine étape: comprendre la relation entre la CLI angulaire, Angular Schematics et ce nouveau joueur – le DevKit.

Eh bien, le DevKit est simplement un ensemble de bibliothèques pour "gérer, développer, déployer et analyser votre code "et contient actuellement la CLI et les schémas. Tout cela est bien et dandy, mais comment le CLI s'intègre-t-il dans cette histoire?

Les potes CLI ont créé des schémas pour être un moyen plus «puissant et générique» pour soutenir l'échafaudage CLI. Vous pouvez lire sur les quatre raisons pour lesquelles dans l'article, Schematics – An Introduction par Hans Larsen .

Schematics

Donc, nous savons pourquoi les schémas ont été créés et pour quoi l'équipe de CLI les utilise, mais pourquoi pas pour nous? J'aime comment Tomas Trajan l'a dit, il a dit Les schémas sont une "recette" pour générer et modifier des fichiers dans votre projet. Vous appelez cette recette avec cette commande: ng generate .

Schematics Collection

Si vous avez entendu parler de Schematics, vous avez peut-être entendu parler de collections. Une collection de schémas est simplement un projet qui contient au moins un schéma.

Les collections schématiques sont généralement juste une collection de schémas nommés que les gens publient et permettent à d'autres de les installer ensuite. L'équipe Angular maintient la collection officielle @ schematics / angular qui contient des composants schématiques, des modules et des applications. Mais les utilisateurs normaux comme vous et moi pouvons tirer parti des schémas et les rendre disponibles pour l'utilisation dans le MONDE

Quelles sont les choses utiles que vous pouvez faire avec les schémas angulaires?

Comprendre la définition des schémas n'est qu'une partie de la compréhension ce qu'ils sont vraiment. Pour bien comprendre, vous devez aussi savoir ce que vous pouvez faire avec Schematics. Cette section suivante couvre une petite liste de ce que vous pouvez faire avec Schematics, bien qu'il puisse être plus facile de demander "Que ne pouvez-vous pas faire?" que de répondre "Que pouvez-vous faire?"

Nx par Nrwl

Vous pouvez utiliser Schematics pour créer une bibliothèque de services. Un exemple parfait de ceci est la société Nrwl. Ils ont créé Nx qui est une collection de schémas et de services d'assistance qui structurent un projet CLI angulaire pour permettre la construction à l'échelle et avec plusieurs équipes et applications.

Si vous souhaitez essayer Nx , utilisez ng add @ nrwl / schematics pour ajouter les goodies Nx à votre projet et configurez l'espace CLI angulaire pour qu'il soit au format Nx. De là, vous pouvez utiliser les schémas fournis par Nx pour ajouter des applications, des bibliothèques et d'autres éléments courants (comme ngrx, etc.).

Nx a également plusieurs binaires (ce sont des scripts en ligne de commande, comme lui-même) qui peut être exécuté dans la ligne de commande pour ne faire que des applications de test affectées par le code modifié dans une validation, générer un diagramme de visualisation des données de votre application et des bibliothèques, format et code de charpie. – Justin Schwartzenberger

Avec Schematics, une utilisation très courante est d'activer les commandes de construction pour votre bibliothèque ou service (comme ng add et ng update ). Vous pouvez également générer des squelettes de projet avec l'environnement configuré pour être déjà configuré avec la dernière version, pas besoin de passer des heures à parcourir des documents obsolètes! Enfin, comme le dit Gianna Ciaramello, «Les schémas peuvent également être utilisés pour introduire et appliquer facilement des conventions à l'échelle du projet.»

Créez votre propre schéma!

Si vous souhaitez donner un plan à Schematics, il vous suffit de suivre ces trois étapes simples pour y aller! Tout d'abord, en utilisant le nœud 6.9 ou supérieur, installez l'outil de ligne de commande Schematic:

 npm install -g @ angular-devkit / schematics-cli  

Maintenant que nous avons installé l'outil de ligne de commande, nous avons accès à cet exécutable génial qui va créer un projet schématique vide:

 schémas vide --name = my-awesome-component  

On peut voir la pièce créée dans notre projet:

Cas d'utilisation: comment nous utilisons des schémas pour l'interface utilisateur de Kendo

Pour donner un autre exemple d'une entreprise cool utilise Schematics au profit des utilisateurs, vous ne devez pas chercher plus loin que ce site web! Kendo UI utilise Angular Schematics pour s'assurer que ng add fonctionne correctement pour tous nos paquets. Comme nous le mentionnons ici cela passe par toutes les étapes appropriées pour s'assurer que vous êtes parti pour les courses avec nos composants une fois que vous ng ajouter n'importe lequel d'entre eux à votre projet. 19659002] Nous avons aussi des dépendances sur d'autres UI Kendo pour les paquets angulaires. En utilisant Schematics, il simplifie l'ajout de nos références dans le module d'application, et il simplifie également l'utilisation de nos thèmes avec la configuration angular.json . Tous ces points sont des points où quelqu'un pourrait entrer et essayer l'interface utilisateur de Kendo pour Angular, rencontrer des problèmes de configuration et abandonner. Mais avec Schematics, nous pouvons nous assurer que les gens ont une bonne expérience de démarrage. Les schémas nous aident également à nous assurer que les projets sont bien établis. ?

Tout autour, les schémas sont un outil assez puissant que cette fille pense être actuellement sous-utilisé dans notre industrie angulaire. Je pense que de plus en plus de gens les essaieront, plus ils deviendront populaires. Nous sommes ici sur l'équipe Kendo UI, c'est sûr que nous les aimons!


Les commentaires sont désactivés en mode prévisualisation.
[ad_2]
Source link