0
Web 2.0 o 1.0?




               Ugo Landini & Luigi Fugaro, Jug Roma
                                   U. Landini & L. ...
2.5 tiers

  • Agenda
        • What’s hot
        • Un po’ di storia
        • 2.5 tier
        • REST con RESTEasy
     ...
C’è chi fa cose del genere oggi...




                                U. Landini & L. Fugaro - ugol@computer.org - JUG Ro...
280slides, come hanno fatto?

        • Replica dell’intero stack Cocoa di Apple nel
            browser (Cappuccino)
    ...
280slides, come?




                         Un po’ di storia



                                  U. Landini & L. Fugaro...
Evoluzione

       Dal Paleolitico al Neolitico, passando per il Mesolitico




                                      U. L...
Paleolitico

  • Applicazioni Client server
        • Two tiers
        • Fat Client (Visual Basic, Delphi, ecc.)
  • Quer...
Mesolitico

  • Entra in scena il Web, che di fatto uccide il Client/
       Server
  • Thin client e non più Fat client
 ...
Patterns

  • Perchè utilizziamo MVC server side?
        • Per motivi storici
        • Javascript era un incubo, ed i br...
Mesolitico




                         U. Landini & L. Fugaro - ugol@computer.org - JUG Roma
                            ...
Neolitico

  • Ajax ha reso possibile oggi dei Rich Client, e
       dunque un ritorno ad un 3-tier
  • Per i Rich Client ...
Stateless vs Stateful

  • Stateless è considerato da sempre il miglior modo
       per scalare
  • Le tecnologie che crea...
Neolitico




                         U. Landini & L. Fugaro - ugol@computer.org - JUG Roma
                             ...
