Ruby on Rails – vývoj dynamických web 2.0 aplikácií

Obsah práce

1.	Fenomén Web 2.0
2.	Ruby on Rails – vývoj dynamických web 2.0 aplikácií
3.	Framework "Ruby on Rails" a web 2.0 (Prílohy)

Ruby on Rails – vývoj dynamických web 2.0 aplikácií

Ako názov vypovedá, Ruby on Rails je framework, založený na jazyku Ruby, pri tvorbe ktorého sa autor Matsumoto snažil o jazyk, optimalizovaný pre spôsob vývoja softvéru. Základné rysy jazyka Ruby:

• Interpretovaný
• Čisto objektovo orientovaný
• Funkcionálny
• Dynamické typovanie – "duck typing"
• Automatická správa pamäte – Garbage collection
• Vlákna
• Reflexia – introspekcia

Poznámka: Podrobnejšie informácie o syntaxe jazyka Ruby a štruktúre frameworku Rails sú k zhliadnutiu v práci "Pokročilé vlastnosti skriptovacích jazykov", z ktorej táto práca vychádza.

Ruby on Rails sa v poslednej dobe zaradil medzi celosvetovo populárne webové frameworky. Svoju pozíciu dosiahol aj napriek tomu, že súperí s takými pôvodnými hráčmi ako J2EE/JEE a dôvodom nie je len jeho funkcionalita. Ďalším aspektom, ktorý podporuje akceptovanie Rails je jeho filozofia. Oba tieto aspekty ho predurčujú k tvorbe dynamických web 2.0 aplikácií.

Filozofia Ruby on Rails

Filozofia sa zakladá na dvoch základných princípoch:

• DRY – Don't Repeat Yourself (Neopakuj sa) – redukuje duplikáciu kódu v projekte, ktorá vedie ku komplikáciám pri modifikácii projektu a údržbe
• Convention over Cofiguration (Konvencia nad konfiguráciou) – Konfigurácii prepadli frameworky webových aplikácií natoľko, že hoci aj tak jednoduchá úloha, ako použitie validácie povinného poľa vo formulári iba pre jedno pole vyžaduje vstup do XML súboru. Princípom Ruby on Rails je programovať iba tie aspekty, ktoré sú odlišné od bežných aplikačných nastavení. Príkladom je ORM (Object Relational Mapping) framework poskytovaný prostredníctvom Rails. Pokiaľ nie je špecifikovaný iný názov ORM objektu, tento objekt používa meno tabuľky to ktorej je zaradený.

Aspekty Ruby on Rails

Práve aspekty založené na filozofii DRY a Konvencia nad konfiguráciou sú tým, čo robí Ruby on Rails tak atraktívnym pre vývoj dynamických webových stránok. Takýmito aspektami, ukazujúcimi alternatívne spôsoby pre implementáciu rôznych techník na strane serveru sú:

• Automatické nastavenie štruktúry aplikácie – štruktúra akejkoľvek novovytvorenej aplikácie nemusí byť vatváraná ručne. Na vytvorenie kompletnej štruktúry vrátane priečinkov a základných webových súborov ako index.html sa vytvorí pomocou jediného príkazu. Preto nie je potrebné zháňať ďalšie pomocné programy alebo nastavovať štruktúru ručne.
• Generácia štandardného kódu – Každá aplikácia obsahuje určité bloky kódu, ktoré sú nevyhnutne identické pre všetky ostatné aplikácie rovnakého typu alebo kategórie. Takéto bloky sa nazývajú anglicky "boilerplate code", čiže štandardný text kódu. Príkladom takéhoto kódu je blok kódu nastavujúci spojenie s databázou. Rovnaký kód môže byť použitý v rôznych aplikáciách len s malými zmenami. Napriek tomu väčšina frameworkov neposkytuje žiadny zabudovaný mechanizmus redukujúci tento "opätovný objav kolesa". Rails zabraňuje duplikácii použitím saffold-u. Scaffold obsahuje iba minimum kódu na uskutočnenie úloh ako je pripojenie k databázi, nastavenie pripojenia a podobne.
• Dynamické mapovanie (zobrazenie) tried to databázových schém – V súčasnosti sa žiadna webová aplikácia nezaobíde bez vlastnej databázy. ORM frameworky zjednodušujú prístup k nej, aj keď aspekt konfigurácie redukuje prípadné výhody pre vývojárov. V prípade Rails ORM nepotrebuje žiadnu konfiguráciu. Počas behu programu Rails číta a mapuje schému založenú na menách tried a zodpovedajúce tabuľky používajúce reflexiu a metaprogramovanie. Programátor navyše získa vyššiu produktivitu.
• Ajax v jadre prezentácie – Ajax je technológia poskytujúca interaktivitu webových stránok bez toho, aby bola dotieravá. Všetký aktuálne technológie na strane servru požadujú podporu Ajaxu, lenže táto podpora je len okrajová a nie v jadre. Je potrebné stiahnuť nové knižnice, nakonfigurovať ich a potom spustiť cyklus vývoj-kompilácia-vývoj-testovanie opäť. Namiesto toho je Ajax zabudovanou súčasťou knižníc jadra Rails. Tým sa inštaláciou Ruby on Rails automaticky sprístupní podpora technológie Ajax. Použitie je rovnako jednoduché ako použitie akejkoľvek inej knižnice ponúkanej prostredníctvom Rails.
• Doplnky – Ruby on Rails obsahuje množstvo ďalších knižníc a pomocných metód, ktoré zabezpečujú v podstate všetky požiadavky dynamických web 2.0 stránok, zahŕňajúc správu grafického zobrazenia, zasielania správ a podobne. Knižnice sú pochopiteľné, plne kvalifikované komponenty samy o sebe, reprezentujúce rozdielne služby poskytované webovou stránkou alebo portálom.

