Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
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

727 views

Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

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

×