|
|
| Riadok 136: |
Riadok 136: |
| | ''Social news sites'' | | ''Social news sites'' |
| | | | |
| − | Spravodajské portály, ktoré nie sú vytvárané malou skupinou redaktorov, ale širokým spektrom používateľov, riadené sú demokratickým redakčným prístupom. Návštevníci posielajú články, ktoré ich oslovili a ostatní za pridané články hlasujú. | + | Spravodajské portály, ktoré nie sú vytvárané malou skupinou redaktorov, ale širokým spektrom používateľov, riadené sú demokratickým redakčným prístupom. Návštevníci posielajú články, ktoré ich oslovili a ostatní za pridané články hlasujú. |
| − | | |
| − | | |
| − | = 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''
| |
| − | | |
| − | | |
| − | {| class="prettytable"
| |
| − | | '''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''
| |
| − | | |
| − | | |
| − | {| class="prettytable"
| |
| − | | '''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:
| |
| − | | |
| − | | |
| − | <nowiki><%= javascript_include_tag :defaults %></nowiki>
| |
| − | | |
| − | | |
| − | 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''
| |
| − | | |
| − | | |
| − | {| class="prettytable"
| |
| − | | '''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 $''
| |
| − | | |
| − | | |
| − | {| class="prettytable"
| |
| − | | '''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:
| |
| − | | |
| − | * <nowiki>jsonString.evalJSON([sanitize = false])</nowiki>
| |
| − | | |
| − | 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’,
| |
| − | | |
| − | <nowiki>keywords: [‘ruby’, ‘rails’, ‘programming’],</nowiki>
| |
| − | | |
| − | pubDate: new Date(2008, 5,12)};
| |
| − | | |
| − | json_val = Object.toJSON(book);
| |
| − | | |
| − | | |
| − | // json_val =
| |
| − | | |
| − | // ‘{“title”:”Ruby on Rails Bible”, “publisher”,”Wiley”,
| |
| − | | |
| − | <nowiki>// “keywords”:[“ruby”,”rails”,”programming”],”pubDate”:”2008-05-</nowiki>
| |
| − | | |
| − | 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:
| |
| − | | |
| − | | |
| − | <nowiki><%= link_to_remote “Get Current Date and Time”,</nowiki>
| |
| − | | |
| − | :update => ‘time_and_date’,
| |
| − | | |
| − | :url => { :action => ‘get_date_time’ } %>
| |
| − | | |
| − | <nowiki><div id=”time_and_date”></div></nowiki>
| |
| − | | |
| − | | |
| − | 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:
| |
| − | | |
| − | | |
| − | <nowiki><div id=”red_box”>Effects</div></nowiki>
| |
| − | | |
| − | <nowiki><%= link_to_function “Fade”, visual_effect(:fade, :red_box) %></nowiki>
| |
| − | | |
| − | | |
| − | Je potrebné ešte pridať nasledovný štýl do štýlu aplikácie, ktorý sa nachádza v súbore public/stylesheets/style.css:
| |
| − | | |
| − | | |
| − | <nowiki>#red_box {</nowiki>
| |
| − | | |
| − | 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
| |
|
Trenčianska Univerzita Alexandra Dubčeka v Trenčíne
Fakulta mechatroniky
Katedra informatiky
|
|
|
|
|
|
| Autor:
|
Bc. Ivana Zuzinová
|
| Pedagogický vedúci:
|
Ing. Juraj Ďuďák
|
| Študijný odbor:
|
Mechatronika
|
| Akademický rok
|
2009/2010
|
| Abstrakt
po slovensky
|
| Abstract
po anglicky
|
Úvod
Od kedy vznikol internet, je táto téma takmer nevyčerpateľnou. Oficiálne vznikol síce už v roku 1964, avšak pozornosť širokej verejnosti si získal až v 90.rokoch 20.storočia. Počas 90-tych rokov, keď sa internet začínal masovo rozširovať a prístup k nemu získali milióny nových užívateľov, začalo sa na medzinárodnú počítačovú sieť nahliadať ako na alternatívne médium. Aj keď fungovalo v elektronickom prostredí, majitelia internetových domén pristupovali k ich správe v súlade s tradičnými mediálnymi konceptmi.
Internet ponúkal návštevníkom spočiatku iba jednosmernú komunikáciu, od portálu k užívateľovi. Spomedzi obmedzenej ponuky interaktívnych služieb sa stali populárnym predovšetkým e-mail, teda elektronická pošta. Hoci funguje na inej platforme ako klasický web, umožnil jednoducho a lacno komunikovať komukoľvek už v prvých rokoch existencie medzinárodnej siete. Onedlho sa začali rozmáhať aj internetové diskusné fóra a tzv. „chat“ - spočiatku však len v obmedzenej forme. Väčšiu interaktivitu priniesli až nové generácie služieb, nazvané tiež web 2.0.
Tieto služby sú charakteristické viacsmerným komunikačným tokom - t.j. aj od užívateľa k webovej doméne, medzi doménami navzájom, medzi zariadeniami a pod. Interaktivita sa stala kľúčovým pojmom, vďaka ktorému sa postupne stráca hranica medzi profesionálnymi a laickými tvorcami webového obsahu.
Cieľom tejto práce je oboznámiť čitateľa s problematikou web 2.0 technológií a následne popísať možnosti využitia týchto rysov v aplikáciách vytvorených frameworkom web 2.0 s názvom Ruby on Rails, ktorý je sám často označovaný ako jeden z fenoménov web 2.0. V skratke spomenieme filozofiu Rails, ktorá ho vopred predurčuje ako prostriedok pre tvorbu efektívnych dynamických web 2.0 aplikácií. Táto práca vychádza z predošlej bakalárskej práce s názvom "Pokročilé vlastnosti skriptovacích jazykov", v ktorej boli podrobnejšie opísané vlastnosti syntaxe jazyka Ruby a frameworku Ruby on Rails, preto sa od čitateľa predpokladá, že má aspoň základné informácie o danom prostredí.
V práci rozoberieme podporu web 2.0 technológií frameworkom Rails, ako sú napríklad Ajax alebo REST. Druhá, praktická časť bude venovaná najmä webovým službám a následnej implementácii vybraných web 2.0 technológií do aplikácie školského rozvrhu.
Fenomén Web 2.0
Wikipédia, stránka dávaná za príklad ukážky web 2.0, definuje tento pojem ako "ustálené označenie pre etapu vývoja webu, v ktorej bol pevný obsah webových stránok nahradený priestorom pre zdieľanie a spoločnú tvorbu obsahu". [1]
V podstate nie je vôbec jednoduché konkretizovať, čo presne výraz web 2.0 znamená, o čom svedčia mnohé diskusie o tomto pojme na internete. Cieľom kapitoly preto ani nie je presne identifikovať web 2.0, ale skôr charakterizovať jeho základné rysy a možnosti.
Slovné spojenie web 2.0 použil Tim O'Reily v roku 2004, kedy ním označil aktuálny a špecifický smer, vlnu, či novú generáciu webových služieb, stránok, komunít alebo aplikácií. Táto vznikajúca vlna prišla ako určitá reakcia po období útlmu a takzvaného "spľasknutia internetovej bubliny" po roku 2000. [2] O'Reily zverejnil následne v septembri 2005 rozsiahly článok s názvom "What is web 2.0", s podtitulom Návrhové vzory a obchodné modely pre novú generáciu softvéru. V ňom je web 2.0 charakterizovaný ako posun od centralizovaného spracovania (služieb) k decentralizácii. Ako príklady v článku uvádza dvojice takýchto webov – encyclopedia britannica a wikipedia, osobné stránky a blogy, ofoto a flickr a iné. [3] O rok neskôr, keď sa označeniu web 2.0 dostalo už veľmi veľkej pozornosti bez toho, aby existovala akákoľvek všeobecne uznávaná definícia tohto termínu, zverejnil O'Reily ďalší pokus o stručný popis web 2.0:
"Web 2.0 je revolúcia podnikania v počítačovom priemysle spôsobená presunom k chápaniu webu ako platformy a pokus porozumieť pravidlám vedúcim k úspechu na tejto novej platforme. Kľúčovým medzi týmito pravidlami je toto: tvorte aplikácie, ktoré budú vďaka sieťovému efektu s pribúdajúcim počtom užívateľov stále lepšie. (čo som inde nazval "zapriahnutím kolektívnej inteligencie".)"
Web 2.0 sú teda také webové prjekty, ktoré používajú technológie a princípy namierené čo najviac k užívateľom služieb, a to častokrát tak blízko, že nechávajú samotných užívateľov, aby sa sami podieľali na obsahu či tvorbe projektu. Najčastejšie sa medzi typické web 2.0 projekty zaraďujú rôzne komunitné servery, systémy pre zdieľanie, blogy, RSS agregároty a čítačky alebo slovníkové projekty (wikipédia). Veľmi rozšíreným je používanie takzvaného tagovania (značkovania) obsahu (folksonómia), ajaxové technológie a zdieľaných rozhraní s následnými takzvanými "mashup projektami". Ďalším typickým princípom vlny web 2.0 je presun desktopových aplikácií a nástrojov na web, do webového prehliadača. Objevuje sa tak celá rada aplikácií pre správu a tvorbu dokumentov typických napríklad pre aplikácie balíku Microsoft Office. Príkladom sú Google Docs, Zoho alebo ThinkFree.
O'Reily nikde nehovorí o tom, že web 2.0 má špecifický vzhľad a design, napriek tomu sa môžeme stretnúť s názorom, že web 2.0 projekty poznáme podľa ich vzhľadu, ktorý sa vyznačuje použitím pastelových farieb, zrkadlových efektov, veľkých nápisov a logovacích (prihlasovacích a odhlasovacích) políčok. Ale zďaleka nie všetky projekty web 2.0 takto vyzerajú, stačí spomenúť strohý vzhľad Wikipedie, del.icio.us alebo Flock.[2]
V tabuľke 1.1 môžeme vidieť porovnanie hlavných rozdielov medzi web 1.0 a web 2.0:
Tabuľka 1.1: Rozdiely medzi technológiami web 1.0 a web 2.0
|
|
WEB 1.0
|
WEB 2.0
|
| OBSAH
|
obsah webu je tvorený prevažne jeho vlastníkom
|
návštevníci sa aktívne podieľajú na tvorbe obsahu – vlastník je v úlohe moderátora
|
| INTERAKCIA
|
interakcie vytvárajú nároky na vlastníka, preto iba v nevyhnutnej miere
|
interakcia je vítaná, má formu diskusií, chatu, prepojení s messengermi, sociálnych profilov
|
| AKTUALIZÁCIA
|
zodpovedá možnostiam vlastníka
|
web je živý organizmus – tvorcov obsahu môžu byť milióny
|
| KOMUNITA
|
neexistuje, návštevník je pasívny príjemca informácií bez interakcií
|
návštevník je súčasne ten, "o kom sa píše", jednotlivec je súčasťou rozsiahlej komunity
|
| PERSONALIZÁCIA
|
weby neumožňujú implicitnú personalizáciu
|
umožňujú vytvárať a využívať sociálne profily čitateľov
|
Tieto zmeny z web 1.0 na web 2.0 sú prirodzeným dôsledkom vývoja nových webových technológií, ktoré charakterizujú samotný web 2.0. Technológie web 1.0 sú zároveň súčasťou technológiami web 2.0.
Technológie web 2.0
Medzi typické nástroje web 2.0 patria nasledovné:
Mashups
Mashup, v preklade mixáž, "zmiešanina" je známa v hudobnej terminológii ako kombinácia viac ako dvoch hudobných skladieb, prenesene sa ale tento názov ujal aj v terminológii internetovej. Mashup je internetová stránka alebo aplikácia, ktorá kombinuje obsah z viac ako jedného zdroja a dáva tak možnosť súčasného využitia rôznych typov informácií skombinovaných do jedného celku.[5] V prípade tvorby mashup-ov je ich hlavným hnacím motorom fakt, že väčšina web 2.0 služieb sa snaží ponúknuť svoje aplikačné rozhrania (API) k voľnému využitiu. A práve týmto sa stávajú mashup-y často veľmi silnými aplikáciami, ktoré sú pritom zostavené pomocou minima programovania a maximálneho využitia hotových API. Veľký vývojár spístupní svoj projekt cez API a malý vývojár tak môže využiť výhody rozsiahleho prjektu v rámci svojho malého projektu. Dostáva k dispozícii napríklad mapové poodklady Google Maps, aké by tento vývojár inak nebol schopný použiť.
Tak firma môže mať s využitím Google Maps API naprogramovanú aplikáciu, ktorá ukazuje, kde sa pohybujú jej vozidlá. Stačí, aby mali zabudované GPS, ktoré cez internetovú požiadavku spístupňuje polohu, a pár riadkov kódu, o väčšinu ostatného sa postará Google Maps. Existujú aj silnejšie aplikácie pre široké nasadenia, ktoré sú vyhodné pre všetkých účastníkov. Malí vývojári sa lacno (alebo zadarmo) dostávajú k obrovským, dôležitým a nákladovo náročným funkciám a zdrojom. Veľkí vývojári zas získavajú zdrarma reklamu a zvýšenie povedomia o svojich projektoch a naviac ich presadzujú ako "priemyslový štandard". A koncoví užívatelia profitujú tiež, pretože vznikajú rýchloslužby, ktoré boli ešte v minulosti nerealizovateľné, keďže boli pod rozlišovacou schopnosťou veľkých vývojárov a tí malí na nich nemali dostatočné zdroje.[6]
AJAX
V podobe technológie Ajax je k dispozícii súbor technológií, ktoré môžu byť využité pri implementácii interaktívnych webových aplikácií. Samotný pojem Ajax zodpovedá výrazu "Asynchronous JavaScript And XML", ide predovšetkým o spôsob konštruovania interaktívnych webových stránok. Ako býva často zdôrazňované, Ajax nepredstavuje nový jazyk, ale skôr nový prístup využívajúci niekoľko existujúcich štandardov a technológií, konkrétne predovšetkým JavaScript a XML.
Myšlienka Ajaxu spočíva v tom, že sú časti webovej stránky naťahované asynchrónne a týmto spôsobom sa mení obsah stránky. Znamená to, že pri zmene obsahu nebude znovu načítaná celá stránka,ale iba modifikovaný obsah. Za týmto účelom je z JavaScriptu volaný objekt XHTMLHttpRequest. Táto požiadavka (request) sa pýta na obsah, ktorý je typicky navrátený späť pomocou XML a JavaScriptu. Skript potom toto XML analyzuje. Dáta z XML skript potom prekladá a zodpovedajúcim spôsobom mení pomocou DOM (Document Object Model) webstránku.[7]
SEO
Search engine optimization, optimalizácia webových stránok pre vyhľadávače. Je to súbor nástrojov v oblasti programovania a dizajnu, ktoré napríklad firemnej stránke či internetovému obchodu pomôžu dostať sa vo výsledkoch vyhľadávania vo vyhľadávacích strojoch (Google) na čo najvyššie miesto.
SEM
Search engine marketing. Tu spadá aj vyššie spomínané SEO, okrem toho je však obľúbeným a čoraz používanejším nástrojom marketingu vo vyhľadávačoch aj PPC (pay-per-click) reklama. Princípom PPC je, že sa vo vyhľávači okrem „organických“, prirodzených výsledkov zobrazia na výraznom mieste, zväčša ako prvé, aj odkazy platené. Najväčšími svetovými hráčmi sú na tomto poli Google a Yahoo!, na Slovensku E-target a Google (napr. Google AdWords, E-target cielená reklama).
RSS čítačky
Really Simple Syndication.
Kedysi tvorilo obsah málo ľudí pre veľké množstvo čitateľov. V dnešnej dobe tvorí obsah veľké množstvo ľudí a na webe je toľko informácií že nemáme čas prechádzať všetky zdroje. Informácie sú uložené v malých jednotkách (stránkach a už nie na portáloch) a je potrebný softvér, ktorý ich bude agregovať tak, aby boli využiteľné. RSS, tagy, XML umožnia zdieľať a odovzdávať obsah. RSS umožňuje čítať obsah webu bez toho, aby ho priamo navštívili. O obsahu sa užívateľ dozvie pomocou odkazu, RSS – agregátora správ či zaujímavostí internetu. Agregátory obsahu môžu zaznamenávať, čo sa najčastejšie vyhľadáva a následne tieto informácie ponúknuť pre jednoduchšiu orientáciu.
RSS umožňuje webom, aby jednoduchým spôsobom oznámili užívateľovi akékoľvek novinky a aktualizácie. Užívateľ sa cez svoju RSS čítačku prihlási k odberu kanálov rôznych stránok či portálov, a správy z jeho obľúbených 50 či 100 internetových stránok sa mu prehľadne zobrazujú na jednej osobnej webstránke. Obľúbenosť RSS stúpa aj s rastom blogov, kedy už nie je efektívne denno-denne vypisovať URL adresy stránok pri pátraní po novinkách na množstve blogov a portálov, ale je ekonomickejšie nechať si automaticky zobrazovať novinky z rôznych stránok na jednom mieste. [3]
Tagy – značky
Tagy (štítky, značky) sú jednoduché slová, ktorými môžu užívatelia popisovať určitý webový obsah. Preslávili sa predovšetkým na weboch Del.icio.us a Flickr. Na Flickr si napríklad užívatelia môžu uložiť svoje fotografie a každú z nich označiť tagmi, napríklad Egypt, more, pláž. Fotky sú následne sprístupnené ostatným užívateľom, ktorí si môžu prezerať napríklad všetky fotky s tagom pláž (kde sú všetky fotky egyptskej pláže, ale aj fotky pláže z Tunisu z minulého roku...). Tagy sú zaujímavé v tom, že umožňujú z množstva obsahu vybrať tú časť, ktorú potrebujeme – umožňujú dívať sa na jedny dáta z rôznych pohľadov. Tie značky, ktoré vyhľadáva najviac užívateľov, sú potom na prvom mieste popularity a v zozname tagov, ktorý je organizovaný ako takzvaný "tag cloud" (mrak), sú najväčším písmom.
Výhody sú v tom, že popularita a viditeľnosť dokumentu v navigácii (cloud-e) je daná správaním návštevníkov – čím je dokument obľúbenejší, tým viac vyniká. Webmaster sa nemusí zaoberať navigáciou, tvorí sa automaticky. Pritom je možné dostať sa priamo na článok (či fotografiu v prípade Flickr.com), ktoré by v klasickom spôsobe zatriedenia (navigácie) mohli byť niekde na spodnej úrovni. Tieto výhody sú zároveň aj nevýhodami. Tie populárne dokumenty sa stávajú ešte zaujímavejšími a naopak tie, ktoré nie sú tak navštevované, z mraku úplne vymiznú a sú ťažšie vyhľadateľné.
[[Image:]]
Obrázok č. 1.1.1: "Tag cloud" na Flickr.com
Sociálne siete (Social network)
Jedná sa o skupinu užívateľov, ktorí majú podobné záujmy. Sieť vzniká opäť na komunitných weboch, najjednoduchší je asi flickr.com, čo je web, kam môže užívateľ nahrať svoje fotografie a zdieľať ich s ostatnými. Fotografiám sa opäť prideľujú tagy, aby bolo jasné, kam patria. Návštevníci môžu prehliadať albumy ostatných užívateľov, zaradiť ich medzi svoje kontakty do zoznamu (priateľov, rodiny) a podľa toho môžu obmedzovať aj práva prístupu k svojim fotografiám (napríklad len pre rodinu).
Blogy
Weblogy, internetové denníky. Svoju cestu si začali raziť už skôr, rok 2006 však zaznamenal ich neuveriteľný rozmach. V súčasnosti je možné nájsť blog takmer z akejkoľvek oblasti – od blogov pre akvaristov až po kognitívnych vedcov. Z hľadiska marketingu a PR komunikácie prinášajú veľkú výzvu hneď dvakrát. Blogeri (alebo občianski, civilní žurnalisti, ako ich niektorí PR profesionáli zvyknú volať) sú často strážnymi psami korporácií a rovnako dobre dokážu firme vylepšiť imidž, ako ju dostať do nepríjemností. Prvou výzvou pre spoločnosti je teda monitoring blogov a udržiavanie si dobrých vzťahov s blogosférou. Po druhé, predstavitelia firiem môžu sami písať korporátne blogy, čo sa vo svete osvedčilo napríklad firmám ako HP alebo Google. Z prieskumu, ktorý celosvetovo zorganizovala agentúra Porter Novelli vyplýva, že až 75 % korporátnych blogov naplnilo očakávania firiem.
Podcasting
Slovo vzniklo spojením slov broadcasting a iPod. Ako uvádza slovenská Wikipédia, „podcasting má potenciál prekonať staré médium, broadcastované rádio, kde čakáme na to, čo by nás mohlo zaujímať, novým spôsobom prehrávania, kde si my vyberieme, čo chceme počúvať a kedy to chceme počúvať.“ Podcast si jednoducho môžu vytvoriť jednotlivci a „zavesiť“ ho na svoju stránku, kde je voľne prístupný na stiahnutie. S rastom penetrácie broadbandového internetového pripojenia sú však podcasty ako médium čoraz zaujímavejšie aj pre firmy. Možnosť vytvoriť si svoj vlastný podcastingový kanál využíva v súčasnosti množstvo spoločností, od malých internetových start-upov až po korporácie typu IBM. Korporátne podcasty v Európe nezažili ešte takú silnú vlnu záujmu ako korporátne blogy, sú však na najlepšej ceste.
Video sharing, videopodcasting
S nástupom YouTube a ďalších podobných portálov sa otvoril nový priestor aj pre marketing. Nielen ako ďalšieho kanála, kde možno zavesiť banner, ale aj ako výborný priestor pre šírenie virálnych kampaní, videorecenzií a videoprezentácií produktov alebo prednášok. aj pre slovenské firmy sa nedávno otvorila lokálna možnosť – slovenský klon YouTube, portál Čekni to.
Social news sites
Spravodajské portály, ktoré nie sú vytvárané malou skupinou redaktorov, ale širokým spektrom používateľov, riadené sú demokratickým redakčným prístupom. Návštevníci posielajú články, ktoré ich oslovili a ostatní za pridané články hlasujú.
