Ce este Yeoman?

Intrebare capcana. Nu e nimic. Este tipul ăsta:

Practic, el poartă o pălărie de top, trăiește în computer și vă așteaptă să-i spuneți ce tip de aplicație doriți să creați. De exemplu, schela unei aplicații web ar arăta astfel:

Primul lucru care vine în minte este OMG atât de visător. În al doilea rând, mulțumesc, frate.

Tot ce am făcut a fost să-i spunem ceea ce ne-am dorit și el a răspuns cu întrebări specifice pentru a ne da mai mult control.

Să revenim însă la un pas. Nu fiecare computer nou vine cu un Yeoman preinstalat. Locuiește în depozitul de pachete NPM. Trebuie doar să-l întrebi o dată, apoi se împachetează și se mută în hard disk. Asigurați-vă că vă curățați, îi plac lucrurile noi și strălucitoare.

Este o persoană cu sentimente și opinii, dar cu care e foarte ușor să lucrezi. Dacă credeți că este prea convingător, el poate fi ușor convins.

Să luăm o secundă pentru a distruge ce anume yo webapp comanda, de la captura de ecran precedent într-adevăr a făcut.

yo

Aceasta este o comandă OS X, Linux și Windows prietenoasă la nivel de sistem care scrutează hard diskul pentru orice "generatoare" instalate, apoi le oferă controlul pe baza următorului argument:

webapp

Acesta este de fapt un plug-in separat, sau "generator", numit Generator-webapp. Yeoman recunoaște altele generator-____ Modulele de noduri, care deschid ușa pentru utilizarea Backbone, AngularJS și nenumărate alte generatoare pe care le-ați denumit-o.

Ceva important de luat de la asta este, este Generator-webapp modul care ne solicită întrebări. Același lucru este valabil și pentru orice alte generatoare pe care le instalăm. Ele sunt menținute de comunitate, nu neapărat membrii echipei Yeoman.

Folosind Yeoman, nu spui "Vreau să fac lucruri în felul tău, stăpâne. arc arc,"Fără a avea nici un control. De fapt, este chiar opusul. Ceea ce spui de fapt este,«Vreau să fac o aplicație care urmează cele mai bune practici care au fost descoperite de către utilizatori frecvente și colaboratori ai comunității de dezvoltare web».

Serios, trebuie să spuneți așa, sau nu va funcționa.

Dacă preferați să faceți ceva diferit de ceea ce vă dă, pur și simplu schimbați codul care a fost generat pentru dvs. sau chiar mergeți la sursa "generatorului" în sine și trimiteți contribuția dvs..

Prietenie

Amicul nostru, ai niște prieteni ai lui și credeți că veți avea parte de tot ceai și zâmbete nesfârșite. Dacă nu ați auzit de Grunt sau Bower, iată un scurt rezumat al ceea ce ne dau:

mormăit

Grunt este un alergător de sarcină bazat pe JavaScript, care face lucrurile murdare. Ca yo, oferă, de asemenea, un set de bază de funcționalitate, apoi permite comunității să împartă propriile plug-in-uri sau "sarcini" care ajută la realizarea unor lucruri comune. Când îți proiectezi aplicația yo webapp, Grunt și unele sarcini selectate manual vor veni de-a lungul, care realizează lucruri cum ar fi rularea site-ului dvs. într-un mediu de dezvoltare locală, concatenarea și minificarea codului dvs., optimizarea imaginilor dvs. și multe altele. Sarcini sunt rulate prin linia de comandă, prin tastarea serverul de șmecherie, grunt build, încercare grunt, si multe altele.

Sarcini sunt definite și personalizate într-o Gruntfile.js fișier, care trăiește în directorul rădăcină al proiectului dvs. Verifică-l pentru a vedea ce a pregătit Yeoman pentru tine.

umbrar

Nimănui nu-i place să meargă la site-urile GitHub sau ale dezvoltatorilor aleatorii pentru a descărca un .zip al unui instrument JavaScript. La fel ca la extragerea unui pachet Node cu npm install ___, Bower vă permite să spuneți bower install ___. Componenta este apoi salvată într-un director de alegere, în general, app / bower_components / pentru aplicațiile generate de Yeoman. Presupunând că vroiai jQuery, ai alerga cererea de instalare bower comanda, apoi includeți fișierul relevant din interiorul fișierului dvs. HTML. În cazul nostru,

