You will learn
Learn how to import a completed and published prototype from BUILD into SAP Web IDE. This will help you convert your prototype into a live application. This will be your guide or template for creating the real UI5/Fiori version.
Import your TechEd BUILD project into SAP Web IDE
Previous
Next
Import your TechEd BUILD project into SAP Web IDE
Once your prototype is complete, you can import it as a template into SAP Web IDE to convert it to UI5 code
Details
Please note that an imported BUILD prototype should not be used for a production application. The version of BUILD used in these tutorials is for prototyping and designing purposes only. The code generated is not optimized for performance and security. Stay tuned to BUILD for updates about BUILD Apps, a drag and drop tool to create production ready applications!
Step 1: Enable BUILD Services
Open your SAP Cloud Platform account.
In your SAP Cloud Platform cockpit, go to the Services.
In the Search Bar, search for BUILD.
Click on the BUILD service tile under the User Experience section.
Enable the service.
×
Step 2: Enable SAP Web IDE
If you haven’t enabled SAP Web IDE yet, you will need to do that as well.
In Services, search for Web IDE.
Click on the SAP Web IDE tile and enable the service.
Step 3: Import the destinations
Download the four destinations files by right clicking and selecting Save As for each of the files.
In your SAP Cloud Platform cockpit, under Connectivity, select Destinations.
You can import each of the downloaded destination files. To import, select Import Destination.
Choose the BUILD_Production* file. Click Save.
Select Import Destination again. Choose the sapui5-private destination. Click Save.
Select Import Destination again. Choose the sapui5-private-build destination. Click Save.
Select Import Destination again. Choose the Web_IDE_PLUGIN destination. Click Save.
Step 4: Open SAP Web IDE
In your SAP Cloud Platform cockpit, navigate back to Services.
Locate the SAP Web IDE service and Go to Service.
This will launch your SAP Web IDE.
Step 5: Enable the BUILD plugin
In your SAP Web IDE, click on the Gear Icon to open the preferences view.
Select Plugins.
In the drop down menu, select BUILD Destinations. Enable the Import from BUILD plugin by clicking the switch on the right hand side.
Click Save.
Your SAP Web IDE will refresh. Click Refresh.
Step 6: Create a new project
Go back to the code view by clicking the angle brackets icon (</>).
In the code view, create a new project by selecting File > New > Project from Template.
Under the Category drop down, select BUILD Project. Select the BUILD Project tile. Click Next.
Step 7: Name the project
In the Name field, enter te2017frontend. Click Next.
When prompted, enter your BUILD Username and Password. This will be your email address and password you used when signing up for BUILD in the previous tutorial.
SAP EMPLOYEES: If you are an SAP Employee, your SSO password will not work. To continue, you must follow the directions to reset your BUILD password. You are NOT resetting your SSO password, just the password to access BUILD. If you have followed the above steps and you are still unable to login, you can alternatively download the project from Build and import into SAP Web IDE.
Step 8: Select a project to import
If you successfully logged in, you will see a list of your prototypes that you can import. Under the BUILD System Information, select standard.
Select Inventory Dashboard from the list of prototypes available. You always want to only import High Fidelity prototypes.
Click Finish.
A new project will be created in your workspace.
Step 9: Run your application
Right click on your project name.
From the menu options, select Run > Run as > Web Application.
If prompted, select testFLPService.html as the file to run. Click OK.
Your application is now running on SAPUI5!
×