Premiers pas avec Grunt

Actuellement, quand on parle de développement web, il y a des facteurs qui nous obligent à dépendre d'un grand nombre de tâches que nous devons exécuter une fois que nous avons fait le code, et bien plus si nous utilisons JavaScript , car il existe différents outils dont nous avons besoin pour rendre notre application aussi optimale que possible.
Comme tout ce qui dépend de l'être humain a tendance à ne pas toujours être parfait et à être composé d'erreurs, nous cherchons toujours un moyen de construire des processus aussi propres que possible et de les automatiser, car des erreurs sont moins susceptibles d'être commises si nous mettons tout notre attention sur quelque chose une fois et ensuite nous laissons son exécution à une machine.

AGRANDIR

C'est là qu'il entre en jeu Grognement, qui n'est rien de plus que le résultat de cette recherche d'automatisation et de réduction des erreurs et des économies de main-d'œuvre. Créé en 2012, il a gagné en popularité jusqu'à aujourd'hui, c'est un élément presque essentiel de tout environnement contenant JavaScript comme langage de développement.
Qu'est-ce que Grunt ?C'est un outil pour la ligne de commande ou la console JavaScript qui est chargé d'exécuter des tâches répétitives et qui prennent beaucoup de temps, par exemple si l'on a besoin de minifier et de compresser le code JavaScript, chaque fois que nous modifions un fichier, nous devons exécuter ces deux tâches, avec Grognement c'est automatique, à chaque fois que nous modifions les fichiers Grognement est chargé d'exécuter ces tâches.
Grâce à ce genre de fonctionnalité Grognement a trouvé un grand accueil dans le monde du développement, en particulier ceux qui fondent leur développement autour de JavaScript avec des environnements comme Node.js o CoffeeScript, qui a conduit à une grande communauté avec plus de 2000 plugins dans les référentiels npm qui fonctionnent avec Grognement.
Les applications Web d'aujourd'hui augmentent non seulement en taille mais aussi en complexité, ce qui nous amène à développer une quantité de code et à construire des outils qui dépassent la limite humaine pour une revue exhaustive, c'est pourquoi le développement basé sur les tests apparaît ou ATS, et de la même manière, il y a des tâches supplémentaires qui n'ont pas à voir avec le code qui nous permettent d'optimiser notre application.
Grognement nous aide dans la deuxième partie de la démarche, nous permet de réduire le temps que nous devons investir dans l'exécution des tâches, et nous aide ainsi à respecter le principe SEC, pour ne pas nous répéter. C'est pourquoi nous devons utiliser Grognement pour gagner du temps et réduire notre probabilité de faire des erreurs.
Nous savons déjà ce que c'est et pourquoi nous devrions l'utiliser, mais il y a encore un peu plus à dire Grognement, où l'une des choses les plus importantes est de savoir quels avantages cela nous apporte, d'une plus grande cohérence dans notre application à l'approche de la communauté des développeurs, puis voyons les avantages un peu plus en détail.
EfficacitéA veces pensamos que hacer las cosas de forma manual nos ahorra el tiempo de tener que investigar e implementar algunas herramientas, pero resulta que el tiempo acumulado a la semana o al mes se vuelve excesivo, donde podemos llegar a perder hasta 4 o 5 horas, avec Grognement cela est réduit, car simplement une fois que nous avons automatisé la tâche, à la fin de la journée, nous libérons ces exécutions de nos mains.
CohérenceComme nous l'avons mentionné au début, l'être humain est sujet aux erreurs et donc en automatisant nous pouvons les réduire, Grognement Cela nous donne la possibilité de tout exécuter exactement de la manière dont nous avons vérifié qu'il n'y a pas d'erreurs, éliminant ainsi le facteur humain de l'équation et optimisant nos tâches.
EfficacitéEn construisant un ensemble de tâches automatisées, nous pouvons faire en sorte que notre esprit traite les problèmes qui nécessitent vraiment notre attention, et en exécutant moins de tâches, nous serons moins fatigués et nous serons donc plus efficaces.
CommunautéS'il y a quelque chose dont nous avons pensé avoir besoin pour notre environnement automatisé, il existe sûrement, et c'est que grâce aux grands avantages de Grognement Une forte communauté de plugins a été construite que nous pouvons utiliser librement et gratuitement plusieurs fois, nous épargnant ainsi beaucoup plus de travail.
Une fois que nous avons connu les concepts théoriques, les avantages, les raisons de l'utiliser et d'autres aspects intéressants de GrognementIl est temps que nous puissions mettre en pratique tout ce que nous avons appris, alors commençons par installer ce formidable outil dans notre environnement.
Grognement Il est multiplateforme, nous pouvons donc l'utiliser sur Windows, Mac et Linux, pour des raisons pratiques lors de ce tutoriel nous verrons l'installation dans un environnement les fenêtresCependant, le processus n'est pas très différent dans les autres systèmes une fois que l'exigence initiale est remplie.
Node.js et son gestionnaire de packages et de modules npm sont la principale exigence avant d'installer Grognement, actuellement les deux outils viennent dans la même installation, nous n'avons donc qu'à installer Node.js Dans notre système, ce processus est très simple et a été expliqué dans d'autres tutoriels, cependant, il suffit de visiter le site officiel du projet nodejs.org pour savoir comment installer pour notre système d'exploitation.

