CONFIGURACIÓN DE UN PROYECTO

Transcripción

1 Fundación CTIC Taller sobre Web Móvil y HTML5 06 de Junio de Cornellà de Llobregat MYMOBILEWEB: CONFIGURACIÓN DE UN PROYECTO Cristina González Cachón [email protected] Fundación CTIC

2 ÍNDICE CONSTRUIR APLICACIÓN MMW Material Instalación Configuración del entorno Configuración de la aplicación Definición de la aplicación Presentación Flujo Lógica de Negocio Generación y despliegue Resultado final EJEMPLO FINAL 2

3 MATERIAL Java Java SE 5.0+ JDK Entorno de desarrollo Eclipse Indigo, Ganymede, Servidor de aplicaciones/contenedor de servlets Apache Tomcat 5,5+ Device Description Repository (DDR Simple API) Librerías de MyMobileWeb Ejemplos MyMobileWeb 3

4 INSTALACIÓN Instalar el entorno de desarrollo: Eclipse Instalar servidor web de aplicaciones Instalar el Servicio REST DDR 1.3 Descargar librerías 4

5 INSTALACIÓN DDR SERVICE Descargar el software Desplegar la aplicación en el servidor Webapps Acceder Arrancar servidor Comprobar funcionamiento List Available Properties 5

6 CONFIGURACIÓN DEL ENTORNO File Import General Existing Projects into workspace Última Versión (4.1): 6

7 CONFIGURACIÓN DEL ENTORNO Para añadir un servidor al entorno de desarrollo: File New Other Server Configurar las características del servidor Añadir el proyecto web deseado 7

8 CONFIGURACIÓN DEL ENTORNO Deploy Tools: MyMobileWeb.Codegen MyMobileWeb.LiteralExtractor 8

9 CONFIGURACIÓN DEL ENTORNO Generación de JSPs y Extracción de literales Run As Run Configurations Java Application Generator y Extractor 9

10 COMO CONSTRUIR UNA APLICACIÓN: CONCEPTOS CLAVE Presentación (View o Vista) Página web, pantalla o ventana que contiene componentes de la interfaz de usuario, OP (Operación de Presentación o Use Case o Caso de Uso): Agrupación de presentaciones con un objetivo común OA (Operación de Aplicación) Clase Java que implementa parte de la lógica de la aplicación. 10

11 CONFIGURACIÓN DE LA APLICACIÓN ESTRUCTURA DE DIRECTORIOS css: hojas de estilos DeviceBBDD: gestor de dispositivos flows: control de flujo de la applicación i18n: sms, literales e internacionalización resource: imágenes, vídeos, 11

12 CONFIGURACIÓN DE LA APLICACIÓN ESTRUCTURA DE DIRECTORIOS OPs: definición UI (IDEAL2) jsp: generadas automáticamente a partir de la definición de IDEAL2+CSS 12

13 CONFIGURACIÓN DE LA APLICACIÓN ESTRUCTURA DE DIRECTORIOS myscript: scripts que añaden funcionalidad a la aplicación. script: scripts internos de la plataforma WEB-INF: clases JAVA que gestionan el funcionamiento de la aplicación archivos de configuración Librerías Validación del flujo 13

14 CONFIGURACIÓN DE LA APLICACIÓN Archivos de configuración: WEB-INF/config MyMobileWeb.Global: configuración global de la aplicación 14

15 CONFIGURACIÓN DE LA APLICACIÓN MyMobileWeb.DevMng: características Gestor de dispositivos DDR Remoto o local URL de acceso 15

16 CONFIGURACIÓN DE LA APLICACIÓN CarAgency.xml: propiedades externas necesarias para la aplicación: RSS, fuentes de información, Global: propiedad appl_config OAConfig.xml: Definen las OAs que se utilizan. Identificador y clase implementadora. Traces.xml Definen las trazas para depurar el comportamiento del código 16

17 APLICACIÓN DE ALQUILER DE COCHES 17

