Share
Bine ați venit în partea I a seriei tutorialului privind crearea unui test sau a unei aplicații de studiu cu jQuery Mobile și Rails. Această serie va demonstra modul în care se construiește o aplicație web compatibilă pentru dispozitive mobile, care va permite utilizatorilor să răspundă la o serie de întrebări într-un mod vrăjitor.
jQuery Mobile conține câteva funcții utile, disponibile în afara casetei, pentru a face aplicația noastră web utilizabilă pe o varietate de dispozitive mobile. În majoritatea cazurilor, template-ul de bază și temele CSS care vin cu jQuery Mobile vor fi suficiente. Cu toate acestea, deoarece toate templatiile se fac in CSS, putem personaliza aspectul site-ului nostru destul de usor.
jQueryMobile este o alegere cadru ideală atunci când construiți o aplicație web mobilă din mai multe motive, printre care:
1) Deoarece cadrul este construit pe jQuery, există o curbă mică de învățare pentru oricine care a folosit jQuery pe web.
2) Este în prezent compatibil cu multe platforme importante, printre care: iOS, Android, BlackBerry, Palm WebOS, Nokia / Symbian, Windows Mobile etc..
3) Dimensiunea comprimată a bibliotecilor incluse este de aproximativ 12k, ceea ce este foarte ușoară pentru capacitățile oferite.
Pentru backend, vom folosi Rails 3 cu câteva pietre, inclusiv Tipus.
Pentru a începe, permiteți crearea unei aplicații noi pentru șine:
șine noi .
Asigurați-vă că aveți cea mai recentă versiune a biletei de șine instalate. Dacă aveți aplicații pe care le dezvoltați care necesită Rails 2, vă sugerăm să cercetați și să instalați RVM (Ruby Version Manager). Acest lucru vă va salva multe dureri de cap, care pot fi cauzate de problemele legate de versiunile de bijuterii.
În continuare, permiteți adăugarea pietrelor noastre în GemFile noastre:
sursa 'http://rubygems.org' gem 'rails', '3.0.7' gem 'sqlite3-ruby',: require => 'glite' > 'http://github.com/fesplugas/typus.git' gem 'acts_as_list'
După cum puteți vedea, vom folosi Rails 3.0.7, deoarece este cea mai recentă versiune stabilă a Rails din această scriere. Vom renunța, de asemenea, la bibliotecile standard Prototype JS care vin împreună cu Rails, instalând gheața jquery-rail. Din moment ce jQueryMobile va necesita în mod evident biblioteca de bază jQuery, atunci într-adevăr nu avem niciun motiv să păstrăm bibliotecile Prototype incluse.
Pentru secțiunea noastră admin, vom instala gemul Typus și act_as_list. Cu doar puțină configurație, Tipus va oferi o întreagă backend pentru gestionarea întrebărilor pe care le vom crea pentru sondajul nostru. Faptele ca listă funcționează fără probleme cu Tipus și ne va permite să controlam cu ușurință ordinea întrebărilor noastre.
Acum putem rula bundlerul pentru a instala pietrele noastre:
instalare pachet
Atât bijuteria jQuery, cât și bijuteria Tipus au generatoare care funcționează pentru a avea în mod esențial pietrele prețioase. Acest lucru se realizează executând următoarele comenzi în directorul de aplicații:
șinele generează jquery: instalați șinele genera tipus
Implicit, Tipus nu are nici un fel de poarta de autentificare. Deoarece aceasta este aproape ca un acces direct la baza de date, ar trebui să o asigurăm ca un prim pas. Cea mai simplă metodă de securizare a acesteia este adăugarea elementului http auth de bază. Acest lucru nu este în mod evident sigur, dar pentru scopurile tutorialului nostru este suficient. Pentru a face acest lucru, trebuie să adăugăm următoarele linii în fișierul config / initializers / typus.rb:
config.admin_title = "sondaj" config.authentication =: http_basic config.username = "admin" config.password = "trece"
Acest lucru va determina utilizatorul să introducă un nume de utilizator și o parolă atunci când adresa URL / admin este accesată.
Acum, că aplicația noastră este pe deplin configurată, putem începe să generăm resursele și schema de baze de date. Putem folosi metoda stenografiei Rails de a face acest lucru direct din linia de comandă cu următoarele:
șinele generează întrebarea privind întrebarea: poziția șirului: șirul întregului genera alegerea alegerii de resurse: șirul question_id: întregul șine genera resursa răspuns answer_id: integer choice_id: integer rake db: migrate
Acum avem 3 tabele în baza noastră de date. Unul va găzdui întrebările pe care le vom întreba utilizatorul. Fiecare întrebare va avea mai multe opțiuni și un răspuns va fi un rezumat care stochează combinația de ID-uri pentru o întrebare și o alegere. Din moment ce alegerile vor avea doar o singură întrebare, câmpul question_id din tabelul cu răspunsuri nu este cu adevărat necesar. O vom pune aici ca accesoriu simplu pentru simplificarea interogărilor, cum ar fi tragerea răspunsurilor la o întrebare. Câmpul de poziție din tabelul cu întrebări ne va permite să specificăm ordinea întrebărilor, așa cum vor apărea în sondajul nostru.
Pentru a adăuga aceste relații la modelele noastre, le vom modifica după cum urmează:
/app/models/question.rb
clasa Întrebare < ActiveRecord::Base acts_as_list has_many :choices end
După cum puteți vedea mai sus, adăugăm pluginul actions_as_list la acest model, astfel încât să putem modifica ordinea de apariție pentru fiecare întrebare din ancheta noastră.
/app/models/choice.rb
clasa Alegerea < ActiveRecord::Base belongs_to :question end
/app/models/answer.rb
clasa Răspuns < ActiveRecord::Base belongs_to :question belongs_to :choice end
Terminat! Acum, că resursele și tabelele de baze de date au fost generate, trebuie să creăm niște nume de controlere în cadrul unui dosar admin pentru Tipus. Pentru aceasta, executați următoarele comenzi:
șine generatoare controler admin / răspunsuri șine generatoare controler admin / alegeri șine generatoare controler admin / întrebări
Apoi, trebuie să modificăm primele linii din fiecare dintre fișierele controlerului nostru, pentru ca administratorul să moștenească din ResurseController în locul aplicației de bază ApplicationController. În Tipus, odată ce am moștenit de la ResourcesController, obținem unele funcții CRUD puternice din cutie fără a mai fi nevoie să scriem alte coduri. Mai jos sunt înlocuirile necesare:
/app/controllers/admin/answers_controller.rb
a inlocui:
clasa Admin :: AnswersController < ApplicationController
cu:
clasa Admin :: AnswersController < Admin::ResourcesController
/app/controllers/admin/choices_controller.rb
a inlocui:
clasa Admin :: ChoicesController < ApplicationController
cu:
clasa Admin :: ChoicesController < Admin::ResourcesController
/app/controllers/admin/questions_controller.rb
a inlocui:
clasa Admin :: QuestionsController < ApplicationController
cu:
clasa Admin :: QuestionsController < Admin::ResourcesController
Aproape acolo! Acum trebuie să adăugăm câteva declarații de configurare în fișierul nostru de configurare Typus. Dacă există alte fișiere yaml situate în directorul config / typus, le putem șterge deoarece nu sunt necesare. Tipus probabil a creat fișiere de configurare sample atunci când am executat declarația generatorului. Să creăm un fișier numit typus.yml situat aici: config / typus
Mai întâi, vom adăuga instrucțiunile de configurare pentru modelul Choice:
Alegerea: câmpuri: implicit: alegere, question_id, formular de întrebare: alegere, question_id, întrebare order_by: relații: filtre de întrebare: created_at, filtrele de opțiuni: create_at căutare: aplicarea întrebării: sondaj
Să facem asta:
Alegere: câmpuri: implicit: alegere, question_id, formular de întrebare: choice, question_id, question
În doar câteva linii de configurare, Tipus va crea o mare parte din funcționalitatea backend pentru noi. Pentru a începe, vom specifica câmpurile pe care trebuie să le editați. Secțiunea implicită a definirii câmpurilor ne va permite să setăm câmpurile care vor fi afișate în lista noastră. În acest caz, este același set de câmpuri pe care le vom permite administratorului nostru să le fixeze în formularele noastre de creare și actualizare. Acest lucru este specificat în secțiunea de formă a definiției câmpurilor.
order_by:
În mod implicit, alegerile noastre vor fi ordonate în ordinea în care sunt create, deci nu trebuie să specificăm nimic pentru order_by.
relații: întrebare
Fiecare alegere aparține unei singure întrebări, astfel încât să putem defini o relație de întrebare cu modelul nostru de alegere. Tipus va proiecta automat formularele noastre pentru a explica modul in care inregistrarile de date se raporteaza unul la celalalt.
filtre: create_at, întrebare
Filtrele pot fi definite în tip, pur și simplu prin listarea câmpurilor și / sau a relațiilor din definiția filtrelor. Pe baza tipului de câmp, tipus va crea funcționalitatea filtrului în backend. În cazul create_at, acesta va fi un set de drop-uri pentru a specifica o dată. Pentru întrebare, aceasta va fi o scădere a tuturor întrebărilor stocate în baza de date.
căutare: aplicație: sondaj
Definiția căutării nu ne este utilă pentru acest model, deoarece este puțin probabil să căutăm vreo alegere. Dacă am specificat aici câmpuri, tipus ne-ar oferi o casetă de căutare, astfel încât să putem filtra înregistrările stocate în DB noastre printr-un termen de căutare. Definiția aplicației aici este numele aplicației pe care modelele noastre o numim "sondaj".
Ca pas final de curățare, elimină fișierul public / index.html care va bloca traseul nostru implicit.
Acum putem porni serverul nostru:
rails s
Vizitați următoarea adresă URL în browser pentru a testa noul nostru administrator:
http: // localhost: 3000 / admin
Aceasta concluzionează partea I din seria tutorialului nostru privind crearea unui test sau a unei aplicații de cercetare în Rails și jQueryMobile. Rămâneți acordat pentru partea a II-a unde vom implementa interfața noastră jQueryMobile.
Accentsconagua