REST a Rails

Jednou z vecí, o ktoré vývojári usilujú, je vytvorenie webovej aplikácie, respektíve akejkoľvek aplikácie, ktorý by bola založená na dobre zorganizovanom základe kódu s uceleným použitím zákonitostí a pomenovávacích konvencií. Toto prispieva veľkou mierou k celkovej udržateľnosti funkčnosti aplikácie, napriek tomu nejde o jednoduchú úlohu, najmä ak ide o aplikáciu na ktorej pracuje viacero vývojárov. V oblasti vývoja webových technológií nikdy neexistovala celosvetovo akceptovaná predloha pre pomenovanie modelov, kontrolérov a ich akcií. Rails zavádza určitú úroveň štandardov pre pomenovanie tried, avšak neovplyvňuje to štruktúru kontrolérov. Na to sa využíva štýl softvérovej architektúry nazývanej REST.

V poslednom čase bola zaznamenaná zvýšená popularita vývojovej schémy známej ako Representational State Transfer, REST (reprezentovaný prepis stavu), pričom Rails naplnil jeho popularitu. Tvorca framworku Ruby on Rails, David Heinemeier Hansson, je veľkým zástancom štýlu REST. Hansson uviedol tento vývoj REST do Rails komunity počas jeho hlavného prejavu na konferencii RailsConf v roku 2006, nazvaného "A World of Resources". So spustením novej verzie 2 frameworku Rails sa REST stal štandardným spôsobom vytvárania Rails webových aplikácií.

Pojem REST vytvoril vo svojej dizertačnej práci Roy Fielding, ktorý bol jedným z tvorcov protokolu HTTP. REST opisuje metódu architektúry softvéru, postaveného na koncepte zdrojov, skôr ako na koncepte akcií. REST sa tým stáva dobrou voľbou pre vývoj webových aplikácií. Vnútri REST architektúry používajú požiadavky z prehliadača štandardne nastavené HTTP metódy na správu zdrojov aplikácií.

Väčšina vývojárov je dôverne oboznámená s iba dvoma dostupnými HTTP metódami, metódou GET a POST, i keď HTTP protokol ich definuje 8: GET, POST, PUT, DELETE, HEAD, TRACE, OPTIONS a CONNECT. REST sa zaujíma o prvé štyri tieto metódy, GET, POST, PUT a DELETE. Toto sú metódy, ktoré používa webová aplikácia so štýlom architektúry REST na správu zdrojov. REST je preto ideálnou voľbou v prípade databázových webových aplikácií. V takýchto prípadoch zdroje smerujú na modely, ktoré smerujú do databázových tabuliek.

V tradičnej webovej aplikácii vytvorenej napríklad vo frameworku Rails špecifikuje požiadavka akciu a zdroj, pre ktorý sa má daná akcia vykonať. Napríklad nasledujúcu adresu URL je možné vidieť v Rails aplikácii:

http://www.myapp.com/book/show/5

Táto URL odovzdáva Rails spätnú informáciu o zavolaní metódy show kontroléru book, ktorá zobrazí objekt triedy book s ID 5. Aplikácia byužívajúca REST nepotrebuje špecifikovať akciu v adrese URL. Miesto toho URL špecifikuje iba zdroj. Akcia je v tomto prípade podmienená metódou HTTP, s ktorou je požiadavka odosielaná.Ekvivalentom predošlej ukážky s použitím REST je nasledovná URL:

http://www.myapp.com/book/5

Táto požiadavka by bola odoslaná s použitím HTTP metódy GET a nasmerovaná do tej správnej metódy show, založenej na prijímaní požiadaviek typu GET. Pri rozšírení príkladov s manipuláciou objektu book môžeme použiť aj iné akcie spolu s REST. Tieto akcie zobrazuje tabuľka 2.1.1.

Tabuľka 2.1.1:Akcie a HTTP metódy v aplikácii so štýlom architektúry REST

Akcia	URL	HTTP metóda
show	www.myapp.com/book/5	GET
destroy	www.myapp.com/book/5	DELETE
update	www.myapp.com/book/5	POST
create	ww.myapp.com/book	PUT

Za povšimnutie stojí, že URL pre vykonanie akcie show, destroy a update so zdrojom je identická. Tieto požiadavky sú nasmerované ku správnym metódam kontroléru na základe kombinácie URL a metódy HTTP, ktorá je použitá na odoslanie.

Všetky kontroléry v Rails aplikácii sú implementované rovnakým štýlom a obsahujú rovnakú sadu metód. V prípade potreby je možné doplniť kontroléry o vlatné dodatočné metódy a s použitím REST sa stáva dizajn kontrolérov a modelov omnoho prehľadnejší a ucelenejší. Následne si treba uvedomiť, že nie každý zdroj je vždy uložený v databázovej tabuľke. V aplikácii môžu byť zdroje, ktoré nie sú uložené ako modely, napriek tomu je možné nasledovať štýl REST.