O aplicație tipică

Sa ne facem de cap. Este timpul să creați o aplicație.

Real rapid, totuși, găsiți cel mai apropiat terminal și asigurați-vă că aveți yo instalat la nivel global:

$ npm install -g yo

Pentru a genera o aplicație web, veți avea nevoie, de asemenea Generator-webapp:

$ npm instalare -g generator-webapp

Creați un dosar pe care îl putem juca în jur, apoi executați:

$ yo webapp

Iată ce ar fi trebuit să se întâmple:

• O chestie întreagă.

A facut-o? Bun!

Pentru a vă împiedica să derulați prin tot textul care tocmai a fost scuipat la dvs., iată o prezentare generală:

Noua aplicație web a fost schemată, iar componentele Bower și pachetele NPM au fost instalate automat.

Deschideți toate aceste lucruri noi în editorul dvs. preferat și vom analiza ceea ce avem.

 ├─ app / │ ├─ imagini / │ │ ├─ glyphicons-halflings.png │ │ └─ glyphicons-halflings-white.png │ ├─ script-uri / │ │ ├─ furnizor / │ │ │ └─ bootstrap.js │ │ ├─ app.js │ │ ├─ hello.coffee │ │ └─ main.js │ ├─ stiluri / │ │ └─ main.css │ ├─ .htaccess │ ├─ 404.html │ ├─ favicon.ico │ ├ ─ index.html │ └─ robots.txt │ ├─ node_modules / │ ├─ astfel încât / │ ├─ multe / │ └─ pachete / │ ├─ testare / │ ├─ spec / │ │ └─ test.js │ ├─ .bowerrc │ ├─ bower.json │ └─ index.html │ ├─ .bowerrc ├─ .editorconfig ├─ .gitattributes ├─ .gitignore ├─ .jshintrc ├─ bower.json ├─ Gruntfile.js └─ package.json

Dacă luați ceva de la acest articol, lăsați-l să fie reprezentarea minunată a fișierului / directorului de mai sus. Asta a luat o întreagă rocă de munte a timpului meu.

Înapoi pe pistă. Ceea ce vă uitați este cea mai obișnuită structură de aplicare pe care o va produce un generator Yeoman.

• app / este locul în care trăiește codul dvs. sursă pur, necompilat și neminimalizat.
• app / script-uri / este locul în care rulează JavaScript. Ești liber să creezi sub-directoare și chiar să folosești CoffeeScript dacă e ceașcă de ceai. Asta nu avea sens. Din nou. Ești liber să folosești TeaScript dacă e ceașcă de cafea. nope.
• app / stiluri / este locul în care rulează CSS-ul tău. Din nou, sub-directoarele, LESS, Sass, whatevs.
• app / index.html este versiunea non-minified a index.html care va fi în cele din urmă stinsă și livrată clientului. Mai multe despre asta mai târziu.
• Gruntfile.js are toate sarcinile de construire, server și testare definite.

In acest punct, yo și-a făcut treaba. El ți-a dat tot ce ai nevoie pentru a lansa o aplicație web gata de producție. Să ne îndreptăm acum atenția asupra sarcinilor Grunt pe care le-a configurat pentru noi.

grunt build

Alergare grunt build te ia app / codurile sursă și le transformă într-o aplicație distribuabilă, care se termină dist /.

Acea dist / este ceea ce vă alimentați pe serverul dvs.. dist / va avea propriile sale index.html, cu referințe la minificate și concatenate Dist / script-uri și Dist / stiluri, și optimizate Dist / imagini. Utilizatorii dvs. vor aprecia acest lucru. Telefonul dvs. de telefon, utilizatorii prin dial-up vor într-adevăr apreciez asta.

În spatele scenelor, grunt build este o sarcină care execută mai multe sub-sarcini. Unul dintre ele este groh-usemin, care caută blocuri în interiorul dvs. app / index.html, asa:

app / index.html

După tine grunt build sarcina se încheie, veți sfârși cu acest lucru:

dist / index.html

