Aan de slag met CoffeeScript

Veel ontwikkelaars in het verleden toen ze werden verteld over JavaScript ze leden meer dan nodig was, dit omdat het niet mogelijk was geweest om de ware voordelen van deze taal die in de browser draait te vinden.
Na vele jaren van onzekerheid zijn de bibliotheken die functionaliteiten bieden samengevat als: jQuery of Mootools, gaf vertrouwen in taalherstel, maar het was pas bij het verschijnen van projecten zoals Node.js dat er niet echt rekening mee werd gehouden. Het enige probleem met JavaScript is dat de syntaxis verouderd is met wat ontwikkelaars nu zoeken, we zien bijvoorbeeld hoe Robijn of Python ze zijn zeer succesvol vanwege de netheid waarmee hun shows worden weergegeven.
KoffieScriptOmdat in de wereld van technologie niets onmogelijk is, en er altijd een team is dat de wereld wil veranderen, ontstaat het KoffieScript, een taal die is gebaseerd op JavaScript en dat helpt ons om een ​​schonere syntaxis te hebben, nadat we onze programma's hebben geschreven, worden ze gecompileerd en omgezet in JavaScript Pure behoudt zo de compatibiliteit met de platforms waarop het draait.
Om te kunnen genieten KoffieScript Eerst moeten we aan enkele vereisten voldoen, op deze manier hebben we toegang tot de compiler, maar niet alleen dat, we moeten ook een basisbegrip hebben van de initiële commando's om onze programma's uit te kunnen voeren.
Het eerste wat we nodig hebben is: Node.js met deze tool hebben we een pakketbeheerder beschikbaar met de naam npm waarmee we de hele omgeving kunnen installeren KoffieScript op een heel eenvoudige manier. De beste manier om te installeren Node.js Het is via de officiële installatieprogramma's op nodejs.org, zoals we in de volgende afbeelding zien, hebben we versies voor bijna alle platforms die we willen:

VERGROTEN

In het geval van deze tutorial gaan we werken met de versie voor ramen. Zodra we hebben geïnstalleerd Node.js we kunnen testen of de installatie succesvol was door het volgende commando uit te voeren:

 knoop -v

Dit zou ons een scherm moeten retourneren met de versie die we in ons systeem hebben, als dit niet gebeurt, moeten we onze installatie valideren omdat deze niet correct is, laten we eens kijken hoe de uitvoering ervan eruit ziet:

Nu we dat hebben Node.js nu is het tijd om te installeren KoffieScript, in het verleden moesten we installeren npm apart, maar in de meest recente versies is het al inbegrepen, dus om ons doel te bereiken, hoeven we alleen het volgende commando te plaatsen:

 npm install -g coffee-script

We zien dat we een -G, dit geeft aan dat de installatie is globaal, om te kunnen hebben KoffieScript in ons hele systeem, bij het uitvoeren van de opdracht duurt het een paar seconden terwijl het alles downloadt wat nodig is.
Ten slotte kunnen we het volgende in onze opdrachtconsole uitvoeren om te controleren of de installatie correct en zonder problemen is uitgevoerd:

 koffie -v

Hierna zouden we een resultaat moeten hebben dat lijkt op de volgende afbeelding:

Hiermee hebben we de taalinstallatie succesvol afgerond KoffieScript, maar niet alleen dit, we hebben ook Node.js die ons in de toekomst van pas zullen komen voor andere tools en ontwikkelomgevingen.
BelangrijkHoewel het proces wordt uitgevoerd in ramen Het is in principe hetzelfde voor alle platforms, wat misschien het meest verandert, is de manier van installeren Node.js, maar het gebruik van npm voor installatie KoffieScript is hetzelfde.
Omdat we onze vereisten met succes hebben geïnstalleerd, gaan we nu ons eerste programma maken, hiervoor moeten we de schelp of interactieve console KoffieScript, hiervoor eenvoudigweg in onze console of terminal van het besturingssysteem waar we de installatie hebben gedaan, gaan we het woord plaatsen koffie en we zullen de genoemde shell invoeren.

Eenmaal daar gaan we de volgende code plaatsen die niets meer is dan een Hallo Wereld om met deze nieuwe technologie aan de slag te gaan. We beginnen met het declareren van een variabele, hiervoor plaatsen we de naam, een gelijkheidsteken en vervolgens de inhoud, in het geval van het voorbeeld zou het als volgt zijn:

 groet = "Wereld"

We duwen Binnenkomen, nu gaan we een tekststring maken, hierin gaan we de variabele opnemen, hiervoor hoeven we alleen de pondteken # en tussen sleutels de naam van de variabele, bijvoorbeeld:

 "Hallo! #{groet}!"

Om te eindigen drukken we op Binnenkomen nog een keer en we krijgen onze Hoi! Wereld! resultaat zoals we zien in de volgende afbeelding:

Als we eenmaal klaar zijn met ons eerste programma, willen we het zeker een beetje vieren, en hiervoor willen we de shell niet actief laten, dus als we het willen verlaten, hoeven we alleen op de toetsen te drukken CTRL + D en daarmee keren we terug naar de console van ons besturingssysteem.
Omdat het schrijven van alles in de console niet echt iets is dat we vaak in onze applicaties zullen gebruiken, moeten we leren onze bestanden te compileren; met compileren bedoelen we de vertaling die van de code wordt gemaakt KoffieScript tot JavaScript op deze manier kan het resultaat worden uitgevoerd op alle platforms die dit laatste ondersteunen.
Het enige dat we nodig hebben naast wat we al hebben, is een goede teksteditor, een van de meest populaire is Sublieme tekstHet mooie hiervan is dat er duizenden extensies zijn waarmee we extra functionaliteiten kunnen realiseren om ons werk makkelijker te maken. Voor nu kunnen we de gewenste editor gebruiken, in de voorbeelden zullen we zien hoe deze wordt gebruikt Sublieme tekst.
BestandsextensieAl onze bestanden moeten eindigen op .koffie hiermee zullen we weten dat deze overeenkomen met KoffieScript, we gaan een klein voorbeeld maken dat ons een waarschuwing met een bericht laat zien, dan zullen we het compileren en het resultaat zien.
We zullen een bestand maken met de naam voorbeeld1.koffie en daarin gaan we de volgende inhoud plaatsen:

 waarschuwing "Welkom !!"

Om ons bestand te compileren, hoeven we alleen de volgende opdrachtregel uit te voeren:

 koffie -c voorbeeld1.koffie

Deze actie zal een bestand genereren .js genaamd voorbeeld1.js, hoe we kunnen visualiseren in de volgende afbeelding:

VERGROTEN

Die de volgende inhoud zal hebben:

 waarschuwing ("Welkom !!");

Nu vragen we ons zeker af wat het nut is van het compileren van de bestanden .koffie, het antwoord is dat we onze code zonder problemen op een pagina kunnen gebruiken, we doen dit omdat het bestand .koffie Het kan niet door de browser worden geïnterpreteerd, daarom is het gecompileerde resultaat het bestand .js is degene die onze pagina zal laten werken.
Om het bovenstaande te bekijken, uitgelegd in dezelfde map of map waarin we onze . compileren voorbeeld1.koffie we gaan een nieuw bestand maken, dit wordt een bestand HTML normaal zullen we het noemen voorbeeld2.html en daarbinnen gaan we een link maken naar voorbeeld2.js, laten we de benodigde code eens bekijken:

 Onze applicatie met CoffeeScript 

Wanneer uitgevoerd in onze browser, zou dit er als volgt uit moeten zien:

Nu gaan we een bestand maken met de naam voorbeeld2.koffie en we zullen de volgende code plaatsen:

 taal = {onzetaal: {naam: "Koffie"}} ourElement = document.getElementById ("taal") ourElement.innerHTML = taal.onzetaal.naam

We compileren en vernieuwen onze HTML van de vorige stap:

Zoals we merkten is het laatste woord van de titel veranderd, als we het bestand nu opnieuw aanpassen voorbeeld2.koffie en wij plaatsen KoffieScript, zodat de wijzigingen worden weergegeven zonder dat u hoeft te compileren, hoeft u alleen maar de volgende opdracht uit te voeren:

 koffie -c.

Hiermee verversen we de .js die wijzigingen hebben vereist op basis van de bestanden.koffie aangepast, laten we eens kijken:

En tot slot bij het bijwerken van ons bestand HTML We zullen zien hoe de wijzigingen in onze code worden weergegeven:

Dit proces van compileren elke keer dat we iets veranderen, is een beetje zwaar, vooral als we een groot aantal bestanden in verschillende mappen moeten wijzigen, daarom kunnen we de compiler laten "observeren" en elke keer dat het een verandering ziet of detecteert in een bestand onmiddellijk opnieuw compileren om onze applicatie up-to-date te houden.
Om dit te bereiken moeten we gewoon het commando plaatsen:

 koffie -w -c.

Hiermee compileren we de hele directory en vertellen we de compiler dat wanneer er een wijziging is in een bestand om het opnieuw te compileren. Laten we in de volgende afbeelding zien hoe de bouw logboek bij het aanbrengen van wijzigingen aan bestanden gebeurt dit allemaal automatisch:

Door deze basisonderdelen onder de knie te krijgen en ze te laten werken, zullen we zeer belangrijke kennis opdoen die ons zal helpen groeien als ontwikkelaars. Het belangrijkste is om de compilatieconcepten goed te behandelen en het resulterende bestand te zien, hiermee zullen we geleidelijk de voordelen leren van: JavaScript als een moderne ontwikkeltaal.
Hiermee hebben we deze tutorial afgerond, zoals we zien werken met KoffieScript Het is in het begin iets heel eenvoudigs, natuurlijk heeft het, zoals alle programmeertalen, een leercurve, maar het is niet zo hoog en complex als andere talen.