Výhody štýlu REST

• Ucelený a dobre definovaný aplikačný dizajn – REST definuje štandardný spôsob implementovania kontrolérov a prístup k modelom vo webovej aplikácii. Aplikácie, ktoré plynule nasledujú túto architektúru si zachovávajú veľmi čistý a udržateľný základný kód, ktorý je súčasne čitateľný a pochopiteľný. REST uľahčuje prácu viacerých vývojárov na jednej aplikácii a rovnako je pri ňom jasné, kam patrí aký kód.
• CRUD(Create, Read, Update, Delete) kontroléry – každý kontrolér obsahuje kód nevyhnutný pre manipuláciu so špecifickým modelom prostredníctvom štandardných CRUD metód (vytvorenie, zobrazenie, úprava a odstránenie objektu)
• Čisté adresy URL – vďaka tomu, že adresy URL použité v aplikáciách so štýlom REST reprezentujú zdroje a nie akcie, sú tieto URL úspornejšie a stále zobrazujú ucelený formát kontroléru nasledovaný číslom ID zdroja, s ktorým sa manipuluje
• Jednoduchosť integrácie – vďaka konzistentnému API s preddefinovaným zdrojom a menami akcií sa stáva pre ďalšie aplikácie jednoduchšie integovať sa s aplikáciou používajúcou REST prostredníctvom webových služieb založených na REST.

REST a reprezentácie

Keď je zadaná požiadavka za použitia REST, stránka, ktorá sa vracia môže byť za reprezentáciu zdroja, ktorý sa požaduje. Stránka HTML je iba jednou z možných reprezentácií tohto zdroja. Iné reprezentácie môžu zahŕňať XML dokument, textový dokument alebo blok JSON-kódovaný JavaScript. Za použitia štýlu architektúry REST je možné požadovať rôzne reprezentácie zdroja pri volaní rovnakej metódy, ale poslaním rozdielnej časti metadát serveru, ktoré indikujú konkrétnu reprezentáciu, ktorá by mala byť navrátená. Napríklad nasledujúce dve požiadavky by boli obe smerované na rovnaký kontrolér a metódu akcie:

http://www.myapp.com/book/5

http://www.myapp.com/book/5.xml

Prvá požiadavka by vrátila HTML reprezentáciu zdroja book. Druhá požiadavka by vrátila XML reprezentáciu zdroja book. Táto jednoduchosť pridávania výstupných mechanizmov je ďalšou výhodou štýlu REST. Rovnaké kontroléry a akcie môžu byť použité na odosielanie množstva reprezentácií odpovedí – vrátane HTML, RSS a XML. Toto zjednodušuje implementáciu webových služieb do aplikácií s REST a zároveň udržiava konzistetný štýl dizajnu.

Písanie Rails aplikácií štýlom REST

Ako už bolo spomenuté, s uvedením Rails 2.0 bol REST prebraný ako štandardná architektúra pre Rails aplikácie. Znamená to, že Rails poskytuje sadu nástrojov zjednodušujúcu vybudovanie štýlu REST v aplikáciách.

Dôležité je, že použitím generátora scaffold na vytvorenie základnej CRUD kostry aplikácie pre daný zdroj sú kontrolér aj akcie v ňom vygenerované v súlade so štýlom architektúry REST.

Rails smerovanie a REST

V predošlej tabuľke 2.1.1 je možné vidieť ako REST používa URL a HTTP metódu na smerovanie ku konkrétnej metóde akcie. Tabuľka ale nedávala úplný popis, akým spôsobom Rails mapuje URL a HTTP metódy k akciám a kontrolérom. V štandardnej REST Rails aplikácii nemá každý kontolér 4, ale 7 akcií. Tieto sa konvenčne nazývajú show, update, destroy, index, create, edit a new. Smerujú priamo na CRUD akcie modelu ActiveRecord. Ich funkcie sú nasledovné:

• show – zobrazenie špecifickej inštancie zdroja
• update – úprava zdroja
• destroy – odstránenie inštancie zdroja
• index – zobrazenie zoznamu všetkých zdrojov daného typu
• create – vytvorenie novej inštancie zdroja
• edit – vracia stránku, ktorá umožňuje úpravu (update) zdroja
• new – vracia stránku, ktorá umožňuje vytvoriť (create) inštanciu zdroja

Akcie new a create sa používajú spoločne na vytvorenie novej inštancie. Akcia new prezentuje formulár, ktorý sa používa na vytvorenie inštancie a akcia create spracováva odoslanie formuláru a skutočné vytvorenie nového zdroja v databáze. Podobne sa akcie edit a update používajú na úpravu dát existujúceho zdroja. Akcia edit prezentuje formulár, v ktorom je možné vykonať zmeny zdroja a akcia update následne spracuje odoslanie formulára, uloženie zmien v databáze.

Aj v týchto prípadoch Rails stále používa rovnaké štyri HTTP metódy – GET, PUT, POST, DELETE na smerovanie k siedmim podporovaným akciám. Aby sa to dalo dosiahnuť, Rails využíva akciu GET pre viaceré metódy akcií. Tabuľka 2.1.2 znázorňuje, ako sú smerované URL a HTTP metódy ku špecifickým akciám v aplikáci Rails. Rails tiež vytvára dynamické metódy pre smerovanie, napríklad, metódy ako link_to a form_for odvodia cestu podľa zdroja, takže link_to(@book) bude posúdený ako akcia show v kontroléri books.