AGRANDIR

Une fois que nous avons téléchargé et que nous avons Node.js fonctionnant sur notre système, nous sommes prêts pour la prochaine étape.
L'installation de Grognement c'est très simple, on obtiendra l'outil CLI Grunt, c'est-à-dire l'interface de ligne de commande, qui nous permettra d'utiliser la console comme moyen d'indiquer à Grognement les tâches à accomplir. Pour cela, nous allons utiliser npm et ses référentiels qui sont toujours mis à jour vers la dernière version stable du projet.
Pour cela, il suffit de lancer l'instruction suivante dans notre console de commande :

 npm install -g grunt-cli

Cette action nous laissera l'outil déjà installé comme nous le voyons dans la capture d'écran suivante de notre console.

Comme nous avons pu le voir, l'installation a été très simple et en quelques secondes, notre système est prêt à l'emploi. Grognement. Maintenant, nous devons aller dans un dossier où réside un projet avec lequel nous voulons lier Grognement et on exécute l'instruction suivante :

 npm installer grognement

Cela nous permettra d'intégrer Grognement dans notre projet et ainsi commencer à l'utiliser, voyons ce que la console nous dit lorsque nous faisons ceci :

Notre prochaine étape consiste maintenant à générer les fichiers package.json Oui Gruntfile.js, les deux sont essentiels à notre application afin que nous puissions répondre à toutes les dépendances dont nous avons besoin, et indiquent également à Grognement quoi faire efficacement. Ces fichiers sont essentiels puisqu'ils sont une sorte de cadre, sur lequel npm Oui Grognement ils seront pris en charge, s'ils n'existent pas dans notre projet nous aurons des problèmes à utiliser l'outil.
Pour générer le contenu de la package.json Il nous suffit d'utiliser une commande qui nous donnera une configuration initiale, pour cela nous devons d'abord créer un fichier vide appelé package.json, il est très important qu'il contienne deux accolades {} afin qu'il soit interprété comme JSON, puis dans notre console, nous devons exécuter ce qui suit dans le même répertoire de notre projet :

 npm install --save grunt grunt-contrib-uglify

Ce qui nous donnera le message suivant dans la console de commande :

Enfin si on voit notre fichier package.json Nous verrons qu'il a été mis à jour avec le contenu suivant :

Maintenant, nous devons créer le fichier Gruntfile.js, c'est qui dira Grognement tout ce qui doit être exécuté dans notre environnement donc c'est une partie vitale, la structure de base de ce fichier est la suivante :

 module.exports = function (grunt) {// voici le contenu de nos tâches};

Après le commentaire, c'est que nous pouvons placer nos différentes tâches planifiées, ce qui se fera lorsque nous exécuterons la commande grognement toutes les instructions que nous avons placées dans ce fichier sont exécutées dans notre console.
Comme nous avons déjà vu assez de contenu, nous allons laisser la création de tâches automatisées pour une autre fois, l'important est que nous ayons compris que c'est Grognement, quelles sont les exigences dont nous avons besoin pour l'installer et tout ce qu'il nous offre.
Avec cela nous concluons ce tutoriel, si nous voulons approfondir un peu nous pouvons aller dans la documentation officielle de l'outil qui est en anglais et ainsi avancer quelques connaissances que nous pourrons mettre en pratique plus tard.Avez-vous aimé et aidé ce tutoriel ?Vous pouvez récompenser l'auteur en appuyant sur ce bouton pour lui donner un point positif