Transcript
Page 1: De perdidos a Titanium - Codemotion Madrid 2013

@[email protected]

Paradigma Tecnológico

Ariel Ferrandini Price

De perdidos a Titanium

Page 2: De perdidos a Titanium - Codemotion Madrid 2013

Patrocinadores

[email protected] - Paradigma TecnológicoAriel Ferrandini Price

De perdidos a Titanium

@aferrandini

Page 3: De perdidos a Titanium - Codemotion Madrid 2013

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

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

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

Ariel Ferrandini@aferrandini

[email protected] - Paradigma TecnológicoAriel Ferrandini Price

De perdidos a Titanium

@aferrandini

Page 7: De perdidos a Titanium - Codemotion Madrid 2013

@aferrandini

Javascript

Douglas Crockford Senior JavaScript Architect

Page 8: De perdidos a Titanium - Codemotion Madrid 2013

¿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

¿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

¿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

¿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

¿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

¿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

¿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

[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

[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

[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

[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

[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

[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

[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

[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

[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

[email protected] - Paradigma TecnológicoAriel Ferrandini Price

De perdidos a Titanium

@aferrandini

Titanium

Page 25: De perdidos a Titanium - Codemotion Madrid 2013

[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

[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

[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

[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

[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

[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

[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

[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

[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

[email protected] - Paradigma TecnológicoAriel Ferrandini Price

De perdidos a Titanium

@aferrandini

¡Muchas gracias!

@aferrandini

Page 35: De perdidos a Titanium - Codemotion Madrid 2013

[email protected] - Paradigma TecnológicoAriel Ferrandini Price

De perdidos a Titanium

@aferrandini

¿Preguntas?


Top Related