Share
Tegenwoordig brengen de meeste front-end webontwikkelaars veel tijd door met technologieën zoals Sass, LESS, HTML en JavaScript. De laatste paar jaar was een opwindende tijd in webontwikkeling en technologieën zoals Grunt hebben bijgedragen aan de opwinding.
In deze serie ben ik van plan u Grunt voor te stellen en te vertellen hoe het onze ontwikkeling van WordPress-thema's en plug-ins kan verbeteren. We zullen ook werken aan het opzetten van Grunt om het voor te bereiden voor gebruik in uw volgende project. Ten slotte zullen we ook de commandoregelhulpmiddelen bekijken.
Grunt is een automatiseringstool voor front-end ontwikkelaars. Het is geschreven in JavaScript, dus het zou mooi moeten zijn om het op te pikken en te begrijpen als je JavaScript kent. Hier is de beschrijving van de Grunt-website:
In één woord: automatisering. Hoe minder werk u hoeft te doen bij het uitvoeren van repetitieve taken zoals minificatie, compilatie, testen van eenheden, pluizen, enz., Hoe eenvoudiger uw taak wordt. Nadat je het hebt geconfigureerd, kan een taakloper het meeste van dat alledaagse werk voor jou en je team doen met in feite geen enkele moeite.
Grunt is een agnostische tool voor besturingssystemen, dus of je nu ontwikkelt op Mac, Windows of Linux, je zou het moeten kunnen gebruiken. Dit maakt het geweldig voor grotere teams die een mix van platforms hebben waarmee ze zich ontwikkelen. Het beste is dat je tijdens het opzetten van je project met Grunt, het ook gemakkelijk kunt delen met anderen. We zullen dit meer in een andere post behandelen.
Voor degenen onder u die er niet mee hebben gewerkt of van hebben gehoord, is Node.js een JavaScript-runtime. Het is echt van de grond gekomen in de afgelopen paar jaar en technologieën zoals Grunt en Bower hebben het echt geholpen de acceptatie te versnellen. Hier is de beschrijving van de knooppuntwebsite:
Node.js is een platform dat is gebouwd op basis van de JavaScript-runtime van Chrome voor het snel bouwen van snelle, schaalbare netwerktoepassingen. Node.js maakt gebruik van een eventgestuurde, niet-blokkerende I / O-model dat het licht en efficiënt maakt, perfect voor data-intensieve real-time applicaties die verspreid over verschillende apparaten lopen.
Knooppunt is de enige vereiste om Grunt te gebruiken en u moet het op uw computer en mogelijk uw servers hebben geïnstalleerd. Grunt gebruikt npm om plug-ins te installeren en beheren. U kunt meer lezen over de vereisten op de pagina Aan de slag op de Grunt-website.
Zodra je de taken hebt die je nodig hebt voor je project, heb je een manier nodig om ze uit te voeren. Dit is waar het bestand Gruntfile.js in beeld komt. Het Gruntbestand geeft aan welke taken moeten worden opgenomen en welke opties u opgeeft om deze uit te voeren.
Hier geeft u waarschijnlijk uw doelen en bronnen voor elke taak op. Een voorbeeld verwijst naar uw vooraf gecompileerde .scss-bestanden en geeft de locatie op waar u de gecompileerde .css-bestanden wilt opslaan. U zult ook andere opties opgeven die elke plug-in voor u beschikbaar heeft. Deze worden meestal gedocumenteerd bij elke plug-in.
Taken zijn echt waar de macht naar mijn mening is. Een taak is eenvoudigweg een manier om een groep plug-ins uit te voeren. U wilt een standaardtaak opgeven die wordt uitgevoerd wanneer u wordt uitgevoerd 'Grunt'. U kunt de watch-taak gebruiken, zodat u automatisch taken of plug-ins kunt uitvoeren wanneer specifieke bestanden in uw project veranderen.
Ik ben van plan om meer taken in een later stadium te behandelen.
Grunt is absoluut een hulpmiddel dat je moet leren kennen als je een frontend of WordPress-ontwikkelaar bent. Dit citaat van de Grunt-site somt alles op,
Het Grunt-ecosysteem is enorm en groeit elke dag. Met letterlijk honderden plug-ins om uit te kiezen, kunt u Grunt gebruiken om zo ongeveer alles met een minimum aan inspanning te automatiseren. Als iemand nog niet heeft gebouwd wat je nodig hebt, is het schrijven en publiceren van je eigen Grunt-plug-in naar npm een fluitje van een cent.
Als je dit nog niet in je projecten hebt gebruikt, moet je het zeker overwegen.
Accentsconagua