Tabuľka 2.1.2: Smerovanie REST v Rails aplikácii

Akcia	URL	HTTP metóda	pomenovaná metóda
show	www.myapp.com/books/1	GET	book_path(@book)
update	www.myapp.com/books/1	PUT	book_path(@book)
destroy	www.myapp.com/books/1	DELETE	book_path(@book)
index	www.myapp.com/books	GET	destroy_book_path(@book)
create	www.myapp.com/books	POST	books_path
edit	www.myapp.com/books/1/edit	GET	edit_book_path(@book)
new	www.myapp.com/books/new	GET	new_book_path

Akcie show, index, edit a new používajú všetky metódu GET, takže sú v Rails rozdelené pomocou URL, ktorá je použitá. Pri metódach edit a new je jednoduchosť adries URL s REST trochu naštrbená, keďže tieto akcie vyžadujú použitie mena akcie v URL, aby mohli byť rozlíšené od akcií show a index. Do kontroléru v štýle REST je možné zadať aj vlastné akcie, ktoré ponúknu vlastné pomenovanie metód zhodujúce sa s danou akciou.

PUT a DELETE

V súčasnosti je tu jeden problém v implementácii spomínaného systému, a to ten, že aktuálna generácia webových prehliadačov nepracuje s metódami PUT a DELETE. To znamená, že v reálnom svete sme obmedzení na použitie metód GET a POST. Našťastie, pre vývojárov Rails aplikácií sa nič nemení a smerovania v predchádzajúcej tabuľke sú splatné. Rails totiž simuluje metódy PUT a DELETE vložením skrytého poľa called_methods nastavenej na put alebo delete.

Vygenerovanie REST zdroja

V tejto časti ukážeme, ako je možné vytvoriť začiatok REST Rails aplikácie. Najprv je potrebné vytvoriť samotnú Rails aplikáciu:

> rails rest_app

Príkaz vytvorí štandardnú kostru aplikácie. Rails poskytuje dva generátory, ktoré umožňujú vytvoriť REST zroj:

• scaffold – vytvorí kompletný zdroj, vrátane celého kódu, ktorý je potrebný na vykonávanie základných CRUD operácií štýlom REST. Špecifické súbory vytvorené pri generovaní sú model, migrácia, kontrolér, pohľady a sada testovacích programov.
• resource – vytvorí model, migráciu, kontrolér a testovanie, ale neposkytuje kód nevyhnutný pre vykonávanie CRUD operácií. na rozdiel od scaffold-u nevytvorí žiadne pohľady

Vygenerujeme jednoduchý ukážkový scaffold book:

> ruby script/generate scaffold book

exists app/models/

exists app/controllers/

exists app/helpers/

create app/views/books

exists app/views/layouts/

exists test/functional/

exists test/unit/

exists test/unit/helpers/

exists public/stylesheets/

create app/views/books/index.html.erb

create app/views/books/show.html.erb

create app/views/books/new.html.erb

create app/views/books/edit.html.erb

create app/views/layouts/books.html.erb

identical public/stylesheets/scaffold.css

create app/controllers/books_controller.rb

create test/functional/books_controller_test.rb

create app/helpers/books_helper.rb

create test/unit/helpers/books_helper_test.rb

route map.resources :books

dependency model

exists app/models/

exists test/unit/

exists test/fixtures/

create app/models/book.rb

create test/unit/book_test.rb

create test/fixtures/books.yml

exists db/migrate

create db/migrate/20100116105128_create_books.rb

Vo výstupe môžeme vidieť všetky súbory vytvorené scaffold generátorom. Zameriame sa na zvýraznený riadok:

route map.resources :books

Tento zabezpečí pridanie jedného nového riadku do súboru config/routes.rb. Tym riadkom je:

map.resources :books

Tento jediný riadok automaticky vytvorí kompletnú schému smerovania nevyhnutnú pre zaobchádzanie s CRUD metódami v štýle REST. Všetky smerovania REST z predošlej tabuľky sa týmto riadkom povolia pre zdroj Book.

V prílohe A sa nachádza zdrojový kód kontroléru, modelu a pohľadov vygenerovaných scaffold-om v súlade s štýlom architekrúry REST.

Prototype, script.aculo.us a Rails

JavaScript knižnice Prototype a script.aculo.us sú zahrnuté do distribúcie Rails, takže inštaláciou Rails sa automaticky tieto knižnice získajú bez potreby dodatočných inštalácií. Tu ale podpora týchto knižníc nekončí. Rails tiež obsahuje zabudované pomocné metódy (helpers) ktoré zjednodušujú prácu s týmito knižnicami. Mnoho Rails formulárov a pomocných metód Ajaxu používa vo svojich implementáciách práve Prototype.

Dôvodom, prečo využívať tieto dve knižnice JavaScriptu je, že každá z nich ponúka funkcionalitu na rozdielnej úrovni. Knižnica Prototype ponúka funkcionalitu na nižšej úrovni, ako napíklad rozšírenia jazyka JavaScript, obsluha udalostí a formulárov a Ajaxová podpora. Script.aculo.us ponúka funkcionalitu na vyššej úrovni ktorá je zameraná skôr na vývojárov, ktorí chcú vytvoriť pestré, bohaté aplikácie.

