de perdidos a titanium - codemotion madrid 2013
DESCRIPTION
Titanium es una herramienta para desarrollo de aplicaciones móviles de forma rápida y sencilla utilizando JavaScript como lenguaje de programación base. Porque todo el mundo puede hacer aplicaciones móviles nativas y de calidad. Si eres front-developer o back-developer, ya no tienes que preocuparte cuando te piden una aplicación móvil. En la charla te explicaremos como hacer tu aplicación con Titanium con un caso práctico de desarrollo, sin necesidad de saber Java ni Objective-C.TRANSCRIPT
![Page 2: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/2.jpg)
Patrocinadores
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 3: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/3.jpg)
Organización y Asistentes
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 4: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/4.jpg)
Ariel Ferrandini@aferrandini
{CM}I
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 5: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/5.jpg)
Ariel Ferrandini@aferrandini
{CM}I
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 6: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/6.jpg)
Ariel Ferrandini@aferrandini
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 7: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/7.jpg)
@aferrandini
Javascript
Douglas Crockford Senior JavaScript Architect
![Page 8: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/8.jpg)
¿Quién soy?
• Ariel Ferrandini Price (11-11-85)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 9: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/9.jpg)
¿Quién soy?
• Ariel Ferrandini Price (11-11-85)
• Murcia ~ Madrid
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 10: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/10.jpg)
¿Quién soy?
• Ariel Ferrandini Price (11-11-85)
• Murcia ~ Madrid
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 11: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/11.jpg)
¿Quién soy?
• Ariel Ferrandini Price (11-11-85)
• Murcia ~ Madrid
• Programador Backend
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 12: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/12.jpg)
¿Quién soy?
• Ariel Ferrandini Price (11-11-85)
• Murcia ~ Madrid
• Programador Backend
• PHP ~ Symfony
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 13: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/13.jpg)
¿Quién soy?
• Ariel Ferrandini Price (11-11-85)
• Murcia ~ Madrid
• Programador Backend
• PHP ~ Symfony
• +8 años experiencia en movilidad
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 14: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/14.jpg)
¿Qué es Titanium?
`Titanium`: en español `Titanio` del latín `Titan`, es un elemento químico cuyo símbolo es Ti y su número atómico es 22.
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
![Page 15: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/15.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
¿Qué es Titanium?
Appcelerator Titanium – Es un entorno de desarrollo abierto y extensible, para crear preciosas aplicaciones NATIVAS para las plataformas móviles: iOS, Android, BlackBerry e híbridas HTML5.
![Page 16: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/16.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Tecnologías
• ¡ Javascript !
• [ Java ]
• [ Objective-C ]
• [ HTML/CSS ]
![Page 17: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/17.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Tecnologías
• ¡ Photoshop ! / Gimp
![Page 18: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/18.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
¿Cómo funciona?
JS
![Page 19: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/19.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
¿Por qué Titanium?
• Una misma aplicacion para varias plataformas.
• Un solo lenguaje de programación: Javascript.
• Una sola maquetación.
• Un solo diseño.
![Page 20: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/20.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
¿Cuándo NO usar Titanium?
• Necesidad de OpenGL.
• Pantallas muy complejas.
• Necesidad de alto rendimiento.
![Page 21: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/21.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Hay que saber decir NO, si no se puede...
![Page 22: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/22.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Antes de empezar con Titanium
• Conocimiento de Javascript medio/alto.
• Necesitas un Mac para aplicaciones
iOS (iPhone y iPad).
![Page 23: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/23.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Antes de empezar con Titanium
• Conocimiento de Javascript medio/alto.
• Necesitas un Mac para aplicaciones
iOS (iPhone y iPad).
• Desarrollador Apple 99$/año.
• Desarrollador Android 25$.
![Page 24: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/24.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Titanium
![Page 25: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/25.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Titanium IDE
• Eclipse con esteroides.
• Se integra a la perfección con Android SDK y Xcode.
• Debug:
‣ Android Simulator ~ Mejor Android Device + DDMS.
‣ iOS Simulator.
![Page 26: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/26.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
UI - Elementos nativos
http://docs.appcelerator.com/titanium/latest/
• Window, View, ScrollView, ListView, ImageView, WebView
• Label, TextField, Dialog, OptionDialog
• List, ListItem, ListSection
• Slider
• ProgressBar, Switch
![Page 27: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/27.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
UI - Elementos nativos
http://docs.appcelerator.com/titanium/latest/
• CoverFlowView, DocumentViewer
• Toolbar
• TabbedBar, StatusBar
• SystemIcon, SystemButton
• iPad - SplitWindow
![Page 28: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/28.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
UI - Elementos nativos
http://docs.appcelerator.com/titanium/latest/
• SearchView
• ProgressIndicator
![Page 29: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/29.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Elementos personalizados
http://docs.appcelerator.com/titanium/latest/
• Módulos Javascript con Views, Labels, etc.
• Módulos nativos (Java, Objective-C).
• Depende de la necesidad y lo complejo que sea el elemento.
• Appcelerator Market / Github.
![Page 30: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/30.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
API - Titanium. | Ti.
• Titanium.Geolocation‣ GPS
‣ Acelerómetro
‣ Brújula
• Titanium.Network‣ Acceso HTTP/HTTPS
‣ XML/JSON Parser
‣ Notificaciones Push
• Titanium.Database‣ Integración SQLite
‣ Almacenamiento clave-valor
• Titanium.Filesystem‣ Lectura/Escritura archivos
• Titanium.Media‣ Cámara de fotos
‣ Grabación de audio y vídeo
‣ Reproductor de música y vídeos
• Titanium.Facebook‣ Integración con Facebook
‣ Integración con Twitter
‣ Integración con Foursquare
‣ Integración con Yahoo!
![Page 31: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/31.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Hay un framework MVC
Alloyhttp://docs.appcelerator.com/titanium/3.0/#!/guide/Alloy_Framework
![Page 32: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/32.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Alloy framework
• Vistas en archivos XML, hojas de estilo y temas.
• Controladores con herencia.
• Modelo que permite sincronización mediante adaptadores y migraciones.
• Widgets con sus propias vistas, controladores y modelo.
![Page 33: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/33.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
Workshophttps://github.com/aferrandini/Simon
![Page 34: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/34.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
¡Muchas gracias!
@aferrandini
![Page 35: De perdidos a Titanium - Codemotion Madrid 2013](https://reader033.vdocuments.us/reader033/viewer/2022051514/5495bdf2ac7959182e8b4ecd/html5/thumbnails/35.jpg)
[email protected] - Paradigma TecnológicoAriel Ferrandini Price
De perdidos a Titanium
@aferrandini
¿Preguntas?