18 APLICACIÓN DE ALQUILER DE COCHES 18

19 APLICACIÓN DE ALQUILER DE COCHES 19

20 APLICACIÓN DE ALQUILER DE COCHES 20

21 DEFINICIÓN DE PRESENTACIONES Se definen OPs y presentaciones IDEAL2 Language 21

22 DEFINICIÓN DE PRESENTACIONES Se definen OPs y presentaciones IDEAL2 Language 22

23 DEFINICIÓN DE PRESENTACIONES Se definen enlaces a recursos externos: Referencia a hojas de estilos, scripts 23

24 DEFINICIÓN DE PRESENTACIONES Define la Interfaz de Usuario Body: contiene todo el documento 24

25 DEFINICIÓN DE PRESENTACIONES Section: el cuerpo del documento se puede dividir en secciones para estructurar el contenido 25

26 DEFINICIÓN DE PRESENTACIONES footer: sección del documento acotada 26

27 DEFINICIÓN DE PRESENTACIONES Tabs: pestañas 27

28 DEFINICIÓN DE PRESENTACIONES Preferencias de aplicación 28

29 DEFINICIÓN DE PRESENTACIONES Preferencias de aplicación: menú de selección 29

30 DEFINICIÓN DE PRESENTACIONES Preferencias de aplicación: menú de selección 30

31 DEFINICIÓN DE PRESENTACIONES Preferencias de aplicación: menú de selección 31

32 DEFINICIÓN DE PRESENTACIONES <submit>: botón de acceso 32

33 DEFINICIÓN DE PRESENTACIONES <label>: texto mostrado sólo ocasionalmente 33

34 DEFINICIÓN DE LOOK-AND-FEEL REDEFINICIÓN POR FAMILIAS 34

35 DEFINICIÓN DE LOOK-AND-FEEL GENERIC: PESTAÑAS 35

36 DEFINICIÓN DE LOOK-AND-FEEL GENERIC: BOTÓN 36

37 DEFINICIÓN DE LOOK-AND-FEEL AGRUPACIONES: sólo en HTML3.2 37

38 DEFINICIÓN DE LOOK-AND-FEEL AGRUPACIONES: sólo en HTML3.2 38

39 DEFINICIÓN DE LOOK-AND-FEEL HTML5 HTML3.2 39

40 DEFINICIÓN DEL FLUJO ESQUELETO BÁSICO 40

41 DEFINICIÓN DEL FLUJO ESTADO DE APLICACIÓN 41

42 DEFINICIÓN DEL FLUJO ESTADO DE CASO DE USO 42

43 DEFINICIÓN DEL FLUJO ESTADO INICIAL 43

44 DEFINICIÓN DEL FLUJO TRANSICIONES GLOBALES 44

45 DEFINICIÓN DEL FLUJO TRANSICIONES DE PESTAÑAS 45

46 DEFINICIÓN DEL FLUJO ESTADO DE PREFERENCIAS 46

47 DEFINICIÓN DEL FLUJO ESTADO DE CASO DE USO 47

48 DEFINICIÓN DEL FLUJO Estado vista 48

49 DEFINICIÓN DEL FLUJO Transición 49

50 DEFINICIÓN DE LA OA Código JAVA OAConfig.xml 50

51 GENERACIÓN Y DESPLIEGUE Añadir: posible recursos: imágenes, vídeos, GENERACIÓN: Run Run JSP DESPLIEGUE: Contenedor de Servlets 51

52 COMO CONSTRUIR UNA APLICACIÓN: RESULTADO FINAL HTML5 HTML3.2 XHTML-MP 52

53 EJEMPLO FINAL Servicio de alquiler de coches 53

54 EJEMPLO FINAL Servicio de alquiler de coches 54

55 EJEMPLO FINAL Servicio de alquiler de coches 55

56 EJEMPLO FINAL Servicio de alquiler de coches 56

57 GRACIAS POR SU ATENCIÓN 57