Neolitico

  • Nel Neolitico è decisamente possibile fare rich
       client solo con il browser
        • Javascript (con...
Come si realizza un 2.5 tier

  • JQuery
        • Libreria Javascript per consumare servizi REST e creare
            com...
REST




                         REST in a Nutshell



                                   U. Landini & L. Fugaro - ugol@c...
REST Architecture in una slide

      • Dissertazione PHD di Roy Fielding (coautore di
          HTTP), 2000
      • REpre...
REST Architecture in una slide

        • HTTP a pieno potenziale
        • PUT, POST, GET, DELETE (l’equivalente di un CR...
REST verbs


    Method               URI                                    RPC
     GET        http://my.com/users/ugol ...
PUT vs POST
                                               PUT
                               PUT
                        ...
Safety & Idempotenza
           • Safety
           4x1x1x1=4x1=4


           • Idempotenza
           4x0=4x0x0x0
      ...
Safety & Idempotenza


                         GET   PUT            DELETE                 POST



                SAFE  ...
Safety & Idempotenza


           • Una applicazione che sia buon cittadino del Web
               deve rispettare il prot...
Safety & Idempotenza, perchè?

         • Google accelerator
         • client side caching tool, rilasciato nel 2005
    ...
REST in Java

  • JAX-RS (JSR 311): The Java API for RESTful Web
       services
        • E’ uno standard, Jersey è la re...
JQuery




                         JQuery



                             U. Landini & L. Fugaro - ugol@computer.org - JU...
JSON
           • JAvaScript Object Notation           {

           • serializzazione di un                     "firstName...
JQuery

  • JQuery
        • JQuery è divenuta negli ultimi anni la libreria dominante
            nel panorama javascript...
Unobtrusive Javascript

  • Unobtrusive Javascript
        • I CSS permettono di separare la presentazione dalla
         ...
JQuery Simple Example




                         U. Landini & L. Fugaro - ugol@computer.org - JUG Roma
                 ...
JTemplates

  • JTemplates è una libreria di Templating client side
  • Sfrutta JQuery
  • Semplice e leggera (circa 12Kb)...
Esempio JTemplates




                         U. Landini & L. Fugaro - ugol@computer.org - JUG Roma
                    ...
Esempio JTemplates




                         U. Landini & L. Fugaro - ugol@computer.org - JUG Roma
                    ...
JQuery e 2.5 tier

  • L’idea di base dell’architettura 2.5 tier è quella di
       utilizzare Javascript e JQuery per far...
Reverse Ajax

  • L’architettura 2.5 tier è Comet-compliant
        • se si vuole un full MVC, con notifiche dirette verso ...
Enterprise




                         2.5 tier &
                         Enterprise


                              U. ...
Scalabilità

  • 2.5 tier scala all’infinito
        • Le URI sono inerentemente scalabili. Il Web è
            inerenteme...
Caching / Pipelining

  • Con 2.5 tier possiamo cachare fino all’inverosimile
        • cache delle query verso il DB
     ...
Security

  • Con 2.5 tier la sicurezza è semplificata
  • Due possibili approcci
        • usare un IDM (IDentity Manager)...
Server side agnostic!

  • Una GUI interamente JS e che consuma JSON è
       indipendente dalla tecnologia server side!
 ...
2.5 tier




                         Conclusioni



                               U. Landini & L. Fugaro - ugol@computer...
Conclusioni

  • Oggi è possibile utilizzare un’architettura full REST
       in un’azienda enterprise
        • Oggi è po...
2.5 tiers, Rest In Peace


                           MVC Server Side,
                            REST In Peace

        ...
Upcoming SlideShare
Loading in...5
×

2.5 Tiers

2,177

Published on

2.5 tiers is the name of this simple and powerful architecture, based on jquery and RESTful services. In this talk we'll learn how to apply 2.5 tiers in our projects

Published in: Technology

Transcript of "2.5 Tiers"

  1. 1. Web 2.0 o 1.0? Ugo Landini & Luigi Fugaro, Jug Roma U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  2. 2. 2.5 tiers • Agenda • What’s hot • Un po’ di storia • 2.5 tier • REST con RESTEasy • Rich client con JQuery • Conclusioni U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  3. 3. C’è chi fa cose del genere oggi... U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  4. 4. 280slides, come hanno fatto? • Replica dell’intero stack Cocoa di Apple nel browser (Cappuccino) • Creazione di un nuovo linguaggio, a partire da Javascript: Objective J • Creazione di un equivalente dell’Interface Builder di Apple • Binding evoluti, eventi, ecc. • IDE completamente browser based (Atlas) • Non vogliamo arrivare a tanto, ma ... U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  5. 5. 280slides, come? Un po’ di storia U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  6. 6. Evoluzione Dal Paleolitico al Neolitico, passando per il Mesolitico U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  7. 7. Paleolitico • Applicazioni Client server • Two tiers • Fat Client (Visual Basic, Delphi, ecc.) • Query dirette sul DB • Manutenibilità complessa • Performance elevate U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  8. 8. Mesolitico • Entra in scena il Web, che di fatto uccide il Client/ Server • Thin client e non più Fat client • Three tiers (o più precisamente, n-tiers) • Separazione logica ed anche fisica • Anni di gloria degli Application Server • Problemi di scalabilità impliciti • difficoltà ad essere stateless U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  9. 9. Patterns • Perchè utilizziamo MVC server side? • Per motivi storici • Javascript era un incubo, ed i browser avevano problemi anche con dell’html semplice • Ormai è questione di abitudine • Ci sembra normale che la GUI venga generata dal server • Non lo è U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  10. 10. Mesolitico U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  11. 11. Neolitico • Ajax ha reso possibile oggi dei Rich Client, e dunque un ritorno ad un 3-tier • Per i Rich Client ci sono però molte tecnologie a disposizione • Tecnologie come JavaFX, Flex, Silverlight, OpenLaszlo, ... • ma anche GWT, JSF, Wicket, ed altre librerie Java- oriented • ognuna con pro e contro diversi U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  12. 12. Stateless vs Stateful • Stateless è considerato da sempre il miglior modo per scalare • Le tecnologie che creano un mapping artificale fra client e server sono stateful per natura • Stateful: JSF, Wicket • no scalability, dimensionamento difficile • Stateless: Javascript diretto, generatori di Javascript (GWT) U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  13. 13. Neolitico U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  14. 14. Neolitico • Nel Neolitico è decisamente possibile fare rich client solo con il browser • Javascript (con JQuery) è la tecnologia abilitante • JSon il formato dati, Ajax il protocollo, REST l’architettura • HTML 5 a seguire, è completamente in linea con questa architettura U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  15. 15. Come si realizza un 2.5 tier • JQuery • Libreria Javascript per consumare servizi REST e creare componenti riusabili • si, funziona anche su IE6 :) • Esposizione dei dati come servizi tramite librerie REST • JAX-RS è lo standard • RestEasy è la migliore implementazione, ma ce ne sono altre U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  16. 16. REST REST in a Nutshell U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  17. 17. REST Architecture in una slide • Dissertazione PHD di Roy Fielding (coautore di HTTP), 2000 • REpresentational State Transfer • Ovvero, usare il Web così com’è per far collaborare le applicazioni: HTTP è molto più ricco di quanto si creda! • Soprattutto in antitesi a WS-* (SOAP, WSDL, UDDI, ecc.), anche se Roy Fielding presentò un concetto più ampio U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  18. 18. REST Architecture in una slide • HTTP a pieno potenziale • PUT, POST, GET, DELETE (l’equivalente di un CRUD) • ma anche OPTIONS, CONNECT, TRACE, HEAD • URI come identificativo di una risorsa (Addressability) • Uniform interface (ogni risorsa deve essere acceduta allo stesso modo) U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  19. 19. REST verbs Method URI RPC GET http://my.com/users/ugol getUser(“ugol”) POST http://my.com/users addUser() DELETE http://my.com/users/luigif removeUser(“luigif”) PUT http://my.com/users/ugol/39 updateUser(“ugol”,39) GET http://my.com/users listUsers() GET http://my.com/users/find/&q=”boh” findUser(“boh”) U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  20. 20. PUT vs POST PUT PUT (existing POST (new resource) resource) Crea un nuovo /weblogs NA NO EFFECT weblog Modifica Crea nuova Crea il blog /weblogs/myblog settaggi di entry nel myblog myblog weblog NA Posta un /weblogs/myblog/ (chi ti da la Edit entry 18 commento alla entries/18 URI?) entry 18 U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  21. 21. Safety & Idempotenza • Safety 4x1x1x1=4x1=4 • Idempotenza 4x0=4x0x0x0 ma 4 x 0 ≠ 4 U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  22. 22. Safety & Idempotenza GET PUT DELETE POST SAFE SI NO NO NO IDEMPOTENTE SI SI SI NO U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  23. 23. Safety & Idempotenza • Una applicazione che sia buon cittadino del Web deve rispettare il protocollo HTTP e la semantica dei suoi “verbi” METHOD URI GOOD DELETE http://my.com/user/ugol BAD GET http://my.com/users/ugol/delete U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  24. 24. Safety & Idempotenza, perchè? • Google accelerator • client side caching tool, rilasciato nel 2005 • prefetching dei link delle pagine visitate con un browser • assumeva che le GET fossero safe • NON funzionava con moltissimi siti! U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  25. 25. REST in Java • JAX-RS (JSR 311): The Java API for RESTful Web services • E’ uno standard, Jersey è la reference implementation • Facilissimo produrre XML o JSON • RESTEasy è una delle implementazioni migliori • Ne parleremo diffusamente nel prossimo talk! Non cambiate aula :) U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  26. 26. JQuery JQuery U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  27. 27. JSON • JAvaScript Object Notation { • serializzazione di un "firstName": "Luigi", "lastName": "Fugaro", oggetto javascript (ma anche "address": { "streetAddress": "via G.Belli", Java) "city": "Roma", "postalCode": “00100” • RFC 4627 }, • Formato semplice per "phoneNumbers": [ "346 1234567", scambiare oggetti: "330 8901234" alternativa light ad XML ] } (meno verbosa) U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  28. 28. JQuery • JQuery • JQuery è divenuta negli ultimi anni la libreria dominante nel panorama javascript • John Resig, l’autore di Jquery, è stato il pioniere dell’unobtrusive Javascript • oggi anche altre librerie vanno nella stessa direzione • è utilizzatissima per la semplicità con cui si ottengono ottimi effetti grafici cross browser • permette di separare struttura e comportamento U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  29. 29. Unobtrusive Javascript • Unobtrusive Javascript • I CSS permettono di separare la presentazione dalla struttura • Una libreria js unobtrusive separa anche il comportamento dalla struttura • Si “attacca” il comportamento alla struttura tramite dei selector (CSS compatibili) • Il comportamento è cross browser, ci pensa la libreria ad applicare workaround U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  30. 30. JQuery Simple Example U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  31. 31. JTemplates • JTemplates è una libreria di Templating client side • Sfrutta JQuery • Semplice e leggera (circa 12Kb) • Permette di scrivere “cascading templates” • Risolve il problema della componentizzazione delle interfacce HTML/JS • http://jtemplates.tpython.com/ U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  32. 32. Esempio JTemplates U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  33. 33. Esempio JTemplates U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  34. 34. JQuery e 2.5 tier • L’idea di base dell’architettura 2.5 tier è quella di utilizzare Javascript e JQuery per fare... tutto. • Tenendo “ferma” l’architettura REST, dunque solo servizi • Nessun codice lato server che non sia RESTEasy • ok le validazioni le abbiamo lasciate lato server :) • Tutto il resto è sul client • Solo pagine “statiche” • Componenti JQuery + templating Javascript (JTemplate) • What else? U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  35. 35. Reverse Ajax • L’architettura 2.5 tier è Comet-compliant • se si vuole un full MVC, con notifiche dirette verso le View, si può utilizzare una delle tecnologie Comet • Comet consiste nel tenere aperta una connessione verso il server per ricevere gli eventi • Termine coniato nel 2006 da Alex Russell (Server push, HTTP push, HTTP Streaming, Pushlets, Reverse Ajax) • diversi modi di realizzarlo, e diversi contro: attenzione ai Firewall, alla Scalabilità, alla Server Affinity. U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  36. 36. Enterprise 2.5 tier & Enterprise U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  37. 37. Scalabilità • 2.5 tier scala all’infinito • Le URI sono inerentemente scalabili. Il Web è inerentemente scalabile. Dietro ad una URI può esserci un semplice Tomcat, ma anche un bilanciatore hardware. E dietro SOAP? • Se la GUI è solo sul client, i server possono essere stateless. E anche se le pagine diventano decisamente più pesanti, possono sfruttare la cache del browser • Attenzione a Comet, però. U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  38. 38. Caching / Pipelining • Con 2.5 tier possiamo cachare fino all’inverosimile • cache delle query verso il DB • cache di HTTP • Cache-Control in HTTP 1.1 • ci permette di NON trasferire verso il browser i risultati che sappiamo non essere cambiati • cache del browser di tutta la GUI (html e js) • pipelining (effettuare il fetch di più risultati del necessario e conservarli nel client) U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  39. 39. Security • Con 2.5 tier la sicurezza è semplificata • Due possibili approcci • usare un IDM (IDentity Manager) • essendo tutta l’applicazione basata su URI, il matrimonio con un IDM non presenta grossi problemi • necessario plugin per l’AS se si vuole colloquiare con l’IDM per migliorare la fruibilità e l’estetica dell’interfaccia • utilizzare la sicurezza standard JEE, annotando semplicemente i metodi esposti tramite REST U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  40. 40. Server side agnostic! • Una GUI interamente JS e che consuma JSON è indipendente dalla tecnologia server side! • Si possono scrivere componenti (datatable, calendari, ecc.) e riciclarli all’interno di un’azienda complessa con architetture miste e non monotecnologiche • Java, .Net, Scala, Erlang, PHP, C, C++, etc. • Si può dire che 2.5 tier faciliti il riuso all’interno di una Enterprise più di ogni altra soluzione ad oggi conosciuta U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  41. 41. 2.5 tier Conclusioni U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  42. 42. Conclusioni • Oggi è possibile utilizzare un’architettura full REST in un’azienda enterprise • Oggi è possibile utilizzare un MVC completamente client side, senza ricorrere ad “aiutini” • Le applicazioni saranno: • indipendenti dal client e dal server, riusabili (SOA), belle graficamente (ok, solo se avete un grafico bravo), performanti, e scalabili ai limiti estremi. • perciò non è solo possibile, ma anche consigliabile... U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  43. 43. 2.5 tiers, Rest In Peace MVC Server Side, REST In Peace Ugo Landini, Jug Roma Luigi Fugaro, Jug Roma U. Landini & L. Fugaro - ugol@computer.org - JUG Roma Javaday IV – Roma – 30 gennaio 2010 sabato 30 gennaio 2010
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×