If your ABAP System is not externally visible, it does not mean that you can not use Web IDE for your development. Of course, you can not directly connect to you system to consume OData and deploy your Fiori Application. In my blog I will explain how to walk-around both these limitations.
Create EDMX file in Web IDE
Copy OData Service metadata from ABAP System Gateway Client (trx. IWFND/GW_CLIENT) into clipboard. Create edmx file in Web IDE pasting content of metadata document from clipboard (do not forget to remove collapsing -)
Create Application in Web IDE using EDMX file
In Web IDE generate application from Work List template using edmx file from previous step
Run Application with Web IDE Using Mock Data
Copy Real Data from ABAP Server to Web IDE JSON File
It is also possible to copy real data from ABAP server over to Web IDE and test the application with real data. In Gateway Client (trx. IWFND/GW_CLIENT) display Products entity data in json format ($format=json parameter) and copy it in clipboard. In Web IDE create mockdata folder under localService forlder. Inside mockdata folder create Products.json file and paste content of Products entity set from clipboard.
Run Application in Web IDE with Real Data Copied from ABAP Server
Update manifest.json to with OData Service URI
Copy OData service URI from local ABAP server Gateway Client (trx. IWFND/GW_CLIENT) and paste into manifest.json file mainService uri setting
Export Application from Web IDE
Open zip archive and remane webapp folder to WebContent
Exported file is a ZGW_PRODUCT.zip archive. Create ZGW_PRODUCT directory and copy content of the archive into ZGW_PRODUCT directory. Rename webapp directory into WebContent
Upload the Fiori Application to local ABAP Server using /UI5/UI5_REPOSITORY_LOAD program
Select ZGW_PRODUCT folder and click OK, confirm upload clicking on link, then finally give application a description and confirm upload.
If upload /UI5/UI5_REPOSITORY_LOAD program dumps like this
apply OSS Note 2287821 – Shortdump in Program /UI5/APP_INDEX_CALCULATE
You might also get following message during application upload due to missing application descriptor attributes
Make sure that following attributes are there in the manifest.json file:
It is important to upload application without error in order to register loaded component. Attached is an example of manifest.json with missing attributes added
Run the application from local ABAP Server
In Service Maintenance (trx. SICF) find ZGW_PRODUCT service and select Test Service from context menu
If application changes are required they can be done in Web IDE and changed application upload to local ABAP Server as described above. Only you need to take care of clearing cache: in BEP (trx. /IWBEP/CACHE_CLEANUP), in FND (trx. /IWFND/CACHE_CLEANUP) and in browser.
In my next blog I will demonstrate how to configure Fiori Launchpad for Custom Fiori Application.
See also useful blog on Personal WebIDE installation