1. INNOVATÍV MEGOLDÁSOK
Molnár Gábor, Nyári Zoltán - budapest.js meetup

2. AGENDA
 SMARTFRONT architektúra overview
javascript rich-client keretrendszer
 követelmények meghatározása
 komponensek bemutatása
 knock-out how-to
 implementált szolgáltatások

3. n-tier architecture
Többrétegű alkalmazás
 javascript rich-client
 RESTful interfész
 JavaEE, SPRING alkalmazás-szerver
 szerver technológia független
skálázható, klaszterezhető stateless szerver

5. Prezentációs réteg - Elvárások
KOMPLEX ÜZLETI ALKALMAZÁSOK FEJLESZTÉSE
b2b / b2c, front + backoffice igények
sok form, sok adat, sok felületi logika (+ sok más)
 data binding is a must (two-way binding)
 validációk, lokalizáció
 modularitás
 AppViewModel - single page, multi tab :)

6. opciók

7. Komponensek
 rich javascript kliens – felhasználói élmény
 responsive,css, html5, offline
 knockout.js – MVVM
 jquery – UI, AJAX
 require.js – modularitás
 less
 Tablet, smartphone (phonegap)

8. Modularizáció
 Asynchronous Module Definition
 gyakorlatilag nincs alternatívája
 Require.js
- probléma : API függőségek kezelése
 on-demand betöltés
 Modulok közötti kommunikáció
 szerver oldalra korlátozva
 UI
 modul - > tabok
 később - ablakkezelő?

9. Require.js - promise támogatás
promisify = (old_function) ->
return ->
callback = arguments[arguments.length - 1]
if callback instanceof Function
arguments[arguments.length - 1] = ->
promise = $.Deferred()
$.when.apply($, arguments).then ->
$.when(callback.apply(this, arguments)).then (module) ->
promise.resolve module
return promise;
return old_function.apply(this, arguments)
window.define = promisify window.define
window.require = promisify window.require

10. Felhasználói felület
 Modulok
 Tabok:formok, listanézetek
 Egységes
 stílus
 táblák
 grid rendszer
 jQuery (+jQuery modulok)
 HTML
 id-k,
name-ek használatának kerülése
 ha mégis kell: random ID-k generálása

11. Knock-out how-to #1
 Kétirányú adatkötés
 Nem magic
a fejlesztőknek pontosan tudniuk kell hogyan működik
 különben : nehezen felderíthető hibák
 Problémák
 beépített templating elavult (jQuery template)
 de nincs is szükség rá

12. Knock-out how-to #2
 ViewModel és nem Model
 öröklődés nem támogatott
 szerializálás - deszerializálás
 dinamikus listák (ajax) + egyedi komponensek
http://www.knockmeout.net/2011/06/10-things-to-know-abo

14. Tervek
 Business Intelligence: mondrian + saiku
 Grafikonkezelés
 offline üzemmód támogatása