Acesta a suflat aceste scripturi, concatenate, minificate, și chiar le-a prefixat cu hashes unice pentru a împiedica browserele să cache versiuni depășite. Destul de puternic.

Aceasta este una dintre trăsăturile strălucitoare despre utilizarea lui Yeoman. În loc să definiți manual ceea ce doriți ca procesul dvs. de construire să faceți de fiecare dată când creați o aplicație, puteți doar să vă încredeți în Yo și pe generatorul dvs. ales. Împreună, vă vor contacta cu tot ce aveți nevoie pentru a lansa o aplicație pregătită pentru producție.

serverul de șmecherie

Acum că ați văzut ce tip de muncă grunt build va face cand cererea dvs. este completa, ar trebui probabil sa incepeti sa lucrati la aplicatia dvs.! Vom crea unul împreună în doar o secundă, dar mai întâi să vedem ce fel de flux de lucru vom avea. Ca grunt build, serverul de șmecherie utilizează alte câteva sarcini Grunt pentru a face dezvoltarea cât mai ușoară posibil.

Încearcă:

Cele mai sus menționate "alte câteva sarcini Grunt" sunt:

• curat: Yeoman stochează niște lucruri într-un .tmp pliant. Acesta va fi șters.
• cafea: Compilează fișierele CoffeeScript de la app / script-uri.
• busolă: Compilează fișierele Sass de la app / stiluri.
• conectați: Creează un server local, urmărește modificările aduse fișierelor sursă, apoi declanșează o reîncărcare în browser.
• deschis: Deschide instanța de server, de obicei localhost: 9000 în browserul dvs..

Faceți o editare sau două în fișierele sursă pentru a vedea modificarea reflectată în browser. Asa cum am spus mai sus, este cam la fel de usor cum poate fi. Pur și simplu funcționează.

Să-l aplicăm!

Desigur, am însemnat aperitive. Luați niște bastoane, apoi întâlniți-mă puțin.

Spala-ti mainile!

Să creați o aplicație

Pentru a obține o senzație pentru alți generatori de Yeoman, să încercăm o coloană vertebrală. Vom crea o aplicație simplă de a face, vom folosi Bower pentru dependențele noastre și vă vom prezenta într-un flux de lucru real cu Yeoman.

$ Sunați bine? (Y / n)

Presupun că ai intrat "Y". Calarim! Dar mai intai:

 # instalați generatorul Backbone: $ npm install -g generator-backbone # a face un alt director de joc, apoi face aceste lucruri: $ yo backbone _ ----- _ | | | - (o) - | .--------------------------. '---------' Bine ați venit la Yeoman, | (_'U'_) | doamnelor si domnilor! | / ___ A ___ \ '__________________________ " ~ | __'.___.'__ "|.? ° 'Y' Din caseta I includ HTML5 boilerplate jQuery, Backbone.js și Modernizr Doriți să includă Twitter Bootstrap pentru Sass (y / N) Da Doriți să includeți RequireJS (pentru suport AMD)? (y / N) Nr

Deschideți noua aplicație din editorul dvs. Lucrurile ar trebui să se simtă destul de familiare după experiența noastră cu generatorul de aplicații web. Mai ai încă unul aplicaţia director, cu script-uri /, stiluri / si un index.html.

Înainte de a începe editarea fișierelor, executați:

Server de grunt

Așa cum am vorbit mai devreme, acest lucru pornește de pe server, setează ceasuri pe fișierele noastre, blah blah yipsie-doodle. Browserul dvs. ar trebui să se deschidă și trebuie să fiți întâmpinat cu:

"Allo," Allo!

Păi, trage, trebuie să ținem asta. E așa de frumos. Cu toate acestea, să clarificăm celelalte lucruri.

index.html

 
 
 
"Allo," Allo!
 
  
 
 

Când salvați, browserul dvs. se va reîmprospăta și acolo îl avem! Doar un simplu, cald "" Allo, "Allo".

Să ne facem un plan de joc. Știm că vom crea o aplicație Pentru a face, dar cum ar putea să arate? Vom avea nevoie de alte biblioteci pentru a ne ajuta?

hmm.

Au trecut cel puțin 4 secunde și nu am auzit răspunsuri.

