sesión 10: desarrollo de aplicaciones web con web dynpro & flex

29
DESARROLLO DE APLICACIONES WEB CON WEB DYNPROS Y FLEX Autor: Ing. Alexander Clen Riva Ccaccaycucho. Consultor Abap – Bizpartner S.A. [email protected] Lima - Peru

Upload: biz-partner

Post on 15-Dec-2014

3.179 views

Category:

Technology


3 download

DESCRIPTION

SAP Inside Track Lima 2009 Desarrollo de Aplicaciones Web Con Web Dynpro & Flex por Clen Riva

TRANSCRIPT

Page 1: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

DESARROLLO DE APLICACIONESWEB CON WEB DYNPROS Y FLEX

Autor: Ing. Alexander Clen Riva Ccaccaycucho.Consultor Abap – Bizpartner [email protected]

Lima - Peru

Page 2: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

AGENDA

1. ¿Qué es Web Dynpros?2. ¿Cómo programar en Web Dynpros?3. ¿Qué es Flex?4. Flash Island.5. Web Dynpros & Flash Island.6. Uso de Flash Island y Web Dynpros.

Page 3: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Qué es Web Dynpro? Es la principal tecnología estándar para el desarrollo de aplicaciones web

en SAP Business Suite. Permite una estricta separación entre la lógica de negocio y lógica de la

presentación.

Interface Controller

• Context• Events• Methods

Component Controller

• Context• Events• Methods View

Controller

• Context• Events• Methods

View

• Plug• UI Elements• View

Container

Windows

• View Hierarchy• Navigation

Web Dynpro Component

Page 4: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Qué es Web Dynpro? Trabaja con componentes

prediseñados los cuales se integran completamente con Abap.

Implementa el Patrón de Diseño Modelo Vista Controlador (MVC).

Internacionalización. Soportado por diferentes

dispositivos (como cliente).

CONTROLADOR

MODELO

VISTA

Page 5: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

AGENDA

1. ¿Qué es Web Dynpros?2. ¿Cómo programar en Web Dynpros?3. ¿Qué es Flex?4. Flash Island.5. Web Dynpros & Flash Island.6. Uso de Flash Island y Web Dynpros.

Page 6: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Cómo programar en Web Dynpros para Abap?

En ABAP Workbench en la transacción SE80.

Como ambiente de ejecución NetWeaver Web AS ABAP.

Page 7: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Cómo programar en Web Dynpro? El mapeo de contextos en Web Dynpros para Abap.

WD COMPONENT

Windows

View View Controller

ContexRoot Node

USUARIO

COMPONENT CONTROLLER

Contex

Root Node

USUARIO

Node 2

Page 8: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Cómo programar en Web Dynpro? El Entorno de Desarrollo .

Page 9: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

AGENDA

1. ¿Qué es Web Dynpros?2. ¿Cómo programar en Web Dynpros?3. ¿Qué es Flex?4. Flash Island.5. Web Dynpros & Flash Island.6. Uso de Flash Island y Web Dynpros.

Page 10: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Qué es Flex? Plataforma de Desarrollo de Adobe

Software especializada en la creación de RIAs (Rich Internet Aplications) basadas en su motor Flash.

Flex se programa con ActionScript 3 y MXML(biblioteca de ActionScript).

Depende

Page 11: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Adobe Flex Builder 3

IDE basado en Eclipse. UI Visual para diseño y

comportamientos. Debuger interactivo. Componentes gráficos

(Barras, pies, etc)

Edición Profesional agrega. Perfiles de memoria y

rendimiento. Compatibilidad con pruebas

funcionales automatizadas.

StandardUS$ 249

ProfesionalUS$ 699 http://www.adobe.com/products/flex/buy/

Page 12: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

¿Es Flex la única tecnología RIA?

No, luego de la salida y rotundo éxito de Flex, muchas empresas comenzaron a lanzar su propias versiones.

Microsoft Silverlight Sun Microsystems JavaFX Laszlo Systems OpenLaszlo Potix ZK Framework Appcelerator Titanium Curl Curl Framework

Page 13: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Librerías de Flex

www.papervision3dblog.com/ http://www.ilog.com/products/ilogelixir/

http://code.google.com/p/birdeye/

http://code.google.com/p/flexlib/http://www.degrafa.org/

Page 14: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Tour de Flex

http://www.adobe.com/devnet/flex/tourdeflex/web

Page 15: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

AGENDA

1. ¿Qué es Web Dynpros?2. ¿Cómo programar en Web Dynpros?3. ¿Qué es Flex?4. Flash Island.5. Web Dynpros & Flash Island.6. Uso de Flash Island y Web Dynpros.

Page 16: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Flash Islands – Flex en Web Dynpro

SAP Y ADOBE SOFTWARE

Page 17: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Flash Island Es una nueva tecnología

desarrollada por SAP que nos permite utilizar Componentes Flex dentro de aplicaciones

Web Dynpro. Los componentes Flex deben ser

creados aparte y luego ser integrados en la aplicación Web Dynpro para que funcione.

Tener instalado el Enhancement packages for SAP NetWeaver 7.0. 

Page 18: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

AGENDA

1. ¿Qué es Web Dynpros?2. ¿Cómo programar en Web Dynpros?3. ¿Qué es Flex?4. Flash Island.5. Web Dynpros & Flash Island.6. Uso de Flash Island.

Page 19: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Flash Island y Web DynproIntegración de la librería WDIslandLibrary en un proyecto Flex

WDIslandLibrary.swc

Esta librería le permite el acceso a métodos específicos Flash Island.

Page 20: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Flash Island y Web Dynpro

Proyecto Web Dynpro for Abap

Proyecto Flex

WDIslandLibrary.swc

Repositorio MIME

Integración de componentes Flex en una Aplicación Web Dynpro

Componente Flash Island

Page 21: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Flash Island y Web Dynpro Lograr una interfaz de

usuario enriquecido. Web Cam Video. Chat. Compartir Archivos en

tiempo real. Administración de

Usuarios. Integración con Google

Maps. Integración con la

Plataforma Ribbit.

Page 22: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

AGENDA

1. ¿Qué es Web Dynpros?2. ¿Cómo programar en Web Dynpros?3. ¿Qué es Flex?4. Flash Island.5. Web Dynpros & Flash Island.6. Uso de Flash Island y Web Dynpro.

Page 23: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Uso de Flash Island y Web Dynpro

Configuración de Productos Visualización de Datos

Selección de Productos Aplicaciones de Negocio

Page 24: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Visualizaciones Avanzadas de Datos

Uso de Flash Island y Web Dynpro

Page 25: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Sap Flash Island y Google Maps

Uso de Flash Island y Web Dynpro

Page 26: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

https://www.sdn.sap.com/irj/scn/weblogs?blog=/pub/wlg/13014

Cliente Twiterr

Uso de Flash Island y Web Dynpro

Page 27: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Carrito de Compras

Uso de Flash Island y Web Dynpro

Page 28: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Xcelsius y Flash Islands

Uso de Flash Island y Web Dynpro

Page 29: Sesión 10: Desarrollo de Aplicaciones Web Con Web Dynpro & Flex

Muchas Gracias“El conocimiento Humano Pertenece al

mundo”…JClen.