SAP UI5 - Kit de développement

Le kit de développement SAP UI5 pour HTML5 vous fournit un environnement pour le développement d'applications Web et il fournit une application avec une expérience utilisateur cohérente. Les applications Web que vous développez avec SAP UI5 sont réactives sur tous les navigateurs et appareils, et peuvent s'exécuter sur les smartphones, les tablettes et les ordinateurs de bureau.

Les commandes de l'interface utilisateur s'adaptent automatiquement aux capacités de chaque appareil.

Vous pouvez utiliser SAP UI5 sur les plates-formes suivantes -

  • SAP HANA
  • Plateforme cloud SAP HANA
  • SAP NetWeaver pour SAP NetWeaver 7.4 ou version ultérieure
  • Module complémentaire d'interface utilisateur pour SAP NetWeaver pour SAP NetWeaver Application Server 7.3x

Vous pouvez déployer l'application sur le serveur, ce qui inclut le stockage des bibliothèques et l'obtention des données de la base de données. Vous pouvez utiliser le serveur d'applications NetWeaver ou la plateforme HANA Cloud pour le déploiement d'applications, et les données sont accessibles par une application métier à l'aide du modèle OData à l'aide de Gateway. Jetez un œil à l'illustration suivante.

Lorsqu'un utilisateur envoie une demande client depuis son mobile / ordinateur portable, une demande est envoyée au serveur pour charger l'application dans un navigateur, et les données sont accessibles via la base de données et les bibliothèques pertinentes sont accessibles.

Pour créer une application UI5, vous pouvez télécharger les outils du développeur SAP UI5 d'Eclipse. Une fois que vous avez téléchargé, vous pouvez décompresser le fichier et le déployer sur le serveur Web. Pour ABAP, vous pouvez installer un module complémentaire d'interface utilisateur pour SAP NetWeaver et cela inclut également UI5 Theme Designer.

Prérequis pour SAP UI5

Pour installer et mettre à jour la boîte à outils de développement UI5 pour HTML5, vous devez remplir les conditions préalables suivantes:

Plateforme Eclipse Mars (4,5)
Système opérateur Système d'exploitation Windows (XP, Vista, 7 ou 8 / 8.1)
Runtime Java JRE version 1.6 ou supérieure, 32 bits ou 64 bits
GUI SAP

Uniquement pertinent lors de l'installation du fournisseur d'équipe du référentiel SAP UI5 ABAP

  • Pour le système d'exploitation Windows: SAP GUI pour Windows 7.30 / 7.40
Microsoft

Uniquement pertinent lors de l'installation du fournisseur d'équipe du référentiel SAP UI5 ABAP

Pour le système d'exploitation Windows: les DLL VS2010 pour la communication avec le système principal sont requises

Remarque: installez la variante x86 ou x64, en fonction de votre installation Eclipse 32 ou 64 bits

Voyons maintenant comment vous pouvez installer le kit de développement SAP UI5 dans votre système.

Step 1 - Pour installer JDK, accédez à Oracle.com et recherchez la version JDK requise.

Step 2- Téléchargez et exécutez l'installation. Vous recevrez un message comme indiqué dans la capture d'écran suivante.

Step 3- Pour installer Eclipse, accédez à www.Eclipse.org/downloads

Step 4 - Extrayez le fichier comme indiqué dans la capture d'écran suivante.

Step 5 - Pour exécuter l'installation, accédez au dossier extrait et exécutez le fichier d'application comme indiqué dans la capture d'écran suivante.

Step 6 - Pour installer les outils SAPUI5, accédez à Eclipse → Aide → Installer un nouveau logiciel.

Vous pouvez installer directement à l'aide de l'URL ou en entrant le chemin du kit de démonstration UI5.

Step 7 - Ensuite, entrez l'URL dans la boîte de dialogue d'installation https://tools.hana.ondemand.com/mars

Step 8- Pour voir les fonctionnalités disponibles. Appuyez sur la touche ENTER. Vous pouvez sélectionner les fonctionnalités et cliquer sur Suivant. Il affichera la liste des fonctionnalités à installer → Cliquez sur Suivant.

Step 9 - Acceptez le contrat de licence et cliquez sur Terminer pour démarrer l'installation.

Step 10 - Téléchargez le kit de développement d'interface utilisateur pour HTML 5 à partir du lien suivant -

http://scn.sap.com/community/developer-center/front-end et extrayez le contenu dans le même dossier.

Step 11- Démarrez l'environnement Eclipse. Accédez à Aide → Installer un nouveau logiciel.

Step 12 - Cliquez sur Ajouter → Local.

Step 13 - Ensuite, accédez à l'emplacement du site de mise à jour local et sélectionnez le dossier du site de mise à jour de l'outil avec le dossier dans lequel vous avez extrait la boîte à outils de développement HTML5 comme source de mise à jour.

Step 14 - Sélectionnez tous les plugins et fonctionnalités pour l'installation.

Step 15 - Sélectionnez la boîte de dialogue «Contacter tous les sites de mise à jour» lors de l'installation pour trouver le logiciel requis.

Step 16- Cliquez sur le bouton Terminer pour terminer la configuration. Redémarrez Eclipse.

Step 17 - Vous pouvez vérifier l'installation en créant un nouveau projet d'application SAPUI5 via le menu Eclipse Fichier → New→ Autre en bas. Sélectionnez le dossier Développement d'applications SAP UI5 et développez-le pour créer un nouveau projet.

Step 18 - Entrez le nom du projet, sélectionnez la bibliothèque et vous pouvez cocher la case pour créer une vue initiale.

Step 19- Créez une vue à l'aide d'un exemple de code dans le projet. Entrez le nom de la vue et cliquez sur le bouton Suivant.

Step 20- Sélectionnez le paradigme de développement et cliquez sur Terminer. Vous verrez un nouveau projet de développement SAPUI5 dans une nouvelle fenêtre, comme illustré dans la capture d'écran suivante.

Désormais, pour présenter votre application ou l'exécuter en production, vous pouvez déployer votre application SAPUI5 sur le serveur tomcat. Si vous ne disposez pas d'un outil comme MAVEN, vous pouvez utiliser l'option d'exportation pour exporter le projet manuellement. Faites un clic droit sur Projet → Exporter.

Step 21 - Entrez le chemin de destination où vous souhaitez placer le war fichier.

Ensuite, copiez le fichier war-File dans le répertoire webapps de votre apache tomcat. Vous pouvez accéder à votre application en vous rendant sur ce chemin -http://localhost:8080/<votre_app> /

Note - Dans un scénario normal, de nombreux projets SAP s'exécutent dans Internet Explorer mais pour le développement SAPUI5, il est recommandé d'utiliser Google Chrome ou Firefox avec le plugin Firebug car les deux systèmes permettent l'utilisation d'outils et de plugins pour déboguer JavaScript, ainsi que d'utiliser HTML et CSS .