În această serie de trei părți, vom fi scufundați adânc în procesul de creare a unei aplicații de gestionare a listei de sarcini în Node.js și Geddy de la zero. În acest articol introductiv, vom examina modul de instalare a Node.js pe Windows și OS X, prin instalarea Geddy și generarea primei noastre aplicații. Gata?
Dacă ați dezvoltat aplicații web în ultimii ani, probabil că sunteți deja familiarizați cu Node.js, dar hai să mergem peste asta - doar în cazul în care sunteți nou în scenă.
Node.js este o platformă construită pe timpul de executare JavaScript Chrome pentru a construi cu ușurință aplicații în JavaScript care rulează pe server. Node.js folosește un model de I / O non-blocat, bazat pe evenimente, ceea ce îl face perfect pentru construirea de aplicații în timp real.
Geddy ar trebui să vă simtă foarte familiar.
Geddy este un cadru simplu și structurat MVC (model, vizualizare, controller) pentru Node.js. Puteți să-l utilizați pentru a crea rapid aplicații web și API-uri JSON. Dacă ați făcut vreun nivel de lucru cu Ruby on Rails sau CodeIgniter din PHP, Geddy ar trebui să vă simtă foarte familiar; are un ruter restant, redare șablon, controlori și modele.
Node.js rulează pe Windows, OS X și Linux. Vă voi arăta cum să vă configurați atât pe Windows cât și pe OS X. Dacă sunteți pe Linux, presupun că ați instalat nodul, știți cum să îl instalați sau știți pe cineva care vă poate ajuta procesul.
Mai întâi, accesați http://nodejs.org și faceți clic pe butonul de descărcare. Găsiți linkul de instalare pentru sistemul dvs. de operare și descărcați-l. Urmați promptul de instalare pentru a fi instalat. Dacă sunteți pe Windows, este posibil să fie nevoie să reporniți computerul pentru a obține comanda "nod" pe calea ta.
Ar trebui să aveți acum atât Node cât și npm (Node Package Manager) instalate.
Nodul are un manager de pachete grozav construit chiar înăuntru. Se numește npm și, din această scriere, există aproape 8000 de pachete disponibile. Consultați http://toolbox.no.de pentru a naviga prin ele dacă doriți. Pentru acest tutorial, cu toate acestea, vom folosi npm pentru a instala Geddy (framework-ul nostru) și Jake (instrumentul de construcție folosit de Geddy):
Jake este un program de construire a JavaScript pentru Node.js.
npm instalează-g geddy jake
Asta e! Acum că ați instalat Geddy, să vedem despre generarea primei dvs. aplicații.
Geddy utilizează un executabil global pentru a genera aplicații / resurse și pentru a porni serverul de aplicații. Toate acestea vor avea loc pe linia de comandă, așa că deschideți terminalul din nou. Înainte de a ne genera aplicația, hai să mergem CD
la o locație bună pentru a stoca aplicația dvs. Acest lucru poate fi oriunde pe mașină, dar prefer să-mi dezvolt dezvoltarea ~ / Dev /
director.
calea cd / către / loc / tu / cod
Apoi vom folosi geddy
pentru a genera structura aplicației noastre. Vom crea o aplicație de rezolvat, așa că vom apela a noastră, todo_app
aplicația geddy todo_app
Totul este gata. Acum ce a făcut asta pentru noi?
Dacă vă aruncați o privire în noul creat todo_app
directorul, veți vedea că Geddy a generat un cod corect pentru dvs. Structura directorului ar trebui să arate cam așa:
Să trecem prin acestea unul câte unul:
aplicaţia: Aici se petrece cea mai mare parte a magiei. Majoritatea logicii aplicației dvs. vor fi situate într-unul din cele trei directoare conținute în această aplicație.
app / controlere: Toate controlorii aplicației (partea care vă conectează modelele la vizualizările dvs.) intră aici. De asemenea, veți observa că există deja două fișiere de controler: application.js
(la care toți administratorii au moștenit) și main.js
(controlerul care vă unește /
ruta spre dvs. app / views / principale / index.html.ejs
șablon).
app / modele: Iată în care veți fi stocate modelele dvs. - nu există nimic încă acolo, dar vom adăuga unul în timpul tutorialului următor.
app / vizualizări: Toate șabloanele aplicației sunt stocate aici. Pentru moment, veți vedea că aveți un application.html.ejs
fișier în aspecte
director - acest fișier este șablonul principal pentru aplicația dvs., întregul cod de înfășurare din față trebuie să intre aici. De asemenea, ar trebui să aveți un index.html.ejs
fișier în principal
director. Asta este ceea ce primește de la controlerul principal index
acțiune atunci când ați lovit /
traseu.
config: Fișierele de configurare pentru aplicația dvs. merg aici. Ar trebui să aveți development.js
, production.js
, environment.js
, router.js
și init.js
fișiere acolo. init.js
fișierul este un fișier care rulează imediat după ce aplicația începe, înainte ca orice solicitare să apară. Aceasta poate fi utilizată pentru a adăuga funcții și proprietăți care trebuie să fie aplicate la nivel. Router.js
fișierul este utilizat pentru a crea rute pentru aplicația dvs. Rutele leagă URL-urile la acțiunile controlerului. Pentru setările globale, veți dori să editați environment.js
fişier. Pentru setările de producție și dezvoltare, editați fișierele de configurare corespunzătoare.
lib: Acesta este locul unde puteți pune orice fișier pe care doriți să îl utilizați în întreaga aplicație.
Buturuga: Toate jurnalele dvs. vor fi stocate aici. Ar trebui să obțineți unul access.log
, A stdout.log
, și a stderr.log
după ce executați aplicația.
node_modules: Aici vor fi stocate modulele pe care le instalați. Gândește-te la asta ca pe un cod pentru alți oameni.
public: În cele din urmă, iată unde vor trăi toate lucrurile specifice din față. Toate fișierele css, fișierele, imaginile și fișierele din front-end vor fi aici. Veți observa că bootstrap-ul Twitter și jQuery vin pre-ambalate cu toate aplicațiile Geddy.
Acum, când avem o aplicație generată, voi demonstra cum să o pornesc. Mai întâi, deschideți din nou terminalul și navigați la directorul aplicației:
cd ~ / path / to / code / todo_app
Odată ce ați ajuns acolo, porniți aplicația utilizând funcția geddy
comanda:
geddy
Ar trebui să vedeți o ieșire care arată cam așa:
Acum că am pornit serverul, continuați și verificați-l în browser. Vizita http: // localhost: 4000
, și aruncă o privire!
Primă: Deoarece Geddy folosește Bootstrap din cutie, cu aspectul reactiv al acestuia, aplicația noastră va fi afișată imediat într-un browser mobil. Redimensionați fereastra browserului pentru a verifica acest lucru.
Aceasta incheie prima parte a seriilor noastre tutorial despre Node.js si Geddy. În următorul, voi demonstra cum să generați a a face
(care ne va oferi o bază mai bună pentru a construi aplicația noastră) și să ne referim la detaliile construirii unei aplicații reale cu Geddy. Dacă aveți întrebări, nu ezitați să lăsați un comentariu aici sau să deschideți o problemă pe GitHub. Rămâneți aproape!