Skip to content

Commit e23e3c4

Browse files
aplata-sapaplata-sap
committed
Merge remote-tracking branch 'refs/remotes/SAPDocuments/master'
2 parents 66c2cd7 + 1dd2bef commit e23e3c4

7 files changed

Lines changed: 67 additions & 56 deletions

File tree

‎tutorials/sapui5-create-api-destination/sapui5-create-api-destination.md‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
title: Create a Destination for an External API (Slack)
33
description: Create a destination in SAP Cloud Platform to connect with an external API
44
primary_tag: topic>sapui5
5+
auto_validation: true
56
tags: [ tutorial>beginner, topic>sapui5, products>sap-cloud-platform ]
67
---
78
## Prerequisites
@@ -25,23 +26,23 @@ You will create a destination in your SAP Cloud Platform that will connect you t
2526
[ACCORDION-BEGIN [Step 1: ](Open SAP Cloud Platform)]
2627
Go to your [SAP Cloud Platform Cockpit trial](https://account.hanatrial.ondemand.com/cockpit) instance and login.
2728

28-
29+
[DONE]
2930
[ACCORDION-END]
3031

3132
[ACCORDION-BEGIN [Step 2: ](Open the Destinations page)]
3233
Open the **Destinations** page found under the Connectivity section on the left-side navigation.
3334

3435
![Destination location in HCP](destinations.png)
3536

36-
37+
[DONE]
3738
[ACCORDION-END]
3839

3940
[ACCORDION-BEGIN [Step 3: ](Create a new destination)]
4041
Select **New Destination**.
4142

4243
![New Destination button in HCP](destinations-new.png)
4344

44-
45+
[DONE]
4546
[ACCORDION-END]
4647

4748
[ACCORDION-BEGIN [Step 4: ](Enter new destination details)]
@@ -68,7 +69,7 @@ Add _two_ Additional Properties fields by clicking on the **New Property** butto
6869
![Destination details for Fitbit API](destinations-details.png)
6970

7071

71-
72+
[DONE]
7273
[ACCORDION-END]
7374

7475
[ACCORDION-BEGIN [Step 5: ](Verify your destination works)]
@@ -78,7 +79,7 @@ Check the connection to verify you set up the destination properly and that SAP
7879

7980
![Destination check connection success message](destinations-success.png)
8081

81-
82+
[VALIDATE_5]
8283
[ACCORDION-END]
8384

8485
### Optional
@@ -133,7 +134,7 @@ See some other examples below of destination details for other APIs.
133134

134135

135136

136-
137+
[DONE]
137138
[ACCORDION-END]
138139

139140
## Next Steps

‎tutorials/sapui5-insert-rest-api/sapui5-insert-rest-api.md‎

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
title: Add an External API call to your app (Slack)
33
description: Call an external API and display the data in a table
44
primary_tag: topic>sapui5
5+
auto_validation: true
56
tags: [ tutorial>beginner, topic>html5, topic>sapui5, products>sap-cloud-platform, products>sap-web-ide ]
67
---
78
## Prerequisites
@@ -22,10 +23,10 @@ In this tutorial, you will either create a new app or modify an existing app you
2223

2324
---
2425

25-
[ACCORDION-BEGIN [Step 1: ](Create or open an application in WebIDE)]
26+
[ACCORDION-BEGIN [Step 1: ](Create or open an application in SAP Web IDE)]
2627
If you already have an app created that you want to add external API data to, feel free to use that app. Go to your Web IDE, and open that application's folder. **If you already have an application you want to use, go on to Step 2 in this tutorial**.
2728

28-
If you need to create a new application for your external API, use the Project from Template feature in Web IDE. In your Web IDE, click `File > New > Project from Template`.
29+
If you need to create a new application for your external API, use the Project from Template feature in SAP Web IDE. In your SAP Web IDE, click `File > New > Project from Template`.
2930

3031
![creating a new project from template in WebIDE](create-new.png)
3132

@@ -37,7 +38,7 @@ Name the application `slack_app`. Click **Finish**.
3738

3839
![adding the name to the application](app-naming.png)
3940

40-
41+
[DONE]
4142
[ACCORDION-END]
4243

4344
[ACCORDION-BEGIN [Step 2: ](Open the neo-app.json file)]
@@ -65,9 +66,9 @@ If you created a new application, your `neo-app.json` should match the image bel
6566

6667
**SAVE** your changes.
6768

68-
> If you have not refreshed your Web IDE since you added the new Slack destination to your SAP Cloud Platform trial account, please do so now. Web IDE needs to be refreshed before being able to run your application with a new destination.
69-
69+
> If you have not refreshed your SAP Web IDE since you added the new Slack destination to your SAP Cloud Platform trial account, please do so now. SAP Web IDE needs to be refreshed before being able to run your application with a new destination.
7070
71+
[DONE]
7172
[ACCORDION-END]
7273

7374
[ACCORDION-BEGIN [Step 3: ](Add a table to display data in the XML View)]
@@ -103,7 +104,7 @@ Add a table to your view in between the `<content>` tags. You will bind a model
103104

104105
**SAVE** your changes.
105106

106-
107+
[VALIDATE_3]
107108
[ACCORDION-END]
108109

109110
[ACCORDION-BEGIN [Step 4: ](Update the controller to set model)]
@@ -140,7 +141,7 @@ You will now create an `onInit` function for your controller. In this function,
140141

141142
**SAVE** your changes.
142143

143-
144+
[DONE]
144145
[ACCORDION-END]
145146

146147
[ACCORDION-BEGIN [Step 5: ](Setup a function for the API call)]
@@ -172,7 +173,7 @@ Replace `YOUR_CHANNEL_ID` and `YOUR_TOKEN` with the values from your Slack API.
172173

173174
**SAVE** your changes.
174175

175-
176+
[DONE]
176177
[ACCORDION-END]
177178

178179
[ACCORDION-BEGIN [Step 6: ](Add Slack API call)]
@@ -209,7 +210,7 @@ You have `done` and `failure` functions defined as part of the AJAX call. If the
209210

210211
**SAVE** your changes.
211212

212-
213+
[DONE]
213214
[ACCORDION-END]
214215

215216
[ACCORDION-BEGIN [Step 7: ](Call your load function)]
@@ -225,7 +226,7 @@ Back in your `onInit` function, add the following call at the end of the functio
225226

226227
**SAVE** your changes.
227228

228-
229+
[DONE]
229230
[ACCORDION-END]
230231

231232
[ACCORDION-BEGIN [Step 8: ](Run your application)]
@@ -237,7 +238,7 @@ If your Slack team or channel used for the API call is new, there won't be a who
237238

238239
![final application image for basic API integration](slack-app.png)
239240

240-
241+
[VALIDATE_8]
241242
[ACCORDION-END]
242243

243244
### Optional
@@ -266,7 +267,7 @@ $.ajax({
266267

267268
> Some networks block the header parameter in an AJAX. If you are seeing authentication or authorizations errors in your failure response, try testing the API with a service such as Postman. If Postman is able to successfully authenticate, it is most likely an issue with your network. Try again when you are able to access a less restrictive network or use the token parameter method of Authorization.
268269
269-
270+
[DONE]
270271
[ACCORDION-END]
271272

272273
## Next Steps

‎tutorials/sapui5-navigate-api/sapui5-navigate-api.md‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
title: Add navigation to your External API call (Slack)
33
description: Enable navigation to a detail view by selecting a message from the grid
44
primary_tag: topic>sapui5
5+
auto_validation: true
56
tags: [ tutorial>intermediate, topic>html5, topic>sapui5, products>sap-web-ide ]
67
---
78
## Prerequisites
@@ -39,8 +40,7 @@ On the Confirmation page, click **Finish**.
3940

4041
![finish creating the view](3-view.png)
4142

42-
43-
43+
[DONE]
4444
[ACCORDION-END]
4545

4646
[ACCORDION-BEGIN [Step 2: ](Add an Object Header to Detail)]
@@ -66,11 +66,11 @@ Finally, remove the the `<App>` and the lowercase `<pages>` tags from the Detail
6666

6767
**SAVE** your changes.
6868

69-
69+
[VALIDATE_2]
7070
[ACCORDION-END]
7171

7272
[ACCORDION-BEGIN [Step 3: ](Set up navigation properties)]
73-
In the `webapp` folder, open the`manifest.json` file.
73+
In the `webapp` folder, open the `manifest.json` file.
7474

7575
In the `sap.ui5` array, you need to define a new **routing** parameter, where you will define the configurations, routes, and targets for routing or navigation in the application.
7676

@@ -109,7 +109,7 @@ This will define what the relationship between the `View1` view and the `Detail`
109109

110110
**SAVE** your changes.
111111

112-
112+
[DONE]
113113
[ACCORDION-END]
114114

115115
[ACCORDION-BEGIN [Step 4: ](Add an App ID)]
@@ -124,7 +124,7 @@ Open the `View1.view.xml` file in the `webapp > view` folder. The `controlId` se
124124

125125
![XML for the main view with ID](5-view.png)
126126

127-
127+
[DONE]
128128
[ACCORDION-END]
129129

130130
[ACCORDION-BEGIN [Step 5: ](Initialize the router)]
@@ -140,7 +140,7 @@ You need to initialize the router for the application. Add this line of code to
140140

141141
![component updated code](2-nav.png)
142142

143-
143+
[DONE]
144144
[ACCORDION-END]
145145

146146
[ACCORDION-BEGIN [Step 5: ](Add navigation to the main view)]
@@ -158,7 +158,7 @@ You need to enable navigation in the table. Replace the `<ColumnListItem>` in th
158158

159159
![updated table code](3-nav.png)
160160

161-
161+
[DONE]
162162
[ACCORDION-END]
163163

164164
[ACCORDION-BEGIN [Step 6: ](Add navigation to the main controller)]
@@ -180,7 +180,7 @@ onPress: function (oEvent) {
180180

181181
![updated code for main controller](4-nav.png)
182182

183-
183+
[DONE]
184184
[ACCORDION-END]
185185

186186
[ACCORDION-BEGIN [Step 7: ](Add navigation to the detail controller)]
@@ -247,7 +247,7 @@ onNavBack: function () {
247247

248248
![updated code for detail controller](6-nav.png)
249249

250-
250+
[DONE]
251251
[ACCORDION-END]
252252

253253
[ACCORDION-BEGIN [Step 8: ](Add navigation to detail view)]
@@ -264,7 +264,7 @@ You need to update the `<Page>` attributes to allow for backwards navigation. Re
264264
![updated code for detail view with nav button](7-nav.png)
265265

266266

267-
267+
[DONE]
268268
[ACCORDION-END]
269269

270270
[ACCORDION-BEGIN [Step 9: ](Run your application)]
@@ -275,7 +275,7 @@ Make sure all your changes are saved and **RUN** your application.
275275
![final output of detail view with nav back](detail.png)
276276

277277

278-
278+
[VALIDATE_9]
279279
[ACCORDION-END]
280280

281281
## Next Steps

‎tutorials/sapui5-nested-api-calls/sapui5-nested-api-calls.md‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,15 @@
22
title: Call another method in the External API (Slack)
33
description: Find more information from an external API using a second method call
44
primary_tag: topic>sapui5
5+
auto_validation: true
56
tags: [ tutorial>intermediate, topic>html5, topic>sapui5, products>sap-web-ide ]
67
---
78
## Prerequisites
89
- **Proficiency:** Intermediate
910
- **Tutorials:** [Add navigation with your API call](https://www.sap.com/developer/tutorials/sapui5-navigate-api.html)
1011

1112
## Next Steps
13+
- This is the end of this series
1214
- Select a tutorial from the [Tutorial Navigator](https://www.sap.com/developer/tutorial-navigator.html) or the [Tutorial Catalog](https://www.sap.com/developer/tutorial-navigator.tutorials.html)
1315

1416
## Details
@@ -31,7 +33,7 @@ When you call the user method for a given user, you will have more information a
3133
![Slack user profile method documentation page](slack-1.png)
3234

3335

34-
36+
[DONE]
3537
[ACCORDION-END]
3638

3739
[ACCORDION-BEGIN [Step 2: ](Add a new call to your main controller)]
@@ -79,7 +81,7 @@ self.getView().getModel("messages").setProperty("/data", message);
7981

8082
![updated code in the main controller](controller-1.png)
8183

82-
84+
[DONE]
8385
[ACCORDION-END]
8486

8587
[ACCORDION-BEGIN [Step 3: ](Update the main view)]
@@ -96,17 +98,20 @@ Your `ObjectHeader` should resemble the screenshot below.
9698

9799
**SAVE** your changes.
98100

99-
101+
[DONE]
100102
[ACCORDION-END]
101103

102104
[ACCORDION-BEGIN [Step 4: ](Run your application)]
103105
Make sure all your changes are saved and **RUN** your application. You should now see that the names of the user messages are now displayed instead of blanks. In Slack, "users" are a bot's name and "usernames" refer to actual users in the system. To translate the Slack username into information your end user would understand, you would need data from the User Profile method. Feel free to add more user details to your application.
104106

105107
![application with user details displayed](final.png)
106108

109+
**Copy and paste the URL** of the running application into the text box below.
107110

111+
[VALIDATE_4]
108112
[ACCORDION-END]
109113

110114

111115
## Next Steps
116+
- This is the end of this series
112117
- Select a tutorial from the [Tutorial Navigator](https://www.sap.com/developer/tutorial-navigator.html) or the [Tutorial Catalog](https://www.sap.com/developer/tutorial-navigator.tutorials.html)

0 commit comments

Comments
 (0)