Web ir mobile aplikacijų kūrimo eiga bei įrankiai. si

1. WEB/MOBILE APLIKACIJOS.
KŪRIMO EIGA IR ĮRANKIAI
Simonas Vareikis

2. Turinys
 Kas aš?
 Ką nuveikiau?
 Knygos
 Interneto puslapiai
 Wireframe aka mockup aka eskizas...
 Dizainas
 HTML/CSS
 TVS
 Web aplikacijos (VVS)
 Architektūra
 Framework’ai
 Front-end
 Back-end
 Case study
 VU kiemelių gidas
 Non-native mobile aplikacijos
 Framework’ai

3. Kas aš?

4. Kaip mokiausi? Kas padėjo tobulėti?
 Pirmas puslapis – copy-paste source code
 Knygos (eilės tvarka):
 HTML
 “Tinklalapių
dizainas”
 PHP, MySQL ir APACHE (Poor people toolkit)
 CSS/Usability knygos
 PHP Anthology, CSS Anthology etc ...
 Užsakymai

5. Knygos

6. Interneto puslapiai. 4 žingsniai
 Wireframe
 Dizainas
 HTML/CSS
 TVS

7. 1. Wireframe

8. 2. Dizainas

9. 3. HTML/CSS
 Iškarpome elementus (Photoshop)
 Kuriame stilių arba jo frameworką (naudojame
CSS ir JS frameworkus)
 Sukoduojame puslapius su statišku turiniu –
Lorem Ipsum

10. 4. TVS
 GetSimple – nedideliems, reprezentaciniams
puslapiams su/be naujienų (XML)
 Wordpress – portalai, blogai
 CMS MadeSimple
 Joomla, Drupal
 Magento, Prestashop

11. Web aplikacijos (VVS)
 Architektūra
 Framework’ai
 Front-end
 Back-end
 Case study
 VU kiemelių gidas

12. Architektūra (0). Eiga
 Idėja ir wireframe
 Dizainas (Photoshop, CSS
stiliai, HTML/JS/CSS kodavimas)
 Minimum viable product features
 Duombazės architektūra
 Expand features
 Klaidų taisymas, testavimas

13. Architektūra (1). Įrankiai
 Front-end: HTML/CSS/JAVASCRIPT
 Back-end: PHP/MYSQL
 Pasirenkame front/back framework’us
 Nepamirštam AJAX, REST API
 Dizainas, usability etc.

14. Architektūra (2). Struktūra

15. Architektūra (3). Model-View-Controller

16. Architektūra (4). RESTful API

17. Framework’ai. Front-end
 CSS framework’ai
 Blueprint
 960.gs + adapt.js
 Bootstrap
 Javascript framework’ai
 jQuery
 Prototype
 Dojo

18. CSS framework’ai (1). Blueprint
 CSS reset
 Grid sistema
 Šriftai
 Formų stiliai

19. CSS framework’ai (2). 960.gs

20. CSS framework’ai (3). Bootstrap
http://twitter.github.com/bootstrap/

22. Javascript framework’ai. jQuery?
 Populiariausias pasaulyje JS framework’as
 Didelė, aktyvi bendruomenė
 Begalė pluginų
 Trumpas learning-curve’as
 Galima nieko nežinoti apie Javascript prieš
tai...

23. Framework’ai back-end
 CodeIgniter.com
 CakePHP
 Zend

24. Case study. VU kiemelių gidas

25. Non-native mobile aplikacijos.
Frameworkai
 PhoneGap
 Jquery mobile
 Sencha Touch
PhoneGap is an HTML5 app platform that allows you to author
native applications with web technologies and get access to
APIs and app stores. PhoneGap leverages web technologies
developers already know best... HTML and JavaScript.

26. Ačiū