To deliver optimal user experience, web applications should have simple navigation and browsing, automatic resolution adjustment to suit the user (whether on mobile devices or desktop computers), minimal loading times, SEO, etc. All of these must be considered when designing a web application today. The Java/JEE ecosystem provides a number of frameworks that can facilitate the development of web applications, but have difficulties fulfilling the above-mentioned conditions. On the other hand , more and more web developers advocate “Single page” applications and JavaScript frameworks which boost development. How to take advantage of existing services (EJB) and introduce them into the world of JavaScript programming (JSON)? Should all data access be organized through an API?
2. Agenda
1. NEOS
2. Moderne web aplikacije i JEE
3. Single page aplikacije (SPA)
20SLIDE
3. Single page aplikacije (SPA)
4. Zaključak
5. Q&A
5/6/20142 JavaScript single-page aplikacije i JEE2
3. Neos
› Osnovni podaci
• Osnovani 2002. godine
• 35 zaposlenih
• Specijalizirani za DW/BI sustave i Java/Oracle razvoj
› Kompetencije
20SLIDE 5/6/20143 JavaScript single-page aplikacije i JEE3
› Kompetencije
• Preko 10 godina iskustva
• Oracle Platinum Partner
• Certified experts (OCP, DW/BI, Java)
4. Reference
› Klijenti
• Srednje i velike tvrtke
• Lokalne i strane tvrtke
› Industrije / Područja
• Finacijska industrija
20SLIDE 5/6/20144 JavaScript single-page aplikacije i JEE
• Finacijska industrija
• Telekom industrija
• Elektrodistribucija / Energenti
• Distribucija, Veleprodaja, Maloprodaja
• Ostali
5. Moderne web aplikacije
› Fluidan i responzivan dizajn
› Brzo učitavanje i navigacija
› SEO, meta tagovi
20SLIDE
› SEO, meta tagovi
› User-friendly URL-ovi
› API management
Naša strategija razvoja
› Korištenje SPA aplikacija usporedno s JEE standardom
5/6/20145 JavaScript single-page aplikacije i JEE
6. JEE web aplikacije i SPA
› JEE web aplikacije (JSF)
1. Klijent šalje upit serveru
2. Server generira HTML
20SLIDE
2. Server generira HTML
› SPA lifecycle
1. Prvotno učitavanje stranice
2. AJAX request
3. Podaci se vraćaju u JSON format
5/6/20146 JavaScript single-page aplikacije i JEE
7. Izazovi za JSF web aplikacije
› Prilagodba stranice različitim uređajima
› Editiranje JSF komponenti
20SLIDE
› Editiranje JSF komponenti
› Generiranje HTML-a na serverskoj strani
› Pohrana view state-a na serverskoj strani
5/6/20147 JavaScript single-page aplikacije i JEE
8. Zahtjevi kod razvoja JSF aplikacija
› Editiranje CSS-a popularnih JSF component library-a
› Editiranje generiranog HTML-a
20SLIDE
› Editiranje generiranog HTML-a
› Precizna kontrola UI komponenata
5/6/20148 JavaScript single-page aplikacije i JEE
9. Servisni sloj – možemo li se prilagoditi?
› Iskoristivost postojećeg koda
› Injektiranje EJB-eva u web servise
20SLIDE
› Injektiranje EJB-eva u web servise
› Direktno izlaganje session beana kao web servis
› Dodatna pogodnost: API management
5/6/20149 JavaScript single-page aplikacije i JEE
13. JEE & Ember
› EJB
• Izložiti REST web servise kao EJB
20SLIDE 5/6/201413 JavaScript single-page aplikacije i JEE
› Handlebars
• HTML prati promjene modela
› Ember Data
• Komunikacija sa REST servisima
• Manipulacija dohvaćenog modela
14. Alati
› Ember App Kit
• Grunt
• Bower
20SLIDE 5/6/201414 JavaScript single-page aplikacije i JEE
› Ember Inspector
› Sublime
15. › Steep learning curve
› Neki dijelovi će biti zamjenjeni (handlebars) dok su neki
Zaključak
20SLIDE
› Neki dijelovi će biti zamjenjeni (handlebars) dok su neki
još u beti (ember data)
› Brži razvoj i brže ponašanje aplikacija
› Pripremljeni REST servisi mogu biti iskorišteni za nativne
aplikacije (iOS, Android)
5/6/201415 JavaScript single-page aplikacije i JEE