Prototype a script.aculo.us na Rails

V priečinku aplikácie public/javascripts je možné nájsť súbory knižníc Prototype a script.aculo.us: prototype.js, scriptaculous.js, builder.js, effects.js, dragdrop.js, slider.js, controls.js.

Jedine súbor prototype.js je súborom knižnice Prototype. Zvyšok súborov patrí knižnici script.aculo.us. Po vložení týchto súborov do Rails aplikácie použitím nasledovného riadku kódu v sekcii hlavičky HTML základnej schémy sa tieto knižnice automaticky stanú dostupnými vo všetkých súboroch šablón:

<%= javascript_include_tag :defaults %>

Vložením parametra :defaults do javascript_include_tag oznamujeme Rails, aby zahrnul do základnej grafickej schémy štandardnú sadu JavaScript knižníc (menované vyššie).

Rails ponúka mnoho pomocných metód (helperov) pre metódy a triedy knižníc Prototype a script.aculo.us. Tieto helpery generujú JavaScript, ktorý používa Prototype a script.sculo.us v mnohých prípadoch, čím sa ich sila využije aj bez toho, aby sa tieto knižnice používali priamo.

Pototype a Rails

S príchodom web 2.0 aplikácií, s ich pestrejším a interaktívnejšími rysmi je nevyhnutnosťou použitie JavaScriptu a implementácia komplexnejšieho správania s týmto nárastom. Našťastie niektorí developeri pochopili potrebu knižníc, ktoré by im pomáhali písať lepší a silnejší JavaScript, takže je tu množstvo knižníc pomáhajúcich na pozadí(back end), rovnako aj v popredí(front end).

Napriek vysokej funkcionalite je Prototype relatívne malý vo svojej fyzickej veľkosti. Celá knižnica je obsiahnutá s jednom JavaScript súbore prototype.js.

Prototype bol inšpirovaný Ruby, preto sa častokrát správa podobne a mnohé dodatky a rozšírenia, ktoré vytvára Prototype pre JavaScript majú syntax jazyka Ruby, čo značne uľahčuje prácu Ruby programátorom.

Prototype je teda knižnicou navrhnutou na uľahčenie práce pri písaní JavaScriptu. Prototype ponúka funkcie v nasledovných oblastiach:

• rozšírenie JavaScriptu
• DOM manipulácia
• správa udalostí
• formuláre
• Ajax

Treba si však uvedomiť že Prototype neposkytuje widgets (pomôcky), drag and drop a ostatné komponenty pestrého rozhrania. Miesto toho poskytuje vrstvu medzi bohatými pomocnými programami UI JavaScript a základným JavaSriptom. Mnohé JavaScript knižnice vyššej úrovne, vrátane script.aculo.us, používajú Prototype.

Rozšírenia JavaScriptu

Prototype zahŕňa funkcie, ktoré zásade rozširujú JavaScript. Jedným zo spôsobov je zvýšenie OOP podpory JavaScriptu. Prototype uľahčuje tvorbu tried a rozširuje triedy prostredníctvom dedičnosti. OOP vo svojom pôvodnom JavaScript použití používa pomerne odlišné formy oproti ostatným OOP jazykom, aj preto sa mu mnoho developerov vyhýba.

Zjednodušenie JavaScriptu pomocou znaku $

Prototype obsahuje sadu užitočných funkcií, ktoré ponúkajú skratky pre niektoré veľmi užitočné metódy používané veľmi často. Tieto metódy majú krátke názvy začínajúce znakom dolár ($). Najčastejšie používanou metódou je metóda $. Ostatné metódy sa skladajú z $ nasledovaného jedným pridaným znakom. Tabuľka 2.2.1 popisuje tieto metódy.

Tabuľka 2.2.1: Metódy $ knižnice Prototype

Názov metódy	Popis	Príklad použitia
$	Označuje element, ekvivalent k getElementById. Vracia elementy s DOM rozšíreniami	$('sidebar')
$$	Označuje všetky elementy, ktoré obsahujú ID vložené do použitého CSS3 selektora, v poradí v akom existujú v dokumente.	$$('content_section')
$A	Konvertuje kompatibilné objekty do poľa	$A(arguments)
$w	Rozdeľuje reťazec na pole slov	$w('jeden dva tri')
$F	Vyberá aktuálnu hodnotu formulárového poľa označeného podľa ID	$F('phone_number')
$H	Skratka pre vytvorenie nového hashu	psc = $H
$R	Vytvára rozsah	$R (1,10)

Označenie elementov znakom $

Metóda $ je v Prototype najčastejšie používanou metódou zo všetkých. Táto metóda nahrádza štandardnú metódu dokument.getElementById(id). Použitie metódy je nasledovné:

content_element = $('content')

Okrem toho, že sa jedná o kratší typ metódy, veľkou výhodou je hlavne to, že metóda $ vracia element DOM, ktorý má zabudované rozšírenia Prototype. To znamená, že navrátený element má prístup ku všetkým prídavným metódam, ktoré Prototype pridáva elementom. Tieto rozšírenie zahŕňa niekoľko tuctov metód, ktoré môžu byť volané akýmkoľvek elementom volaným metódou $. Tabuľka 2.2.2 vypisuje niektoré z najzaujímavejších metód.