Bine, o să iau o altă rouă după ce arborele de fișiere a băut ultima mea. Te voi informa dacă mă gândesc la ceva.

Pentru a face: configurați structura noastră de fișiere

B3. Un slot groaznic într-un automat pentru o băutură carbogazoasă. Fizz, spumă, dezastru.

În timp ce eram în baie spălându-mi mâinile, am avut o viziune.

 [Add a New To Do] ← caseta de introducere a căderii ← - faceți clic pe o linie va trasa prin titlul elementului de realizat ↓ [x] Pentru a face articolul # 1 [] Pentru a face articolul # 2 ↑ titlu - dublu clic va declanșa o editare "

Sau…

Să ne pregătim cu o structură care să aducă la viață această viziune.

Generator de-coloana vertebrală a venit cu niște arme secrete: subgeneratoare. yo coloana vertebrală ne-a scheletat aplicația, dar reveniți la terminalul dvs. și verificați ce pot face acești băieți:

Consultați index.html:

De ce? Nu numai că a creat și plasat fișiere în directoare relevante, ci chiar le-a inclus în HTML pentru dvs..

Am creat un depozit pentru aplicația noastră "Do To" - verificați-l. Vom arunca o privire asupra fișierelor împreună, dar vă rugăm să consultați depozitul pentru a obține codul complet.

scripturi / main.js

 / * global backboneApp, $ * / window.backboneApp = Modele: , Colecții: , Vizualizări: , Routere: , init: function () new this.Views.TodosView this.Collections.TodosCollection ()); ; $ (document) .ready (funcție () backboneApp.init (););

Gânduri

Generatorul Backbone stabilește câteva bune practici pe care le puteți utiliza imediat din cutie. A luat numele directorului dvs., în cazul meu "backboneApp", și a expus un obiect literal pentru a ține modelele, colecțiile și alte obiecte Backbone pe care le putem crea.

Generatorul încorporează, de asemenea, JSHint în procesul de construire a aplicației dvs., asigurându-vă că codul dvs. este de cea mai înaltă, mai consistentă calitate. Sunteți încurajați să vă personalizați preferințele în interiorul .jshintrc fișier în rădăcina directorului proiectului dvs..

In cele din urma, $ (Document) .ready va apela backboneApp.init, care creează o TodosCollection, apoi o trece în a TodosView. Voi trece mai repede aceste lucruri.

scripturi / colecții / Todos-collection.js

 / * globală backboneApp, backbone * / backboneApp.Collections.TodosCollection = Backbone.Collection.extend (localStorage: new Backbone.LocalStorage ('backbone-generator-todos'), initialize: function () this.model = backboneApp.Models .TodoModel;);

Gânduri

Dacă dorim ca aplicația noastră "Pentru a face" să fie oarecum utilizabilă, trebuie să stăm undeva unde să facem lucrurile de la Do. Există un adaptor Backbone la îndemână, care vă poate fi cunoscut cu numele de Backbone.LocalStorage. Acesta va intercepta apelurile Backbone la backend-ul implicit la distanță și va folosi browserul dvs. window.localStorage in schimb.

Știm că vom avea nevoie de adaptorul Backbone.LocalStorage, dar unde ar trebui să mergem să-l obținem? Idee! Idee!

Nu am folosit prea mult Bower direct. Cand aplicatia noastra a fost schema, Bower a fost folosit in spatele scenei pentru a apuca Modernizr, Twitter Bootstrap, jQuery, Underscore si Backbone. Dar, dacă vrem să adăugăm o altă dependență de JavaScript?

Reveniți la terminalul dvs. preferat și încercați acest lucru:

$ coloana vertebrală de căutare

Ok, uau. Asta e ... mult. Poate ar trebui să-l îngustăm.

 $ bower search backbone.localstorage Rezultatele căutării: backbone.localStorage git: //github.com/jeromegn/Backbone.localStorage.git

Vom merge acolo. Acum trebuie să-l instalăm.

 $ bower instalează backbone.localStorage - salvează clonarea goguitului: //github.com/jeromegn/Backbone.localStorage.git bower cached git: //github.com/jeromegn/Backbone.localStorage.git bower preluând backbone.localStorage bower checking out backbone.localStorage # v1.1.4 instalarea bower backbone.localStorage # v1.1.4

