Share
Potrivit yeoman.io, "Yeoman este un set robust și optimizat de instrumente, biblioteci și un flux de lucru care poate ajuta dezvoltatorii să construiască rapid aplicații web frumoase și convingătoare". Să ne grăbim și să vedem exact ce înseamnă asta!
_ .--------------------------. _ | o | _ | Bine ați venit la Yeoman, | | _ | | doamnelor si domnilor! | / \ Y / \ o _________________________ | || : // // o / --- \ _ \ / _
O mare parte a muncii merge în construirea de aplicații web în aceste zile. Există nenumărate biblioteci pe care să le folosiți, modele, stiluri, grile, plăci de boiler, bootstraps ... lista continuă! Yeoman este un răspuns la unele dintre aceste probleme. Mai degrabă decât a fi nevoie să pierdeți o grămadă de timp pentru a obține o aplicație în plină desfășurare, Yeoman face greutatea muncii pentru dvs. - necesitând doar câteva comenzi.
Cel mai rapid mod de a începe să utilizați Yeoman este să rulați următorul scenariu.
curl -L get.yeoman.io | SHNotă: Yeoman este susținută de OSX, Linux și Windows. Acest proces are ceasuri în aproximativ 10 minute. Într-o actualizare ulterioară, însă, acest proces de instalare va fi modificat.
Deci, a fost ușor. Ce s-a intamplat? O mulțime de lucruri! install.sh fișierul oprit ,get.yeoman.io, are un antet care descrie exact ce sa produs.
# * Detect Mac sau Linux, alege care manager de pachete să folosească # * Pe Mac, instalează homebrew dacă nu este prezent # * Apoi instalează: git optipng jpeg-turbo phantomjs # Asigurați-vă că Ruby> = 1.8.7 este în jur, dacă nu (pentru Compass) # * Instalați ultimul pachet NodeJS # * Instalați Compass # * Descărcați Yeoman zip într-un folder temporar # * Instalați-l ca un modul nod global
Și acolo aveți!
Yeoman este instalat ca un modul Nod global, așa că deschideți TOC (Terminal of Choice) și rulați răzeș.
Prima dată când aceasta se execută, se va întreba dacă doriți să le permiteți să păstreze statistici privind utilizarea Yeoman. Ei au, de fapt, o configurare a contului Google Analytics pentru a urmări toate tipurile de statistici de utilizare interesante.
Pur și simplu alerga răzeș de acum încolo va tipări o listă a comenzilor disponibile pentru execuție.
Accentsconagua
yeoman initAici se intampla magia schelelor. Rulați următoarea comandă pentru o aplicație schelă de bază.
yeoman init
Această comandă va pune cinci întrebări:
Din cutie, alergând init va include HTML5 Boilerplate și jQuery și Modernizr. Iată o listă mai extinsă.
Acesta va compila, de asemenea, fișierele CoffeeScript și Compass chiar din cutie!
generatoare sunt magia din spatele tuturor schelelor. init comanda, în sine, se bazează pe un generator. Există un depozit separat pentru ei. Există multe disponibile deja, inclusiv șira spinării, tăciuni aprinși, și unghiular pentru a numi doar câteva dintre ele. Pentru a vedea o listă a acestora, pur și simplu rulați ...
yeoman init - ajutor
Generatoarele sunt o mare parte din Yeoman și sunt menite să fie modificate și adăugate.
Bacsis: Pentru ajutor privind crearea propriului generator, consultați zona generatoare a documentației.Dacă doriți să creați propria aplicație Backbone.js, puteți rula pur și simplu:
mkdir backboneapp && cd backboneapp coloana vertebrală inoman
Acest lucru va construi un proiect cu mai multe modele de boilerplate, vederi, colecții, preloaded cu Lodash, Mocha, jQuery și HTML5 boilerplate.
Puteți face același lucru cu unghiular și tăciuni aprinși După cum sa menționat anterior.
Sunt diferite sub generatoare de asemenea, care vă permit să faceți lucruri, cum ar fi:
chineză inoman ined: Vedere minunată Vedere geantă inimă: model minunatModel yeoman init coloana vertebrală: colecție minunatăCollecție geană init coloana vertebrală: router awesomeRouter
Atunci BAM, vei avea ceva nou codez pentru a lucra cu, mai degrabă decât a pierde o grămadă de timp rescrierea codul boilerplate!
construițiSub capace, veți găsi Grunt, un cadru popular, creat de Ben Alman (Cowboy), pentru construirea de aplicații JavaScript. Se bazează pe a mormăit fișierul cu opțiuni de configurare care configurează sarcini pentru a efectua diverse operații, cum ar fi lingerea, combinarea, minificarea, etc.
Yeoman este construit pe partea de sus a Grunt, dar se extinde pentru a oferi unele modificări și caracteristici noi. Acestea includ:
r.js Configurația va fi plasată într-un gruntfile.js fișier din aplicația generată. Când ați terminat de dezvoltat, executați următoarele pentru a construi aplicația.
construiți
Aplicația nouă construită va fi plasată într-un dist / pliant. O caracteristică interesantă este modul în care Yeoman va lua referințe de script, cum ar fi:
Și, după rularea construirii, concate și minify aceste fișiere până la un singur scenariu referinţă. Acestea sunt doisprezece cereri HTTP până la unul!
Fiecare dintre pașii pentru procesul de construire poate fi găsit în gruntfile.js, care este generat atunci când aplicația este creată. Există mai multe opțiuni pentru a construi țintă.
server server Yeoman oferă, de asemenea, un server încorporat pentru a testa aplicația la nivel local. Funcția LiveReload sau urmărirea simplă a fișierelor, dacă nu aveți LiveReload, vă asigură că, la rularea serverului, orice modificare a fișierelor din aplicație va reîncărca automat browserul cu noile modificări. Implicit, portul pe care se va difuza este 3051. Prin executarea următoarelor ...
# Rulați acest lucru pentru versiunea non-built serverul yeoman # Sau acest lucru pentru versiunea construită serverul yeoman: dist
Va apărea o nouă fereastră de navigare cu aplicația care rulează. Serverul va compila, de asemenea, activele Coffee și Sass și le va plasa într-un temp director. Deci, nu trebuie să vă faceți griji cu privire la compilare! Există mai multe alte obiective pentru server; asigurați-vă că le verificați.
testul testului Mocha este un cadru popular de testare a unităților și este construit în Yeoman. Când un proiect este scheletat, un dosar de testare cu un index.html fișierul este creat cu Mocha și Chai pentru afirmații. Pur și simplu alerga:
testul testului
Yeoman va rula apoi Mocha împotriva PhantomJS, care este un browser webkit fără cap care rulează în interiorul Node.js. Apoi, puteți să vă simțiți liberi să adăugați noi teste în index.html fişier. Testarea unităților poate spori foarte mult orice aplicație, iar Yeoman face procesul cât mai ușor posibil. Deci nu mai există scuze! De asemenea, puteți utiliza Jasmine, dacă preferați, trecând --test-cadru iasomie la yeoman init comanda.
instalare yeomanPentru a instala noi biblioteci de clienți în aplicația dvs., Yeoman folosește o bibliotecă, numită Bower, dezvoltată de unii dintre cei de la Twitter.
Bower este un manager de pachete pentru web. Bower vă permite să instalați cu ușurință elemente precum imagini, CSS și JavaScript și gestionează dependențele pentru dvs..
Yeoman permite următoarele comenzi:
# Instalați orice pachet (e) spațiu delimitat yeoman install jquery # Dezinstalați lucrurile yeoman uninstall jquery # Actualizați lucrurile yeoman update jquery # Instalați underscore, de asemenea, din moment ce coloana vertebrală depinde de ea yeoman instalați backbone # Lista tuturor lucrurilor instalate yeoman list # în special bazate pe un nume yeoman căutare mocha # Du-te găsi chestii bazate pe un cuvânt-cheie yeoman căutare de subliniere
Bower este o completare excelentă la Yeoman și rezolvă problema fluxului de lucru prin faptul că trebuie să recupereze în mod constant bibliotecile atunci când creează aplicații. De asemenea, se asigură că acestea sunt actualizate. Iată un exemplu în care puteți folosi Bower.
bower instalare jquery bower instalare git: //github.com/maccman/package-jquery.git instalare bower http://code.jquery.com/jquery-1.7.2.js bower install ./repos/jquery
Aplicațiile instalate cu bower vor fi stocate într-un component.json fișier de la rădăcina aplicației.
Să creăm o aplicație de backbone simplă de la început până la sfârșit.
# Creați o nouă bază de date a aplicației yeoman init # Creați un model nou și coloana vertebrală de colectare yeoman init: model photo yeoman init coloana vertebrală: fotografii de colecție # Creați câteva vizualizări noi pentru fotografii publice flickr backdoor geană inoman: vizualizați flickr yeoman init coloana vertebrală: WAVES HAND ȘI ADĂ LOTURI DE COD # # https://github.com/jcreamer898/yeomanbbapp serverul yeoman # Construiți toate lucrurile! Yeoman construi # Check out noul constructor ... serverul yeoman: dist
Wow, este aproape prea simplu - și nu uitați că puteți crea aliasuri Bash pentru a scurta mai mult acest cod. Partea cea mai grea a fost crearea aplicației de probă! Dar, asta e frumusețea ei. Yeoman te duce de la tine
codul de boilerplate și vă permite să vă concentrați exclusiv asupra materialelor grele!
Dacă doriți, aruncați o privire la aplicație pentru a vedea cum au mers lucrurile. Aș spune destul de bine.
Yeoman poate accelera rapid procesul de dezvoltare pentru o nouă aplicație. Mai degrabă decât să pierdeți bibliotecile de colectare a timpului și să scrieți codul de boilerplate, în loc să scrieți câteva comenzi și sunteți pregătit! Chiar mai bine, este sursă deschisă și scrisă de câțiva băieți pe care îi cunoașteți!
se bucura!
