Enligt Yeoman.io, "Yeoman är en robust och uppfattad uppsättning verktyg, bibliotek och ett arbetsflöde som kan hjälpa utvecklare att snabbt bygga vackra, övertygande webapps." Låt oss gräva in och se exakt vad det betyder!
_ .--------------------------. _ | o | _ | Välkommen till Yeoman, | | _ | | damer och herrar! | / \ Y / \ o _________________________ | || : | // o / --- \ _ \ / _
En hel del arbete går till att bygga webbapplikationer dessa dagar. Det finns otaliga bibliotek där ute för att använda, mönster, stilar, galler, pannplattor, bootstraps ... listan fortsätter! Yeoman är ett svar på några av dessa frågor. I stället för att behöva slösa bort en massa tid att få igång en applikation, gör Yeoman arbetet med arbetet - bara som kräver några kommandon.
Det snabbaste sättet att börja använda Yeoman är att köra följande skript.
curl -L get.yeoman.io | shNotera: Yeoman stöds av OSX, Linux och Windows. Processen klockar på cirka 10 minuter. I en framtida uppdatering ändras dock denna installationsprocess.
Så det var lätt. Vad hände nyss? Massor av saker! De install.sh
fil av ,get.yeoman.io
, har en rubrik som beskriver exakt vad som hände.
# * Upptäck Mac eller Linux, välj vilken pakethanterare som ska använda # * På Mac, installera homebrew om den inte är närvarande # * Installera sedan dessa: git optipng jpeg-turbo phantomjs # * Se till att Ruby> = 1.8.7 är runt, installera om inte (för kompass) # * Installera det senaste NodeJS-paketet # * Installera kompass # * Hämta Yeoman zip till en tillfällig mapp # * Installera det som en global nodmodul
Och där har du det!
Yeoman är installerad som en global nodmodul, så öppna din TOC (Terminal of Choice) och kör hemmansägare
.
Första gången detta körs, kommer det att fråga om du vill tillåta dem att hålla statistik om din Yeoman-användning. De har faktiskt en Google Analytics-kontoinställning för att spåra alla typer av intressant användarstatistik.
Helt enkelt igång hemmansägare
från och med nu kommer det att skrivas ut en lista över de kommandon som är tillgängliga att utföra.
yeoman init
Här är ställningen magi händer. Kör följande kommando för en grundläggande byggnadsbar app.
yeoman init
Detta kommando kommer att ställa fem frågor:
Ut ur lådan körs i det
kommer att innehålla HTML5 Boilerplate, och jQuery och Modernizr. Här är en mer expanderad lista.
Det kommer också att kompilera CoffeeScript och Compass-filer direkt ur lådan!
generatorer är magiken bakom alla ställningarna. De i det
kommandot, i sig, är baserat på en generator. Det finns ett separat förråd för dem. Det finns många tillgängliga redan, inklusive Ryggrad, Glödande kol, och Vinkel för att bara nämna några av dem. För att visa en lista över alla, kör du bara ...
yeoman init - help
Generatorer är en stor del av Yeoman, och är avsedda att modifieras och läggas till.
Tips: För hjälp med att skapa din egen generator, se generationsområdet i dokumentationen.Om du vill skapa din egen Backbone.js-applikation kan du helt enkelt springa:
mkdir backboneapp & & cd backboneapp yeoman init backbone
Detta kommer att bygga ett projekt med flera pannplattformar, visningar, samlingar, förinstallerad med Lodash, Mocha, jQuery och HTML5 boilerplate.
Du kan göra detsamma med vinkel- och glödande kol som tidigare nämnts.
Det finns olika subgeneratorer också som tillåter dig att göra saker, som:
yeoman init backbone: visa awesomeView yeoman init backbone: modell awesomeModel yeoman init backbone: samling awesomeCollection yeoman init backbone: router awesomeRouter
Då BAM, har du lite nytt codez att arbeta med, snarare än att slösa bort en massa tid omskrivning av boilerplate-kod!
yeoman bygga
Under omslaget hittar du Grunt, som en populär ram, skapad av Ben Alman (Cowboy), för att bygga JavaScript-applikationer. Det är beroende av en grymta
fil med konfigurationsalternativ som konfigurerar uppgifter för att utföra olika operationer, till exempel linting, kombinering, minifiering etc..
Yeoman är byggd ovanpå Grunt, men utökar den för att ge några nya modifikationer och funktioner. Dessa inkluderar:
r.js
Konfigurationen kommer att placeras inom en gruntfile.js
filen i den genererade appen. När du är klar med att utveckla kör följande för att bygga appen.
yeoman bygga
Din nybyggda app placeras inom en dist /
mapp. En cool funktion är hur Yeoman tar skriptreferenser, till exempel:
Och, efter att ha kört byggnaden, concat och minifiera dessa filer ner till en enda manus
referens. Det är tolv HTTP-förfrågningar ner till en!
Var och en av stegen för byggprocessen finns i gruntfile.js, som genereras när appen skapas. Det finns också flera byggmålet alternativ.
yeoman server
Yeoman erbjuder även en inbyggd värdserver för att testa din app lokalt. LiveReload eller enkel fil att titta på om du inte har LiveReload säkerställer också att när du kör servern kommer eventuella ändringar av filer i appen automatiskt att ladda om webbläsaren med de nya ändringarna. Som standard är porten som den ska köra på 3051
. Genom att köra följande ...
# Kör detta för den icke-byggda versionen Yeoman Server # Eller det här för den inbyggda versionen Yeoman Server: Dist
Ett nytt fönster i webbläsaren kommer att dyka upp med din app som körs. Servern kommer också att kompilera Coffee and Sass-tillgångar och placera dem inom en temp
katalogen. Så du behöver inte oroa dig för att kompilera! Det finns flera andra servermål; var noga med att kolla in dem.
yeoman test
Mocka är ett populärt enhetstestningsramverk och är inbyggt i Yeoman. När ett projekt är stillastående, en testmapp med en index.html
filen skapas med Mocha och Chai för påståenden. Helt enkelt springa:
yeoman test
Yeoman kommer sedan att köra Mocha mot PhantomJS, vilket är en huvudlös webkit-webbläsare som körs inuti Node.js. Då kan du gärna lägga till nya tester i index.html
fil. Enhetstestning kan i hög grad förbättra alla applikationer, och Yeoman gör processen så enkel som möjligt. Så det finns inga ursäkter längre! Du kan också använda Jasmine, om du föredrar, genom att passera --test-ram-jasmin
till yeoman init
kommando.
yeoman installera
För att installera nya klientbibliotek i din ansökan använder Yeoman ett bibliotek, kallat Bower som utvecklats av några av personerna på Twitter.
Bower är en paketchef för webben. Bower låter dig enkelt installera tillgångar som bilder, CSS och JavaScript och hanterar beroenden för dig.
Yeoman tillåter följande kommandon:
# Installera eventuella paket (er) utrymme avgränsade yeoman installera jquery # Avinstallera saker yeoman avinstallera jquery # Uppdatera saker yeoman update jquery # Installer understrykning också eftersom ryggraden beror på det yeoman installera ryggrad # Lista ut alla installerade saker yeoman list # Gå hitta saker specifikt baserat på ett namn Yeoman Lookup Mocha # Gå hitta saker baserat på ett nyckelord Yeoman Lookup understrykning
Bower är ett utmärkt komplement till Yeoman, och löser arbetsflödesproblemet av att behöva ständigt hämta biblioteken när man bygger appar. Det säkerställer också att de är aktuella. Här är ett exempel på hur du kan använda Bower.
bower install jquery bower installera git: //github.com/maccman/package-jquery.git bower installera http://code.jquery.com/jquery-1.7.2.js bower install ./repos/jquery
Appar installerade med bower lagras i en component.json filen i applikationsroten.
Låt oss skapa en enkel Backbone-applikation från början till slut.
# Skapa en ny app yeoman init backbone # Skapa en ny modell och samling yeoman init backbone: modellfoto yeoman init backbone: samling bilder # Skapa en ny vy för flickr offentliga bilder yeoman init backbone: visa flickr yeoman init backbone: visa photoItem # WAVES HAND OCH ADDS LOTS OF CODE # https://github.com/jcreamer898/yeomanbbapp yeoman server # Bygg alla saker! yeoman build # Kolla in den nya byggmanen ... yeoman server: dist
Wow, det är nästan för enkelt - och glöm inte att du kan skapa Bash-alias för att ytterligare förkorta den här koden. Den svåraste delen var att skapa provappen! Men det är skönheten i det. Yeoman tar dig ifrån
pannkodskoden, och låter dig fokusera exklusivt på de hårda grejerna!
Om du vill kan du titta på appen för att se hur sakerna gick. Jag skulle säga ganska bra.
Yeoman kan snabbt påskynda utvecklingsprocessen för en ny applikation. Istället skriver du några kommandon i stället för att slösa bort tidsbibliotek och skriva källkodskod, och du är igång! Ännu bättre, det är öppen källkod och skrivet av ett par killar du kanske vet!
Njut av!