Când lucrați cu mai mulți dezvoltatori, poate fi dificil de asigurat că toată lumea are dependențele corecte și versiunile potrivite. Prin utilizarea --Salvați mai sus, îi spunem lui Bower să-și amintească această nouă dependență, apoi să scrie despre asta în noi bower.json fişier. Când un alt dezvoltator îți clonează proiectul, trebuie doar să fugă bower install pentru a descărca fiecare dependență, păstrând pe toată lumea în sincronizare. De aceea app / bower_components este listat în .gitignore fişier. Au dispărut zilele depozitărilor umflate!

Acum Bower a făcut-o awesomed peste toată aplicația noastră, intrați în app / index.html și actualizați scripturi / vendor.js comentariu bloc:

Când salvați fișierul, browserul dvs. se va reîmprospăta și veți avea gata să utilizați noua bibliotecă. Mai exact, TodosCollection va fi gata de utilizare.

scripturi / colecții / todo-model.js

 / * globală backboneApp, Backbone * / backboneApp.Models.TodoModel = Backbone.Model.extend (implicit: title: ", completat: false, comutare: function () this.save finished:! ('completat'))););

Gânduri

Acesta este un model destul de simplu de bază. Stabiliți câteva proprietăți implicite pentru elementele noastre de lucru și definiți a comutare funcția, utilizată pur și simplu pentru comutarea între starea "Completă" sau "Incompletă".

script-uri / views / Todos-view.js

 / * globală backboneApp, backbone, JST * / backboneApp.Views.TodosView = Backbone.View.extend (el: '# todo-app', șablon: JST ['app / scripts / templates / todos.ejs' : / * ... * /, initialize: function () / * ... * /, render: function () / * ... * /, addTodoItem: funcția () / * ... * /, addAllTodoItems: function () / * ... * /);

Gânduri

Aceasta este cea mai robustă vizualizare a versiunii backbone, astfel încât pentru a vedea definițiile acestor diferite proprietăți și metode, vă rugăm să consultați depozitul.

Cu toate acestea, aici sunt câteva lucruri cheie:

 el: "# todo-app"

Acest selector se potrivește cu acesta

 șablon: JST ['app / scripts / templates / todos.ejs']

Acest lucru JST mic sa strecurat când am spus yo coloana vertebrală: vedere ____. Când a fost creat fișierul JavaScript al vizualizării, subgeneratorul Backbone a creat un fișier de șablon compatibil pentru noi: app / script-uri / templates / todos.ejs.

Aceste .Ejs fișierele șablon vor defini codul HTML al vizualizărilor noastre. Când ne rulați aplicația serverul de șmecherie sau grunt build, fișierele noastre șablon vor fi zdrobite împreună într-un obiect JavaScript, JST. Atunci când afișează fișierul nostru de vizualizare șablon: JST ['cale / spre / vedere / template.ejs'], acest lucru se referă la acest obiect.

scripturi / templates / todos.ejs

Gânduri

Pentru că am răspuns "Da" pentru a include Twitter Bootstrap pentru Sass când ne-am scheffed aplicația, am adăugat câteva nume de clasă pentru a app destul de app noastre. Simțiți-vă liber la stilul inimii voastre în conținutul stiluri / main.scss fişier.

stiluri / main.scss

 @import 'sass-bootstrap / lib / bootstrap'; .ro-unitatea marja: 50px auto 0 auto; lățime: 300px;  forma margin-top: 10px;  ul, li forma marja: 0; umplutura: 0;  ul list-style: nici unul;  li forma display: none;  editare span display: none;  forma display: inline-block;  intrare: verificat ~ span text-decoration: line-through; 

Gânduri

Sass e destul de cool.

De asemenea, este destul de cool că browserul se reîncarcă încă atunci când efectuați o modificare a fișierelor Sass. Dacă ați folosit anterior Sass, știi că poate fi un hassle pentru a obține un mediu de dezvoltare productiv, creat rapid. Din caseta Yeoman, editați, vizionați și reîncărcați cu niciunul dintre problemele menționate mai sus. față zâmbitoare.

script-uri / views / todo-view.js

 / * globală backboneApp, backbone, JST * / backboneApp.Views.TodoView = Backbone.View.extend (tagName: 'li', șablon: JST ['app / scripts / templates / todo.ejs' introduceți funcția (): 'toggle', 'dblclick span': 'toggleEdit', 'submit form': 'toggleEdit', () / * ... * /, comutați: funcția () / * ... * /, toggleEdit: funcția () / * ... * /);

Gânduri

Acest TodoView va reprezenta un element individual. Va fi un

 verificat<%  %>> 
  
Dacă ești ca mine, probabil că vrei să te oprești cu chestiile din To Do și să începi să îți faci propriile aplicații. Dacă vrei să te joci, du-te! După ce ați terminat de generat ca o persoană nebună, reveniți și trimiteți aplicația To To.
 
 
Pentru a face: navă
 
Să punem chestia asta în apă și să vedem dacă plutește! NU puneți computerul în apă. Așteaptă, un MacBook Air plutește? Nu, probabil că nu. Hmm ... 
 
Acesta a fost un paragraf periculos. Să ne pregătim pentru producție, în condiții de siguranță și uscate.
 
serverul de șmecherie a fost uimitor, dar e timpul să ne întâlnim cu fratele său, grunt build. Am vorbit despre el un pic mai devreme, dar să trecem peste câteva detalii.
 
Iată ce este grunt build sarcina este definită ca în Gruntfile.js:
 
 grunt.registerTask ('build', ['clean: dist', // Îndeplinește cafeaua .tmp / dist / folders ', // Compilează fișierele CoffeeScript (dacă există)' createDefaultTemplate ', // Crează un JS fișier care configurează obiectul JST 'jst', // Compilați 'busola' / scripts / 'files': dist ', // Compilează Sassiness' useminPrepare ', // Se caută pentru acei  în HTML 'imagemin', // Optimizează imaginile! 'miniaturi ale fișierelor HTML' concat ', // Sarcină folosită pentru a concatenarea JS și CSS' cssmin ', // Minifies fișierele CSS' uglify ', // Sarcina folosită pentru a minima copia JS' // Copiază fișierele din .tmp / and app / în dist / 'rev', // Creează hashesuri unice și renamiază noile fișiere JS / CSS 'usemin' // Actualizează referințele în HTML cu fișierele noi]) ;
 
Deci, chestia asta e destul de legitimă. Toate aceste sarcini sunt definite în interiorul Gruntfile.js, astfel încât să vă simțiți liberi să vă loviți și să vă ajustați pentru a personaliza construirea aplicației. Este foarte probabil că nu va trebui să faceți niciun fel de personalizare, dar este acolo dacă aveți nevoie.
 
Un alt lucru. grunt build este de fapt înfășurată în interiorul unei alte sarcini.
 
mormăit
 
Pur și simplu alerga mormăit va executa Mod implicit sarcină:
 
 grunt.registerTask ("implicit", ['jshint', 'test', 'build']);
 
Primele două sarcini, jshint și Test sunt ușor de trecut cu vederea atunci când graba un app din ușă, dar sunt foarte importante.
 
JSHint
 
 jshint sarcina se va consulta cu dvs. .jshintrc fișier pentru a afla preferințele dvs., apoi scanați prin toate fișierele JS pentru a vă asigura că regulile dvs. sunt respectate. Pentru a obține o rulare completă a opțiunilor cu JSHint, verificați documentația JSHint.
 
Test
 
 Test sarcina arată astfel:
 
 grunt.registerTask ('test', 'clean: server', 'coffee', 'createDefaultTemplate', 'jst', 'compass', 'connect: test', 'mocha']);
 
În principiu, este suficient să creați și să vă serviți aplicația pentru testul dvs., Mocha, pentru a vă executa testele.
 
Oh, prostii.
 
În dreptul ușii tale app / și dist / directoare, acest mic Test/ Buckaroo ne așteaptă atenția. Ooo.
 
Dacă deschizi asta, vei vedea Test/ are propriul bower.json și index.html, precum și a spec / director. Testele tale vor avea unele dependențe proprii, biblioteca Chai Assertion și cadrul de testare Mocha.
 
Extindeți asta spec / director și veți vedea o test.js fișier care arată cam așa:
 
 / * descriere globală, aceasta * / "utilizarea strictă"; (funcția () descriu ('dă-i niște contexte', funcția () descrie ('poate un pic mai mult context aici', funcția () ); ););) ();
 
Ok, pare că am putea folosi o cerere de tragere pentru a corecta unele gramatici. Cineva?
 
Dacă nu ați mai scris propriile dvs. teste, veți vedea termeni precum descrie, aceasta, inainte de, beforeEach, după, și după fiecare Pop-up. descrie este un pachet pentru un grup de teste conexe, ____Fiecare sunt funcțiile opționale care se vor executa inainte de sau după testul dvs. (e) și fiecare aceasta este un test specific.
 
Încercați să rulați a încercare grunt pentru a vedea toată magia desfășurată.
  
 
Ar trebui să jucați și să vedeți dacă puteți scrie câteva teste pentru aplicația noastră de a face. Câteva idei pentru cazurile de testare ar putea fi:
 
 
Crearea unui nou element pentru a fi salvat în localStorage?
 
Are un titlu nou de produs Do To să fie tăiat (eliminând spațiul alb)?
 
Când editați un element Pentru a face, șterge titlul, apoi salvează scoateți elementul To Do de la localStorage?
 
 
Mai este încă un lucru de făcut.
 
apasa Enter
 
$ grunt
 
Ar trebui să vedeți cuvintele noastre preferate: Efectuată, fără erori.
 
 
Găsi Yeoman
 
Yeoman este încă destul de tânără; tocmai a transformat unul! Lucrurile sunt destul de bune acum și ele se vor îmbunătăți. Cu toate acestea, ca toți cei de un an, Yeoman învață încă să meargă fără să cadă și să vorbească fără să scadă. S-ar putea să intri într-un bug sau două. În momente ca acestea, gândiți-vă la el ca la nepotul tău drăguț. El are nevoie de modele pozitive în viața sa, astfel încât să-l ajute să învețe!
 
Asta a făcut carte reală a copiilor, foarte repede. O sa cresc putin: sunt bug-uri si avem nevoie de ajutorul tau pentru a scapa doodia din ele (am spus "putin"). Chiar dacă nu este un bug, dar sunteți ca "Știu că un GRUND mult mai rapid plug-in acest generator ar putea folosi," raportați-l la problema generator de urmărire a problemelor.
 
Dacă doriți să aflați mai multe despre Yeoman sau doar să cunoașteți echipa, veți găsi peppered pe toate site-urile următoare.
 
 
yeoman.io
 
Ghidul începătorului
 
@yeoman pe Twitter
 
+Yeoman pe Google+
 
 
Dacă sunteți doar blocați, încercați una din următoarele resurse pentru o mână de ajutor.
 
 
StackOverflow
 
#yeoman pe IRC
 
 
Yeoman este doar o bucată din întregul pachet - NPM, Node, Grunt și Bower. Poate fi intimidant dacă nu sunteți familiarizați cu acestea, dar este crucial să nu vă temeți de curbă! Învățarea va trebui să se întâmple și, ca întotdeauna, probabil că va trebui să se întâmple așa cum trebuie înainte de a se bate cu adevărat.
 
Psst, dacă folosești sudo înainte de fiecare comandă, alerga, nu merge, până la Nod și NPM în 30 de secunde. Aici veți găsi mai multe scripturi pe care le puteți rula pentru a vă controla contul de utilizator. De asemenea, vă va ajuta să instalați Node și NPM dacă începeți de la zero.
 
 
Yo 'Urmatoarea aplicatie - Will You Yo?
 
Ca toate uneltele, cred că Yeoman este ceva pe care fiecare dezvoltator ar trebui să îl încerce. Dacă îi dai o șansă și nu este potrivit pentru sarcina ta, eu și restul echipei ar plăcea să aud de ce. Dacă aveți nevoie de un prieten pentru a vă ajuta cu proiectul dvs., veniți să mă găsiți. Sunt întotdeauna disponibil în jurul link-urilor de mai sus, sau doar mă ping pe Twitter. Sunt @ stephenplusplus sau Stephen Sawchuk.
  
 
Încântat de cunoștință.



		
			
	   
	




Cod