SAP UI5 - Kit de desarrollo

El kit de desarrollo SAP UI5 para HTML5 le proporciona un entorno para el desarrollo de aplicaciones basadas en web y proporciona una aplicación con una experiencia de usuario coherente. Las aplicaciones web que desarrolle con SAP UI5 responden a todos los navegadores y dispositivos, y pueden ejecutarse en teléfonos inteligentes, tabletas y computadoras de escritorio.

Los controles de la interfaz de usuario se adaptan automáticamente a las capacidades de cada dispositivo.

Puede utilizar SAP UI5 en las siguientes plataformas:

  • SAP HANA
  • Plataforma en la nube SAP HANA
  • SAP NetWeaver para SAP NetWeaver 7.4 o superior
  • Complemento de interfaz de usuario para SAP NetWeaver para SAP NetWeaver Application Server 7.3x

Puede implementar la aplicación en el servidor que incluye almacenar las bibliotecas y obtener datos de la base de datos. Puede utilizar el servidor de aplicaciones NetWeaver o la plataforma HANA Cloud para la implementación de aplicaciones, y una aplicación empresarial puede acceder a los datos utilizando el modelo OData utilizando Gateway. Eche un vistazo a la siguiente ilustración.

Cuando un usuario envía una solicitud de cliente desde su móvil / computadora portátil, se envía una solicitud al servidor para cargar la aplicación en un navegador, y se accede a los datos a través de la base de datos y se accede a las bibliotecas relevantes.

Para crear una aplicación UI5, puede descargar las herramientas para desarrolladores de SAP UI5 de Eclipse. Una vez que lo descargue, puede descomprimir el archivo e implementarlo en el servidor web. Para ABAP, puede instalar un complemento de UI para SAP NetWeaver y esto también incluye UI5 ​​Theme Designer.

Requisitos previos para SAP UI5

Para instalar y actualizar el kit de herramientas de desarrollo UI5 para HTML5, debe cumplir con los siguientes requisitos previos:

Plataforma Eclipse Marte (4,5)
Sistema operativo Sistema operativo Windows (XP, Vista, 7 u 8 / 8.1)
Tiempo de ejecución de Java JRE versión 1.6 o superior, 32 bits o 64 bits
GUI de SAP

Solo es relevante al instalar el proveedor del equipo de repositorio ABAP de SAP UI5

  • Para el sistema operativo Windows: SAP GUI para Windows 7.30 / 7.40
Microsoft

Solo es relevante al instalar el proveedor del equipo de repositorio ABAP de SAP UI5

Para el sistema operativo Windows: se requieren DLL VS2010 para la comunicación con el sistema back-end

Nota: instale la variante x86 o x64, de acuerdo con su instalación de Eclipse de 32 o 64 bits

Procedamos ahora y analicemos cómo puede instalar el kit de desarrollo SAP UI5 en su sistema.

Step 1 - Para instalar JDK, vaya a Oracle.com y busque la versión de JDK requerida.

Step 2- Descarga y ejecuta la instalación. Recibirá un mensaje como se muestra en la siguiente captura de pantalla.

Step 3- Para instalar Eclipse, vaya a www.Eclipse.org/downloads

Step 4 - Extraiga el archivo como se muestra en la siguiente captura de pantalla.

Step 5 - Para ejecutar la instalación, vaya a la carpeta extraída y ejecute el archivo de la aplicación como se muestra en la siguiente captura de pantalla.

Step 6 - Para instalar las herramientas SAPUI5, vaya a Eclipse → Ayuda → Instalar nuevo software.

Puede instalar directamente usando la URL o ingresando la ruta del kit de demostración UI5.

Step 7 - A continuación, ingrese la URL en el cuadro de diálogo de instalación https://tools.hana.ondemand.com/mars

Step 8- Para ver las funciones disponibles. Presione la tecla ENTER. Puede seleccionar las funciones y hacer clic en Siguiente. Mostrará la lista de funciones que se instalarán → Haga clic en Siguiente.

Step 9 - Acepte el contrato de licencia y haga clic en Finalizar para iniciar la instalación.

Step 10 - Descargue UI Development Kit para HTML 5 desde el siguiente enlace -

http://scn.sap.com/community/developer-center/front-end y extraiga el contenido en la misma carpeta.

Step 11- Inicie el entorno Eclipse. Vaya a Ayuda → Instalar nuevo software.

Step 12 - Haga clic en Agregar → Local.

Step 13 - A continuación, navegue hasta la ubicación del sitio de actualización local y seleccione la carpeta del sitio de actualización de herramientas con la carpeta donde extrajo el kit de herramientas de desarrollo HTML5 como fuente de actualización.

Step 14 - Seleccione todos los complementos y funciones para la instalación.

Step 15 - Seleccione el cuadro de diálogo "Contactar con todos los sitios de actualización" durante la instalación para encontrar el software necesario.

Step 16- Haga clic en el botón Finalizar para completar la configuración. Reinicie Eclipse.

Step 17 - Puede verificar la instalación creando un nuevo proyecto de aplicación SAPUI5 a través del menú Eclipse Archivo → New→ Otro en la parte inferior. Seleccione la carpeta Desarrollo de aplicaciones SAP UI5 y expanda para crear un nuevo proyecto.

Step 18 - Ingrese el nombre del proyecto, seleccione biblioteca y puede marcar la casilla para crear una vista inicial.

Step 19- Cree una vista usando algún código de muestra en el proyecto. Ingrese el nombre de la vista y haga clic en el botón Siguiente.

Step 20- Seleccione el paradigma de desarrollo y haga clic en Finalizar. Verá un nuevo proyecto de desarrollo de SAPUI5 en una nueva ventana como se muestra en la siguiente captura de pantalla.

Ahora, para presentar su aplicación o ejecutarla en producción, puede implementar su aplicación SAPUI5 en el servidor Tomcat. Si no tiene una herramienta como MAVEN, puede usar la opción de exportación para exportar el proyecto manualmente. Haga clic derecho en Proyecto → Exportar.

Step 21 - Ingrese la ruta de destino donde desea colocar el war archivo.

A continuación, copie el archivo war al directorio webapps de su apache tomcat. Puede acceder a su aplicación yendo a esta ruta:http://localhost:8080/<tu_aplicación> /

Note - En un escenario normal, muchos proyectos de SAP se ejecutan en Internet Explorer, pero para el desarrollo de SAPUI5 se recomienda usar Google Chrome o Firefox con el complemento firebug ya que ambos sistemas permiten el uso de herramientas y complementos para depurar JavaScript, así como también usar HTML y CSS .