Tabuľka 2.2.2: Metódy možne aplikovať na elementy volané metódou $

Metóda	Popis
element.addClassName(ccsClass)	pridá triedu CSS do elementu
element.ancestors()	vráti všetkých predkov v podobe poľa
element.descendents()	vrái všetkých potomkov v podobe poľa
element.empty	vráti true ak element obsaduje iba biele znaky
element.hide	skryje element
element.insert(content) element.insert({position: content})	vloží obsah v elemente na špecifikovanú pozíciu. Nastavenia pozície sú v helperi Rails RJS helper
element.remove()	Vymaže element z DOM
element.show()	ukáže element

Podpora JSON

JSON je známy hlavne pre tých, ktorí majú skúsenosti s bohatými prehliadačovými aplikáciami využívajúcimi Ajax. Jedná sa o JavaScript Object Notation (objektový zápis JavaScript). JSON je metóda representujúca objekty alebo text za použitia štandardnej syntaxe JavaScriptu. Použitím JSON je možné reprezentovať akúkoľvek objektovú štruktúru vrátane objektov, reťazcov, polí alebo iných typov ako jednoduchý reťazec. Toto je užitočné pri prechode štruktúrovaných dát a objektov cez rozhranie, napríklad v prípade volania Ajax. Použitie JSON narastá a nahrádza XML ako preferovaný formát pre posielanie a príjem komplexných dát pri použití Ajaxu.

Prototype ponúka nasledovné metódy pre kódovanie JavaScriptu použitím JSON-u:

• Object.toJSON(obj)
• array.toJSON()
• date.toJSON()
• hash.toJSON()
• number.toJSON()
• string.toJSON()

Prvá metóda, Object.toJSON(obj) je statická metóda, ktorá konvertuje akýkoľvek vložený objekt do formáu JSON. Ostatné toJSON metódy sú metódami inštancií, ktoré sú poskytnuté špecifickým objektovým typom: pole(Array), dátum(Date), hash(Hash), číslo(Number) a reťazec(String). Keď máme kódovaný JSON reťazec, Prototype ponúka spôsob dekódovať ho späť do pôvodnej štruktúry JavaScript použitím metódy:

• jsonString.evalJSON([sanitize = false])

Metóda evalJSON vracia objekt JavaScript. Metóda požaduje jeden parameter s názvom sanitize. Tento parameter určuje mieru ochrany JavaScriptu. Nastavením tejto hodnoty na true sa metóda uistí, že JSON reťazec obsahuje iba JavaScript, ktorý nalseduje akceptovateľnú syntax. Príklad konverzie poľa v jazyku JavaScript do JSON a späť:

var book = {title: ‘Ruby on Rails Bible’,

publisher: ‘Wiley’,

keywords: [‘ruby’, ‘rails’, ‘programming’],

pubDate: new Date(2008, 5,12)};

json_val = Object.toJSON(book);

// json_val =

// ‘{“title”:”Ruby on Rails Bible”, “publisher”,”Wiley”,

// “keywords”:[“ruby”,”rails”,”programming”],”pubDate”:”2008-05-

12T00:00”}’

V tomto príklade obsahuje objekt kniha dve znakové hodnoty, atribút poľa a atribút dátumu. Každý jeden z nich je konvertovaný na JSON a reprezentovaný reťazcom json_val. Tento reťazec je vrátený ako jednoriadkový reťazec (v tomto príklade je zobrazený na viacerých riadkoch v dôsledku čitateľnosi).

Správa udalostí v Prototype

Prototype poskytuje jednoduchý spôsob prepojenia funkcie s užívateľovou udalosťou. Metóda sa nazýva Event.observe, ktorá používa 3 argumenty. Prvým je DOM element, respektíve reťazec ID elementu DOM. To je element, ktorý bude plnený. Druhým argumentom je meno udalosti. Posledným je funkcia, ktorá sa má zavolať, keď sa naplní udalosť. Toto môže byť preddefinovaná funkcia, alebo anonymná funkcia definovaná vnútri kódu. Príklad:

Event.observe(‘class_name_menu’, “change”,

function() {alert(“the name changed”);};

Ajax

Ako už bolo spomenuté Ajax je technológiou, ktorá umožňuje posielať požiadavky webovému serveru a získavať odpoveď bez spusnetia mechanizmu obnovy celej webovej stránky. Jednou z webových aplikácií, ktoré zvýšili popularitu Ajaxu je aplikácia Google Maps. Google Maps dovoľuje užívateľovi posúvať sa na mape a kontinuálne prijímať obnovené dáta mapy bez akéhokoľvek obnovovania celej stránky. Iným bežným využitím Ajaxu je automatické dopĺňanie zadávaných reťazcov, kde sa pri zadávaní kľučového slova automaticky zobrazujú nájdené zhody pre dané slovo (reťazec).

Implementácia Ajaxu iba za pomoci JavaScriptu môže byť pomerne komplikovaná. Použitie Ajaxu značne uľahčuje Prototype, podpora Ajaxu je jednou z jeho najčastejšie využívanou vlastnosťou. Pri použití Prototype a Rails spoločne sa stáva písanie Ajaxových volaní ešte jednoduchšie. Rails obsahuje množstvo pomocných metód, ktoré generujú volania typu Prototype JavaScript – tieto sú nevyhnutné pre komunikáciu so serverom prostredníctvom Ajaxu.

Odkazy AJAX – AJAX links

S helperom Rails nie je vytvorenie adresy vykonávajúcej Ajax omnoho zložitejšie, ako vytvorenie klasického odkazu. Jednoduchý príklad:

<%= link_to_remote “Get Current Date and Time”,

update => ‘time_and_date’,

url => { :action => ‘get_date_time’ } %>

<div id=”time_and_date”></div>

Tento príklad vytvára odkaz v podobe "Get Current Date and Time", ktorý posiela volanie Ajax metóde serveru pomenovanej get_date_time. Obnovovaná je časť stránky – DIV s názvom time_and_date. Argument :update je voliteľný, ak sa v kóde nenachádza, predpokladom je, že volanie serveru spúšťa RJS stránku, ktorá obstará viac ako samotné obnovenie DOM elementu.

Možnosti AJAX odkazov

Silné a užitočnejšie odkazy Ajax môžeme vytvoriť použítím viacerých nastavení, ktoré sú dostupné k pomocnej metóde link_to_remote. Tieto možné nastavenia sú nasledovné (avšak niektoré z nich môžu byť vykonané elegantnejšie pomocou skriptu RJS):

• :condition – Výraz typu JavaScript, zhodnocujúci, či užívateľ vyvolal požiadavku. Musí vracať hodnotu true, inak je požiadavka zrušená.
• :before, :after – Tieto nastavenia povoľujú špecifikovať funkciu alebo funkciu JavaScriptu, ktorá je volaná pred alebo po výskyte volania Ajax.
• :success, :failure – Nastavenia umožňujú špecifikovať funkciu JavaScriptu, ktorá je volaná po metóde Ajax, vracia informáciu o úspechu alebo neúspechu volania. To dovoľuje jednoducho spravovať chyby Ajaxových volaní..
• :complete – Výraz JavaScriptu, zhodnocujúci, či je požiadavka Ajax dokončená, či už úspešne alebo neúspešne.
• :loading – Akcia je volaná, pokým požiadavka prebieha, používa sa bežne ako zaneprázdnený kurzor alebo takzvaný "progress bar".
• :laoded – Akcia je volaná po tom, čo bol obsah načítaný.
• :interactive – Volanie nastáva, ak chce užívateľ pracovať so vzdialeným súborom, pokiaľ sa načítava.
• :confirm – Hodnotu je reťazec použitý ako výstražná správa, ktorú musí užívateľ potvrdiť predtým, ako sa vykoná požiadavka Ajax.
• :submit – rodič elemetov form (formulár) sa odošle v prípade, že je formulár odoslaný a ak rodič nie je vybraný formulár.
• :with – výraz JavaScriptu, ktorý vracia reťazec vhodný na pripojenie na koniec reťazca URL požiadavky.

Script.aculo.us a Rails

Script.aculo.us je knižnica vytvorená pre úzku spoluprácu s knižnicou Prototype. Jej syntax a použitie je veľmi podobné Prototype a rovnako ako v Prototype je tu viditeľný vplyv Ruby. Script.aculo.us rozvíja funkcionalitu knižnice Prototype poskytovaním funkcií v nasledovných kategóriách:

• framework animácií (Animation framework)
• Drag and Drop
• riadiace prvky Ajaxu
• DOM utility
• testovanie jednotiek

Zatiaľ čo Prototype poskytuje fnkcionalitu na nižšej úrovni, ktorá rozširuje JavaScript a tým ho robí jednodušším a menej náročným na údržbu, script.aculo.us poskytuje funkcionalitu oveľa bližšiu UI vrstve, povoľuje vytvorenie zaujímavého a dynamického rozhrania elementov pre webové aplikácie.

Vizuálne efekty

Vizuálne efekty ponúkané knižnicou scritpt.aculo.us sú pravdepodobne najpoužívanejšou časťou knižnice. Umožňujú pripojenie pohyblivých alebo animovaných efektov k udalostiam JavaScript. Tieto efekty môžu byť použité na pridanie vizuálnych výziev do aplikácií a vytvorenie rozhraní, ktoré boli kedysi možno vidieť iba v bohatších Flash aplikáciách.

Rails poskytuje pomocné metódy a RJS metódy na pomoc pri vytváraní vizuálnych efektov pre DOM elementy webovej stránky. Krátky príklad vytvoríme, keď v priečinku app/views-books predošlej Rails aplikácie vytvoríme nový priečinok effects.erb.html, do ktorého vložíme nasledujúci kód:

<div id=”red_box”>Effects</div>

<%= link_to_function “Fade”, visual_effect(:fade, :red_box) %>

Je potrebné ešte pridať nasledovný štýl do štýlu aplikácie, ktorý sa nachádza v súbore public/stylesheets/style.css:

#red_box {

width: 150px;

height: 150px;

background-color: red;

color: white;

}

Aplikáciu si môžeme pozrieť spustením stránky http://localhost:3000/home/effects. V prípade správneho zobrazenia vidno na stránke červený rám a odkaz s názvom Fade. Pri kliknutí na link Fade rám pomaly vymizne. Po tom, čo úplne zmizne, je odstránený a odkaz Fade sa presunie na miesto, kde bol predtým červený rám.

