Where are you?
You’re currently reading the second part of a four-part tutorial:
1. Create a Trial Account and Enable SAP Translation Hub.
2. Use SAP Web IDE to Create a Simple Fiori App and to Search for UI Texts.
3. Create a Translation Project and Translate Your Fiori App.
4. Change Your App and Start the Translation Process for Your Fiori App Again (Optional).
What’s this part of the tutorial about?
Now things get a little more interesting. We leave behind the preparation stuff and move on to cool things in SAP Web IDE, the development environment on SAP Cloud Platform. To make things a little easier, we’ve prepared an app that you can import straight into SAP Web IDE. The story then continues something like this:
- Once you’ve imported the app, you add a new text to the app by leveraging the lookup capabilities of SAP Translation Hub’s suggestion service.
Not only does this mean you can reuse existing texts, it also adds the text and ID to the properties file, which is a big help if you’re adding lots of texts.
- You then need to put your app’s project in a Git repository – to stick with one integrated platform, we show you how to use the Git repository in SAP Cloud Platform.
Now that you’re in the development environment, it’s time to grab the app that we prepared.
You can use any app for this part, but to save time, simply download our simple shop app to get started in no time at all.
|What You Need to Do||What You See|
Open the mysimpleshop folder on GitHub.
Choose View Raw and save the my_simple_shop.zip file in a folder that you will be able to locate easily. You’ll need to navigate to this folder in the next step.
|In SAP Web IDE, right-click Local, and choose Import -> From File System.|
Do the following:
Open theMy_simple_shop project that you imported in the previous step and locate the localindex.html file in the file structure on the left.
Right-click thelocalindex.html file, and choose Run –> Run with Mock Data.
A Fiori Web shop UI appears with some texts that you are going to translate in the subsequent exercises.
Note: You will translate the field labels (Image,Name, Description, and so on), not the texts that describe the actual content of the Web shop, such as Quality cables for notebooks and projects in this example.
Drill down to the product details by choosing any product in the list.
The field labels (Product ID, Description, and so on) that you see in the screenshot on the right are also texts that you will translate.
You have now imported a sample app into SAP Web IDE. You’re now going to add a text by using SAP Translation Hub’s suggestion service.
Now that you’ve added a new text to the app, you need to deploy the app to SAP Cloud platform and push the app files to the Git repository of SAP Cloud Platform.
The Bottom Line
That’s it for this part of the tutorial. You’ve imported a ready-made app into SAP Web IDE, added a text – complete with internationalization steps – to the app, and pushed the content of the app to the Git repository of SAP Cloud Platform.
Now it’s time to translate the app in Part 3: Create a Translation Project and Translate Your Fiori App.