Vergelijkende studie vanframeworks voor deontwikkeling van mobieleHTML5 applicatiesTim Ameye          Sander Van Loock    ...
Inhoud●   Inleiding●   jQuery Mobile●   Sencha Touch●   Tot slot
Inleiding ●   Situering en doelstelling ●   Vergelijken van frameworks
Situering en doelstelling
Vergelijken van frameworks●   ISO 25010 (vergelijken van software)●   Bestaande Use Cases    ○   Codefessions (score voor ...
jQuery Mobile●   Inleiding●   UI●   Backend●   Demo
Inleiding●   Mark-up gedreven●   Gebouwd op jQuery●   Smartphone, tablet en desktop●   Browsers     ○ Mobile Graded Browse...
Inleiding●   Benodigde tools     ○ Teksteditor, IDE, ...     ○ Browser met developer tools●   Aangeboden tools     ○ Theme...
UI: Geleverd werk             ●   Maand/jaar             ●   Alleen lezen             ●   Nummer             ●   Selectiem...
UI: Geleverd werk             ●   Tabbar             ●   Datepicker             ●   Automatisch aanvullen             ●   ...
UI: Geleverd werk             ●   Textarea             ●   Flip toggle switch             ●   Groene knop
UI: Belangrijkste problemen●   Splitview●   Formuliervalidatie●   Kalender maand/jaar                                     ...
Backend: Geleverd werk●   UserService     ○ login     ○ logout     ○ getEmployee●   ExpenseService     ○ getProjectCodeSug...
Backend: Belangrijkste problemen●   AJAX wordt geïmplementeerd met XMLHttpRequest    (XHR) en is gebonden aan zelfde domei...
Demo
Sencha Touch●   Inleiding●   UI●   Backend●   Demo
Inleiding●   JavaScript gedreven●   WebKit browser engine ondersteuning●   MVC ondersteuning
Geleverd werk (ontwikkeling)Ontwikkeling in Sencha ArchitectNu, EclipseLogboek
UI: Geleverd werk● Vbox layout● Geen Home scherm● Toolbar titel
UI: Geleverd werk● Navigationview● Sorteren op datum
UI: Geleverd werk● Layout formulier● Datepicker
UI: Geleverd werk● Toggleveld
UI: Belangrijkste problemen●   Lijst met vaste elementen●   Afgekorte titel●   Handtekening●   Mapping Sencha Touch / Senc...
Backend: Geleverd werk●   UserService     ○ login     ○ logout     ○ getEmployee●   ExpenseService     ○ getProjectCodeSug...
Backend: Belangrijkste problemen●   Cross-domain requests    ○   Cross-domain POST request met parameters    ○   OPTIONS r...
Demo
Tot slot●   Onduidelijkheden●   To do●   Planning
Onduidelijkheden●   Currency conversie cross-domein●   Units dropdown list●   Aanpassen jaar bij infoveld●   Hergebruik fo...
To do●   Volledig implementeren van POC●   Toevoegen features aan POC●   Andere frameworks     ○ The-M-Project     ○ Kendo...
Planning●   nu - dec: volledig implementatie POC●   jan - feb: implementatie in twee andere frameworks●   28 feb: draft we...
Tussentijdse presentatie Capgemini 29/11/2012
Upcoming SlideShare
Loading in …5
×

Tussentijdse presentatie Capgemini 29/11/2012

585
-1

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
585
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Tussentijdse presentatie Capgemini 29/11/2012

  1. 1. Vergelijkende studie vanframeworks voor deontwikkeling van mobieleHTML5 applicatiesTim Ameye Sander Van Loock 29 november 2012
  2. 2. Inhoud● Inleiding● jQuery Mobile● Sencha Touch● Tot slot
  3. 3. Inleiding ● Situering en doelstelling ● Vergelijken van frameworks
  4. 4. Situering en doelstelling
  5. 5. Vergelijken van frameworks● ISO 25010 (vergelijken van software)● Bestaande Use Cases ○ Codefessions (score voor vergelijkingscriteria) ■ native experience ■ performance ■ cross-platform capabilities ■ features ■ ease of use ■ code efficiency ■ licences ■ community en extensibility ○ jQuery UI vs Kendo UI (vergelijkingstabel)● Vergelijkingstabellen
  6. 6. jQuery Mobile● Inleiding● UI● Backend● Demo
  7. 7. Inleiding● Mark-up gedreven● Gebouwd op jQuery● Smartphone, tablet en desktop● Browsers ○ Mobile Graded Browser Support ○ Progressive enhancement2010 start2011 versie 1.0nu versie 1.2.0
  8. 8. Inleiding● Benodigde tools ○ Teksteditor, IDE, ... ○ Browser met developer tools● Aangeboden tools ○ ThemeRoller ○ Codiqa● Documentatie ○ http://jquerymobile.com/demos/1.2.0/
  9. 9. UI: Geleverd werk ● Maand/jaar ● Alleen lezen ● Nummer ● Selectiemenu ● E-mail ● Validatie
  10. 10. UI: Geleverd werk ● Tabbar ● Datepicker ● Automatisch aanvullen ● Radio buttons ● Nummer ● Textarea ● Validatie
  11. 11. UI: Geleverd werk ● Textarea ● Flip toggle switch ● Groene knop
  12. 12. UI: Belangrijkste problemen● Splitview● Formuliervalidatie● Kalender maand/jaar HTML5 formuliervalidatie caniuse.com 28/11/2012● Native datepicker (+ placeholder)● Projectcode suggesties● Handtekening● (Dialoogvenster) HTML5 date/time caniuse.com 28/11/2012
  13. 13. Backend: Geleverd werk● UserService ○ login ○ logout ○ getEmployee● ExpenseService ○ getProjectCodeSuggestion ○ saveExpense ○ getExpenseFormPDF ○ getExpenseForms
  14. 14. Backend: Belangrijkste problemen● AJAX wordt geïmplementeerd met XMLHttpRequest (XHR) en is gebonden aan zelfde domein● parseJSON en parseXML parsen enkel geldige formaten
  15. 15. Demo
  16. 16. Sencha Touch● Inleiding● UI● Backend● Demo
  17. 17. Inleiding● JavaScript gedreven● WebKit browser engine ondersteuning● MVC ondersteuning
  18. 18. Geleverd werk (ontwikkeling)Ontwikkeling in Sencha ArchitectNu, EclipseLogboek
  19. 19. UI: Geleverd werk● Vbox layout● Geen Home scherm● Toolbar titel
  20. 20. UI: Geleverd werk● Navigationview● Sorteren op datum
  21. 21. UI: Geleverd werk● Layout formulier● Datepicker
  22. 22. UI: Geleverd werk● Toggleveld
  23. 23. UI: Belangrijkste problemen● Lijst met vaste elementen● Afgekorte titel● Handtekening● Mapping Sencha Touch / Sencha Architect
  24. 24. Backend: Geleverd werk● UserService ○ login ○ logout ○ getEmployee● ExpenseService ○ getProjectCodeSuggestion ○ saveExpense ○ getExpenseFormPDF ○ getExpenseForms
  25. 25. Backend: Belangrijkste problemen● Cross-domain requests ○ Cross-domain POST request met parameters ○ OPTIONS request als preflight● Verschil AJAXReader >< AJAXRequest● Parameters doorgeven● Debuggen met Sencha Touch
  26. 26. Demo
  27. 27. Tot slot● Onduidelijkheden● To do● Planning
  28. 28. Onduidelijkheden● Currency conversie cross-domein● Units dropdown list● Aanpassen jaar bij infoveld● Hergebruik formulier read-only/write of nieuwe pagina● Abroad/Domestic expense als 2 verschillende paginas● Weglaten Home● Uitklapbaar menu voor smartphone
  29. 29. To do● Volledig implementeren van POC● Toevoegen features aan POC● Andere frameworks ○ The-M-Project ○ Kendo UI Mobile ○ ...
  30. 30. Planning● nu - dec: volledig implementatie POC● jan - feb: implementatie in twee andere frameworks● 28 feb: draft wetenschappelijk artikel● maart-april: evaluatie frameworks, schrijven thesistekst● 17 mei: indienen draft thesistekst

×