Solution Overview
Transcription
Solution Overview
SAP Web IDE Solution Overview June 2016 SAP Web IDE May 2016 Release (1605) Provided by SAP Web IDE PM Team Disclaimer The information in this presentation is confidential and proprietary to SAP and may not be disclosed without the permission of SAP. Except for your obligation to protect confidential information, this presentation is not subject to your license agreement or any other service or subscription agreement with SAP. SAP has no obligation to pursue any course of business outlined in this presentation or any related document, or to develop or release any functionality mentioned therein. This presentation, or any related document and SAP's strategy and possible future developments, products and or platforms directions and functionality are all subject to change and may be changed by SAP at any time for any reason without notice. The information in this presentation is not a commitment, promise or legal obligation to deliver any material, code or functionality. This presentation is provided without a warranty of any kind, either express or implied, including but not limited to, the implied warranties of merchantability, fitness for a particular purpose, or non-infringement. This presentation is for informational purposes and may not be incorporated into a contract. SAP assumes no responsibility for errors or omissions in this presentation, except if such damages were caused by SAP’s intentional or gross negligence. All forward-looking statements are subject to various risks and uncertainties that could cause actual results to differ materially from expectations. Readers are cautioned not to place undue reliance on these forward-looking statements, which speak only as of their dates, and they should not be relied upon in making purchasing decisions. © 2016 SAP SE or an SAP affiliate company. All rights reserved. 2 Agenda Introduction and overview Developing applications Extending SAP Fiori applications SAP Web IDE releases System overview Additional information © 2016 SAP SE or an SAP affiliate company. All rights reserved. 3 Introduction and overview SAP Web IDE Key trends and impacts in business and technology IDC: “Enterprise Guidance … Leverage the productivity of cloud IDEs which have entered mainstream usage.”1 Evans: “Browser-based development is one of the most important capabilities of a PaaS.”2 1 Source: IDC Market Analysis Perspective: Worldwide Application Development Software, 2015 (September 2015) by Al Hilwa 2 Source: Evans Data Corp Get Ahead in the Cloud, Cloud Development Survey Volume I & II, 2015 © 2016 SAP SE or an SAP affiliate company. All rights reserved. 5 From today to vision AppBuilder AppDesigner Gateway Productivity Accelerators Eclipse SAP Web IDE Fiori toolkit UI development toolkit for HTML5 SAP HANA Cloud Platform Fiori Cloud Edition Mobile Services Theme Designer Development Infrastructure HANA Cloud Integration API Management This is the current state of planning and may be changed by SAP at any time. © 2016 SAP SE or an SAP affiliate company. All rights reserved. 6 SAP Web IDE Product description Powerful, extensible, cloud-based integrated development tool that simplifies end-to-end application development for Fiori and SAPUI5 apps Develop © 2016 SAP SE or an SAP affiliate company. All rights reserved. Test Package and deploy App extensions 7 Key Use Cases Build new Fiori and SAPUI5 applications Extend SAP Fiori applications • Leverage out of the box code templates based on SAP best practices • Extend existing SAP Fiori application with out of the box extension points • Easily deploy to relevant SAP platforms • Extensions can be both via coding and graphical tools Develop SAPUI5 hybrid mobile applications Extend the SAP Web IDE with additional plugins and templates • Create, test, build and deploy Apache Cordova hybrid mobile apps • Enhance SAP Web IDE with new capabilities ranging from menus, panels to full blown business solutions • Leverage mobile services integration • Create new templates including your look and feel © 2016 SAP SE or an SAP affiliate company. All rights reserved. 8 SAP Web IDE Code simple Key Benefits Zero installation and upgrade Rapid development of Fiori and SAPUI5 apps Increases developer productivity Improves team productivity Develop once, deploy to SAP platforms: HANA Cloud Platform (HCP), ABAP, SAP Mobile Platform (SMP) and Portal © 2016 SAP SE or an SAP affiliate company. All rights reserved. 9 Key features Sample applications, templates and wizards for creating SAP Fiori, SAPUI5 and hybrid-mobile Apps Creating and testing applications with specific SAPUI5 versions Source code editor with SAPUI5 code completion Layout Editor (WYSIWYG) User-friendly graphical app extension mechanisms Instant application preview in browser Mock data support for backend-decoupled development and testing Project persistency through integrated Git source control Integrated deployment to SAP platforms (HANA Cloud Platform, ABAP repository, …) Extension possibilities via plugins © 2016 SAP SE or an SAP affiliate company. All rights reserved. 10 SAP Web IDE Plugins SAP out-of the-box plugins and templates Hybrid Application Toolkit OData Model Editor SAP Fiori Overview Page VizPacker Create and deploy hybrid mobile Fiori apps based on Apache Cordova and Kapsel Develop your own OData model and view it graphically Enables to create package & deploy a SAP Fiori overview page application create chart extension packages that can be used within SAP Lumira and other products SAP Hana Cloud Portal Enterprise Portal Fact Sheet Editor SAP Events Management Set of wizards for creating site templates, page templates, pages, and widgets Deploy SAP Web-IDE developed application into a Portal Create and edit fact sheets using drag-and-drop Create self-defined transactional SAP Fiori apps for SAP Event Management © 2016 SAP SE or an SAP affiliate company. All rights reserved. 11 Developing applications Development process overview Create Create Test Develop Develop Test Deploy Deploy New / Import Quick Start with Layout Editor from Archive Project from Template from SAPUI5 ABAP repository Sample (Reference) Application from HCP Extension Project from SAP Fiori cloud edition Coding Code Editor, dynamic API reference, Layout Editor (WYSIWYG), Version Control System (Git), etc. HCP Templates Wizards guiding the user through a step-by-step process, automatically generating needed files and code SAPUI5 ABAP repository WYSIWYG Design Design the UI in the Layout Editor SMP from Git Repository Splash/BUILD* Visual Extensibility While running the SAPUI5/Fiori app select an element and apply an extension, modification, replacement Enterprise Portal Git integration * Currently in beta © 2016 SAP SE or an SAP affiliate company. All rights reserved. 13 Welcome screen Perspectives: • Home (Welcome) • Developer • Preferences User Name Current version Notification every time an update is pushed. Users can read about new features Link to external resources and tools Quick and easy access to the most common creation actions © 2016 SAP SE or an SAP affiliate company. All rights reserved. 14 Development environment overview Create Develop Test Deploy Search Menu Bar Advanced Repository Search Global Toolbar Find in files (file name or content) Workspace Git User’s copy of the projects Manage your development objects in your Git repository Editor/Layout Editor Git History SAPUI5 code editor Tag, Cherry-Pick, Revert Code completion API Reference Context sensitive Dynamic support Outline Bottom Pane Right Side Pane Show/hide various panes, e.g. Console, Problems View • Show/hide various panes, e.g. © 2016 SAP SE or an SAP affiliate company. All rights reserved. Search, Git, API Reference 15 Create Create Develop Test Deploy Various options are available for the developer to create a new project: 1 File > New • • 2 1 Create a new project • from a template • from a sample application • Quick start with the Layout Editor 2 Create a new extension project, e.g. for SAPUI5 or SAP Fiori extensibility File > Import • 3 Create a project by importing the application from: • the file system (file, ZIP archive, etc.) • ABAP repository • HCP • Splash/BUILD 3 File > Git • Create a project from an existing Git repository (Git clone) © 2016 SAP SE or an SAP affiliate company. All rights reserved. 16 Quick Start with Layout Editor Create Develop Test Deploy Single click starter application creation Project “QuickStartApplication” is generated Model is created with three simple entity types JSON files with mock data are generated View is created Layout Editor is launched with view © 2016 SAP SE or an SAP affiliate company. All rights reserved. 17 Templates Create Develop Test Deploy The template wizard guides the user through the definition of an application and then generates the code Standard templates are provided, e.g.: SAP Fiori projects – SAP Fiori Master-Detail Application – SAP Fiori CRUD Master-Detail Application – SAP Fiori smart template – SAP Fiori Worklist Application – SAP Factsheet SAPUI5 projects Empty Plugin Project Sample applications Easily ramp up Fiori development by audited readyto-run end to end samples Additional templates of any kind can be created, added and managed © 2016 SAP SE or an SAP affiliate company. All rights reserved. You can choose the SAPUI5 version for the application 18 SAP Fiori Sample Applications (Reference Apps) Create Develop Test Deploy see SCN: http://scn.sap.com/docs/DOC-59963 SAP Fiori sample apps are complete apps with all coding They can be used as a reference or to copy&paste coding from They provide exemplary coding and comprehensive comments , representing best practices for Fiori applications Mock-server support allows immediate look & try even without a backend system Three sample applications are available: Shop Approve Purchase Orders Manage Products browse products and add them to a shopping basket review and approve/reject purchase orders maintain the product master of the Shop • Transactional application • Transactional application • Transactional application with edit • Full screen pattern • Master-detail pattern • Master-detail pattern © 2016 SAP SE or an SAP affiliate company. All rights reserved. 19 New extensibility project Create Develop Test Deploy When creating a new extension project, you need to identify the parent SAP Fiori/SAPUI5 application being extended File > New > Extension Project Three options. Either: 1. Parent app is from ABAP repository 2. Parent app is from HCP 3. Parent app is from your Workspace Option to import the original application Option to open the extension project in the extensibility pane after project generation The tool creates the extension project in your workspace and generates the files such as Component.js index.html Etc. Find out more in the “Extending SAP Fiori App” section © 2016 SAP SE or an SAP affiliate company. All rights reserved. 20 Code Editor Create Develop Test Deploy Assisted Development Code completion – SAPUI5 code completion for XML, JS – AMD and non-AMD – Editor completes words, code fragments or entire SAPUI5 objects – Cross-file code completion – Snippet-based XML and JS auto-completion – Easily set a different SAPUI5 version – Auto-hint – code completion while typing Code Editor – Code Editor for JS, XML, JSON and CSS – Workspace/project/file search and replace pane – Integration with static code quality tools (ESLint) – JSON validator – syntax, neo-app and manifest – Semantic checks for SAPUI5 XML – Beautifiers for JS, XML, JSON and CSS – Problem view – API reference pane for control documentation – Outline pane for the JS main entities and the flow of the application – Cross-file navigation – Compare editor and manifest (AppDescriptor) editor – Personalization of code editor theme and font size Auto-save © 2016 SAP SE or an SAP affiliate company. All rights reserved. 21 Layout Editor (WYSIWYG) Create Develop Test Deploy Design your view graphically in the Layout Editor and display the content of the XML view Right-click the XML file and open with Layout Editor Design the view in the graphical display (Canvas) Drag & drop the SAPUI5 controls from the Palette to the Canvas Configure the properties and events of the controls Bind the data fields to the OData service entity sets © 2016 SAP SE or an SAP affiliate company. All rights reserved. 22 Layout Editor (WYSIWYG) Device Form Factor Create Panes Hide/Show Develop Test Deploy Undo/Redo Smartphone/Tablet/Desktop Canvas Content of the XML view Graphical display Properties, Events and Data Pane Palette/Outline SAPUI5 controls drag & drop controls to the canvas Add/Remove controls from Outline Shows properties and data of selected control Entity sets and properties of OData service OData binding Focus on control from Outline © 2016 SAP SE or an SAP affiliate company. All rights reserved. 23 Testing in SAP Web IDE Create Develop Test Deploy Validate your app functionality, appearance, compatibility, performance and translation Test Authoring SAP Web IDE provides both wizard based and code based assistance for developing unit tests and integration tests for Fiori and SAPUI5 apps Create OPA Pages, OPA Journeys, and QUnit Tests in a project using a wizard Use code completion to add snippets for OPA tests in an OPA journey © 2016 SAP SE or an SAP affiliate company. All rights reserved. Test Execution / In-Development Testing SAP Web IDE empowers developers to test and evaluate their apps functionality and performance during development Instant app preview, with various presets Mock business data Measure Performance Execute QUnit and OPA tests 24 Run the application Create Develop Test Deploy You can run the application to test functionality, design and performance There are various ways to run your application: Run as – Web Application: Application Preview in browser – Unit Test: run the application as a unit test – SAP Fiori Component on Sandbox: run in the SAP Fiori launchpad environment Run Configurations: Define how the application runs, including the SAPUI5 runtime version Run with Mock Data – Automatically generated data – Generate and edit persistent mock data: Mock data provided in JSON files Running an application with performance measurements © 2016 SAP SE or an SAP affiliate company. All rights reserved. 25 Application Preview in browser Create Frame Develop Test Deploy Option to run with Frame in Project Settings Choice of simulator Language Desktop (large) If the application supports multiple languages (i18n properties), then the language text can be changed on the fly Mobile devices, e.g. iPad (medium), iPhone (small), Android, etc. Define a custom size The application is responsive – will adapt its appearance to the screen size Multiple screen sizes are predefined QR Code generation A QR Code is generated for the URL by clicking the rectangle Orientation The orientation of the screen can be toggled between landscape and portrait view Refresh The application can be reloaded without needing to rerun it from the development environment © 2016 SAP SE or an SAP affiliate company. All rights reserved. 26 Run configurations Create Develop Test Deploy You can configure how to run the application in the application’s project settings: Application file path to the file that is used to run the application Run the application preview with or without frame Open the application with mock data Application resource mapping, i.e. where to search for application resources Application URL Parameters: name = value Application File Path Frame Mock Data Application Resource Mapping Application URL Parameters Web application x x x x x Unit Test x SAP Fiori Component x x x x © 2016 SAP SE or an SAP affiliate company. All rights reserved. x 27 Run the application with mock data Create Develop Test Deploy You can run the application with mock data, e.g. in case your backend systems are not ready or not available The following options are available: Let the mock service generate data on-the-fly Let the mock service generate data that is stored in the workspace as JSON files Provide data in a JSON file Edit Mock Data allows to create or edit a mock data JSON file © 2016 SAP SE or an SAP affiliate company. All rights reserved. Project Settings: 28 Deploy the application Create Develop Test Deploy Multiple options are available for the developer to deploy a new application or update an existing application on the target system: Deploy an application to SAP HANA Cloud Platform (HCP) Deploy an application to the SAPUI5 ABAP Repository, e.g. SAP Gateway, SAP Fiori front-end server Deploy an application to SAP Enterprise Portal Deploy a hybrid mobile application to the HCPms / SMP Application Status Check if your application has been deployed to HCP.or SAPUI5 ABAP Repository If not, you may directly deploy from here. Additional options are available for HCP: Check if your application has been registered to SAP Fiori launchpad Register the application to SAP Fiori launchpad – Once registration is complete, a new tile is created in SAP Fiori launchpad, assigned to a group (optional), category, and content package © 2016 SAP SE or an SAP affiliate company. All rights reserved. 29 Deploy to SAPUI5 ABAP repository Create Develop Test Deploy 2 • • Deploy as a new application • Update an existing application 1 © 2016 SAP SE or an SAP affiliate company. All rights reserved. If it requires transport, select a transport request. The request ID will be automatically generated. 3 30 Deploy to HANA Cloud Platform Create Develop Test Deploy 2 1 • Deploy as a new application or as an update to an existing app • Select account to deploy to • Select if to commit&push to HCP Git • Define the version number • You may define to automatically active the application on HCP 3 Application Status • Once the application is successfully deployed, you may • check the application status: State, Versions, Active version • Register the app to SAP Fiori launchpad © 2016 SAP SE or an SAP affiliate company. All rights reserved. 31 Extending SAP Fiori applications SAP Fiori extensibility example SAP Delivered Standard Application Custom Application (extending standard) New Field New Function Hide Control © 2016 SAP SE or an SAP affiliate company. All rights reserved. 33 New extensibility project Create Develop Test Deploy When creating a new extension project, you need to identify the parent SAP Fiori/SAPUI5 application being extended File > New > Extension Project Three options. Either: 1. Parent app is from ABAP repository 2. Parent app is from HCP 3. Parent app is from your Workspace Option to import the original application Option to open the extension project in the extensibility pane after project generation © 2016 SAP SE or an SAP affiliate company. All rights reserved. The tool creates the extension project in your workspace and generates the files such as Component.js index.html Etc. 34 Visual extensibility While running the app, you can select an element either in the Outline pane or directly in the app when in Extensibility mode Create Preview/Extensibility mode Develop Test Deploy Language If the application supports multiple languages (i18n properties), then the language text can be changed on the fly Appropriate extension options can be chosen Application can get data online from backend or use mock data Show all application elements, or filter by extensible or extended elements Outline pane shows the UI elements available in the application, as well as extension points and UI controller hooks © 2016 SAP SE or an SAP affiliate company. All rights reserved. 35 Extensibility by means of a template Create Develop Test Deploy The template for extending an SAP Fiori resp. SAPUI5 app guides the user through a step-by-step process All extension options of the SAP Fiori / SAPUI5 extensibility concept are provided in the template: Create extension project Extend controller Hide a control Extend a view or fragment Replace a view Replace a service Customize text of i18n resources Implement a UI controller hook Add new views to existing project To add a new extension, select the extension project and choose one of the available templates © 2016 SAP SE or an SAP affiliate company. All rights reserved. 36 SAP Web IDE releases SAP Web IDE Releases 2014 JUN AUG SEP OCT NOV DEC 1.0 1.2 1.3 1.4 1.5 1.6 2014 Initial release to HCP Trial at SAPPHIRE • Additional external plugins (VizPacker, HANA Cloud Portal) • Sample applications Name changed: SAP Web IDE • Predefined URL parameters • Extend apps on HCP • Other enhancements • Edit mock data • Personalization Only on Trial: • Layout Editor (experimental) SAP River RDE First release to HCP for productive use • © 2016 SAP SE or an SAP affiliate company. All rights reserved. SAPUI5 ABAP repository integration • Plugin development • Other enhancements • Fact Sheets • Local installation (via SCN) • Other enhancements • Activate app in HCP • HCP auto-subscription of SAP Web IDE • Search/open documents • Other enhancements 38 SAP Web IDE Releases 2015 JAN MAR APR MAY 1.10 1.11 JUN JUL 1.12 1.13 2015 1.7 • • Hybrid App Toolkit App registration to SAP Fiori launchpad • Add custom content at Finish • Generate pseudotranslation • 1.8 1.9 • • SAP Fiori Full Screen template UI control hooks • Application status page • Defining languages • Code check levels • Defining run configuration • XML and CSS beautifier • Code snippets in extension project fragments • • • Option to fetch mock data recourses from other projects Extensibility enhancements and Fragment support • Menu link to HCP Cockpit • Code editor enhancements • Other enhancements • Other enhancements © 2016 SAP SE or an SAP affiliate company. All rights reserved. • Layout Editor with enhancements for productive use • Configurable library versions Tab navigation • Hiding workspace Other enhancements • Git stash • Other enhancements • Welcome page • Performing actions on multiple items • Syntax validation for XML • Beautification of JSON • • JavaScript validator • • Code completion for property files • Context menu support for code editors • Configuring how to run unit tests • Other enhancements • • New Deploy menu Feedback form • API Management integration Access to SAP HANA Cloud UI Theme Designer • SAP Event Management Plugin • Layout Editor canvas view in different sizes, undo/redo, additional controls • Other enhancements Other enhancements 39 SAP Web IDE Releases 2015 (continued) AUG SEPT OCT 1.14 1.15 1.16 Nov Dec Dec 1.17 1.18 1.19 2015 • JSDoc comment generation • URL fragment identifier (hash fragment) in Run Configurations • • • • • Application build (minification, etc.) Other enhancements Cross-file navigation for function definition and code completion Embedded type code completion German keyboard shortcuts for toggle comments actions • Layout Editor: quick start application • Run menu options changed • • Improved UI (facelift) • • • Application Descriptor Editor of manifest.json Smart Template application template New templates category: “Featured Templates” • Application status • • Annotation modeler plugin Deployment to multiple accounts • Extending application with multiple Component.js • URL parameters when running Extensibility Pane • SAP Enterprise Portal (EP) plugin • SAP Fiori overview page plugin (productive) • • • Application Destination Mapping Overview Page plugin (experimental) Run configuration without a frame by default • Git: multiple local branches • Application build: creates resources.json • Other enhancements HAT enhancements • Run configuration with a specific SAPUI5 version • Cross-file code completion • Other enhancements • • • Problems view • New templates category: “Favorites Templates” • CRUD template • Hide/show hidden files • Validation of application Descriptor (manifest.json) • Show all extension points in an application from the Extensibility Pane • Layout Editor toolbar (device format view, expand/collapse Layout Editor enhancements: the left/right pane, undo/redo Add controls from outline, actions) cut/copy/paste • Improved Run Configurations Other enhancements UI (facelift) • © 2016 SAP SE or an SAP affiliate company. All rights reserved. Other enhancements 40 SAP Web IDE Releases 2016 (continued) Jan Feb Mar Apr May 1601 1602 1603 1604 1605 2016 • New versioning concept • • Tips and Tricks dialog on SAP Web IDE startup SAP Fiori validators for XML and JavaScript • • Code completion and snippets for OPA and QUnit tests SAP Translation Hub Integration (experimental) • Workspace toolbar: collapse all projects, open resource and more • XML semantic validations, including deprecation • Decoupling Git from Deployment • Code checking prior to Push • • Application performance measurement testing XML semantic validations include deprecation warnings • Keyboard shortcut customization Problem view includes XML semantic validation issues • Outline pane reflects the function assignment names of anonymous functions assigned to variables • • • Keyboard shortcuts to move between code editor tabs Deployment is decoupled from Git Create an event function from the Layout Editor • Improved Run Configurations UI (facelift) • Other enhancements • • • • Sorting wizard elements, e.g. templates, according to most recently used Code completion suggestions for SAPUI5 static and instance methods Layout Editor supports SAPUI5 semantic pages and buttons • • Compare two commits of the same file • Other enhancements • Customize additional settings of the code editor, e.g. highlighting of all occurrences of a selected word, new themes, etc. • Other enhancements Other enhancements © 2016 SAP SE or an SAP affiliate company. All rights reserved. • Notification Alerts • Selecting “Run Configuration” in Global Toolbar • Duplicating an existing run configuration for editing • Close all tabs to the right • Customizing code editor font • Code completion icons aligned with SAPUI5 Demo Kit • Other enhancements 41 System components The Big Picture SAPUI5 apps SAP Fiori apps Data Sources Plugins Hybrid App Toolkit External services SAP Gateway (OData services) Templates OData Model Editor Plugins SAP Web IDE Data Sources SAP HANA XS (OData services) Overview page REST services VizPacker Git HANA Cloud Platform (HCP) © 2016 SAP SE or an SAP affiliate company. All rights reserved. 43 System overview for SAP HANA Cloud Platform SAP HANA Cloud Platform Cockpit Developer/ Designer/ Functional Specialist SAP Web IDE Orion Internet / Cloud Corporate Network / Intranet Git (App Projects) SAPUI5 Version Application User Permanent File System HTTPS SAP HANA Cloud Connector Windows OS Linux OS Mac OS X (all 64-bit) HTTP(S) SAP Gateway Trusted RFC For more details: SAP Web IDE Developer Guide © 2016 SAP SE or an SAP affiliate company. All rights reserved. Business Suite / ERP 44 Connecting Cloud Applications with On-Premise Systems Accessing on-premise systems from the cloud can be achieved in two ways: Usage of SAP HANA Cloud Connector as on-premise agent HTTPS On-Premise SAP Cloud Firewall Proxy Application Connector SSL Firewall VPN DMZ HANA Cloud Platform Public Internet Reverse proxy approach On-Premise HANA Cloud Platform SAP Application Firewall Proxy DMZ Firewall Public Internet © 2016 SAP SE or an SAP affiliate company. All rights reserved. + – + – on-premise systems not reachable from Internet, easy setup and configuration additional on-premise component existing network infrastructure can be used configuration of DMZ and firewall needed, attacks from Internet possible, not all protocols can be supported 45 SAP HANA Cloud Connectivity Service Secure Integration with the SAP Web IDE, Business Suite, and Other On-Premise Systems SAP Web IDE Destinations Cloud Establishes secure SSL tunnel between the SAP HANA Cloud and on-premise systems Connectivity created by on-premise agent through reverseinvoke process Supports pre-configured “Destination API” and certificate inspection to safeguard against forgeries Complementary to SAP Gateway, SAP HANA Cloud Integration and 3rd party integration suites both on-premise and in the cloud (on-demand) Internet Customer (on-premise) SAP HANA Cloud Connector ERP NW Gateway Others © 2016 SAP SE or an SAP affiliate company. All rights reserved. For more information on SAP Cloud Connector please refer to whitepaper http://scn.sap.com/docs/DOC-60903 46 Running HTML5 Apps on SAP HANA Cloud Platform SAP HANA Cloud Platform account SAP Web IDE in browser SAP Web IDE Deploy HTML5 Apps Dispatcher Application Push / Fetch Orion Git (App Projects) OData User Workspace OData Internet / Cloud Corporate Network / Intranet HTTPS SAP Gateway Via Cloud Connector Trusted RFC Business Suite / ERP For more details: SAP Web IDE Developer Guide © 2016 SAP SE or an SAP affiliate company. All rights reserved. 47 Running HTML5 Apps on SAP Gateway SAP HANA Cloud Platform SAP Web IDE SAP Web IDE Push / Fetch Orion OData Git (App Projects) User Workspace Deploy Internet / Cloud Corporate Network / Intranet HTTPS SAP Gateway Via Cloud Connector Trusted RFC Application Business Suite / ERP For more details: SAP Web IDE Developer Guide © 2016 SAP SE or an SAP affiliate company. All rights reserved. 48 Project persistency by using Git What is Git? Git is a widely used version control and source code management system that records snapshots of all your files over time. Most popular version control system for software development – Used by several major open source projects (Eclipse,…) Distributed and independent of network, user works offline (contrary to ABAP) No exclusive locking but conflict detection & powerful merge algorithms/tools Powerful branching options allow to develop several things independently Version control system Distributed versioning Created 2005 for Linux kernel development Enables collaborative workflows SAP Web IDE has a built-in Git client © 2016 SAP SE or an SAP affiliate company. All rights reserved. 50 SAP Web IDE and Git Integration SAP Web IDE includes integration with the Git source control system, via its built-in Git client The SAP Web IDE Git Client can work with HCP Git and with any public Git server (e.g. GitHub, Bitbucket) SAP Web IDE provides a graphical user interface for executing Git commands and managing your source control and versioning – Git Pane for common commands – Git History Pane for additional commands Conflict resolution - graphical Git Rebase Interactive using integrated compare editor © 2016 SAP SE or an SAP affiliate company. All rights reserved. 51 Git on HANA Cloud Platform used by SAP Web IDE Source code is stored in Git repositories 1 Every developer has a local clone of a central remote repository – Clone is only executed initially to create the local Git repository – If clone is executed again, then local Git repository will be overridden 2 A specific state of the repository is checked out into the developer’s workspace 3 Changes are collected in commits (≅ ABAP transport) 4 Commits can be pushed to and fetched from the remote repository Git allows to branch or the merge branches at any time © 2016 SAP SE or an SAP affiliate company. All rights reserved. SAP HANA Cloud Platform Remote Git Repository Clone Fetch 1 Push 4 Checkout Workspace 2 Files 3 Local Git Repository Commit 52 Additional information Useful links SAP Web IDE SAPUI5 SAP Web IDE at SAP Store: SAPUI5 Developer Center- Demo Kit (interactive doc on SAPUI5 / OpenUI5): https://www.sapstore.com/solutions/60009/Web-IDE SAP HANA Cloud Platform: http://hcp.sap.com/index.html SAP HANA Cloud Platform trial: https://sapui5.hana.ondemand.com/sdk/ OpenUI5: http://sap.github.io/openui5/ https://account.hanatrial.ondemand.com/ Official documentation: https://help.hana.ondemand.com/webide/frameset.htm under Platform Solutions choose SAP SAP Web IDE Documentation within SAP Web IDE: Go to SAP Web IDE Welcome page SCN (SAP Community Network) SAPUI5 & SAP Web IDE: http://scn.sap.com/community/developer-center/front-end All Things SAP Fiori: http://scn.sap.com/docs/DOC-41598 SAP for Mobile: Additional related information to SAP Web IDE http://scn.sap.com/community/mobile SAP HANA Cloud Platform: https://help.hana.ondemand.com/ Go to SAP HANA Cloud Platform > Getting Started SAP HANA Cloud Connector: https://help.hana.ondemand.com/help/frameset.htm?e6c7616abb5710148cfcf3e 75d96d596.html SAP Gateway: http://help.sap.com/nwgateway20 © 2016 SAP SE or an SAP affiliate company. All rights reserved. 54 Thank you Contact information: Raz Korn SAP Web IDE Product Manager raz.korn@sap.com