Efekty scipt.aculo.us

Vytratenie je iba jednou z mnohých efektov, ktoré je možné vykonať pomocou script.aculo.us. Každý z týchto efektov si popíšeme. Niektoré efekty sú popisované v páre, pretože poskytujú opačné efekty:

• Fade, Appear – postupne narastá alebo klesá priesvitnosť elementu, až kým element nebude úplne viditeľný alebo neviditeľný. Ak sa element stáva neviditeľným, jeho zneviditeľnenie spôsobí u iných elementov stránky presun na miesto vymizntého elementu
• BlindUp, BlindDown – postupne sa mení výška elementu, obsah elementu ostáva fixný
• SlideUp, SlideDown – postupne sa mení výška elementu, kde sa obsah posúva hore a dole podľa výšky elementu
• Shrink, Grow – Mení rozmery elementu od stredového bodu
• Highlight – Dočasne mení farbu pozadia elementu na špecifickú farbu, alebo strieda žltú a východiskovú farbu
• Shake – Spôsobí, že element sa zatrasie dozadu a dopredu niekoľko krát za sebou
• Pulsate – daný element niekoľkokrát rýchlo zmizne a objaví sa
• Dropout – Vymiznutie elementu a súčasne sa posúva dole
• SwitchOff – Simuluje vypnutie starej televízie. Spôsobí blikot elementu, ktorý následne skolabuje vo vertikálnej línii
• Puff – element narastie na veľkosti zatiaľ čo narastá jeho priesvitnosť
• Squish – zmení veľkosť elementu zatiaľ čo udržuje pozíciu jeho ľavého horného rohu
• Fold – zredukuje výšku elementu na tenkú čiaru a následne zredukuje jeho šírku, až pokým element nevymizne

Záver

Cieľom tejto práce bolo v úvode charakterizovať pojem web 2.0, popísať jeho črty a detailnejšie popísať niektoré z prostriedkov, ktoré sú s týmto pojmom spojené. Snahou bolo zamerať sa hlavne na rozdiely medzi technológiou web 1.0 a web 2.0, i keď toto rozlíšenie nie je častokrát úplne jednoznačné, keďže všetky prostriedky, ktoré využíva web 1.0, sa objavujú aj pri web 2.0. Napriek tomu je zjavné, že technológie web 2.0 prinášajú nový, dynamický rozmer do internetového prostredia, kde sa z pasívnych návštevníkov stávajú častokrát prispievatelia do rôznych blogov a podobne. Internet tak už nie je len statickou stránkou, ale interaktívnym prostredím, ponúkajúcim množstvo aplikácií. Tieto sú vytvárané pomocou novodobých technológií, či už ide o štýl architektúry REST, alebo dynamickú technológiu Ajax. Obe tieto technológie sme popísali podrobješie v tejto práci v súvislosti s frameworkom Rails, ktorý umožňuje efektívne a jednoduché vytváranie novodobých aplikácií. To dokazuje aj fakt, že Rails obsahuje zabudované množstvo pomocných funkcií pre Ajax, knižnice JavaScriptu či generátory, ktoré automaticky vytvárajú čitateľnú architektúru podľa vzoru REST. Pokračovaním práce bude použitie získaných poznatkov pri implemetnácii týchto technológií do aplikácie školského rozvrhu.

Použitá literatúra

1. Web 2.0 [online]. 23. 12. 2005 , 13.01.2010 [cit. 2010-01-13]. Dostupný z WWW: <http://cs.wikipedia.org/wiki/Web_2.0>.
2. SYMBIO Digital, s. r. o.. Web 2.0 [online]. [1999-2010] [cit. 2010-01-13]. Dostupný z WWW: <http://www.symbio.cz/slovnik/web-2-0.html>.
3. Šifra J., Fenomén Web 2.0, Stratégie 01.2007
4. Web 2.0 [online]. [2003-2009] [cit. 2010-01-13]. Dostupný z WWW: <http://suewebik.net/webove/web20-def.html>.
5. SYMBIO Digital, s. r. o.. Web 2.0 [online]. [1999-2010] [cit. 2010-01-13]. Dostupný z WWW: < http://www.symbio.cz/slovnik/mashup-web-application-hybrid.html >.
6. ZANDL, Patrick. Mashup aneb Míchanice pro Web 2.0 [online]. 21/05/2007 [cit. 2010-01-13]. Dostupný z WWW: <http://www.certodej.cz/view/mashup-aneb-m>.
7. KHUDHUR , Patrik. Nejžhavější technologie dneška: Ajax - úplně nový web [online]. 11.06.2007 [cit. 2010-01-13]. Dostupný z WWW: <http://computerworld.cz/vyvoj/nejzhavejsi-technologie-dneska-ajax-uplne-novy-web-2455>.
8. HOUSER , Pavel. Nejznámější aplikace Web 2.0 [online]. 10.09.2008 [cit. 2010-01-13]. Dostupný z WWW: <http://businessworld.cz/ostatni/nejznamejsi-aplikace-web-2-0-1677>.
9. Ruby, S., Dave, T., Agile web development with Rails, The pragmatic Bookshelf, ISBN-10: 1-934356-16-6, 2008
10. Fernandez, O.,: The Rails Way, 2007, Boston, ISBN 0-321-44561-9