You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/advanced/technical/dx.md
+32-35Lines changed: 32 additions & 35 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,12 @@
1
-
# Developer Experience: Keeping Things Simple
1
+
# From WRITE to UI5: What Shaped abap2UI5
2
2
3
-
Developer Experience (DX) describes how efficient and intuitive it is to develop with a given framework and its tools.
3
+
abap2UI5 is a browser-based UI framework written entirely in ABAP. It is shaped by familiar ABAP patterns that emphasize simplicity, readability, and backend-driven development. In addition, it aims to address common pain points in everyday developer work — such as deployment complexity, caching issues, and tooling overhead.
4
4
5
-
Good DX means writing code is fast, testing is immediate, and tooling doesn’t get in the way. It requires minimal boilerplate, supports easy debugging and enables quick deployment with code that’s easy to reuse and share.
6
-
7
-
This page highlights ABAP patterns that promote strong DX and how they influenced the APIs of abap2UI5.
5
+
This page highlights the key concepts and influences behind the design of abap2UI5.
8
6
9
7
### API I: Output via `IF_OO_ADT_CLASSRUN`
10
8
11
-
One of the most fundamental development tasks is outputting data. In ABAP, the cleanest way to do this is with the `if_oo_adt_classrun` interface. It offers a simple, class-based approach immediatly outputting data into ADT:
9
+
One of the most fundamental development tasks is outputting data. In ABAP, the cleanest way to do this is with the `if_oo_adt_classrun` interface. It offers a simple, class-based approach to immediately output data in ADT:
12
10
13
11
```abap
14
12
CLASS zcl_app_adt DEFINITION PUBLIC CREATE PUBLIC.
@@ -23,13 +21,12 @@ CLASS zcl_app_adt IMPLEMENTATION.
23
21
ENDCLASS.
24
22
```
25
23
26
-
Why this improves Developer Experience:
27
-
- The entire app lives in a single file — fast to navigate, easy to debug
28
-
- No boilerplate: just a class and one method
29
-
- Works identically in `ABAP Cloud` and `Standard ABAP`
30
-
- abapGit compatible for versioning and sharing
24
+
Why it matters:
25
+
- Single-class design is easy to debug and version
26
+
- Minimal boilerplate, cloud-compatible
27
+
- Fully abapGit-ready
31
28
32
-
This simple design inspired abap2UI5. Here's the equivalent functionality implemented in abap2UI5:
29
+
This simplicity inspired the entry point for abap2UI5 apps:
33
30
```abap
34
31
CLASS zcl_app_ui5 DEFINITION PUBLIC CREATE PUBLIC .
35
32
PUBLIC SECTION.
@@ -43,28 +40,27 @@ CLASS zcl_app_ui5 IMPLEMENTATION.
43
40
ENDCLASS.
44
41
```
45
42
46
-
Additional Benefits in abap2UI5:
47
-
- Runs in any browser — no ADT installation required
48
-
- Accessible by end users
49
-
- Output uses UI5 beeing conform to SAP Fiori Design guidelines
50
-
43
+
Additional in abap2UI5:
44
+
- Runs in the browser, no ADT needed
45
+
- End-user ready without extra deployment
46
+
- Conform to SAP Fiori Design guidelines
51
47
52
48
### API II: Input with Selection Screen
53
49
54
-
Traditional ABAP offers a fast way to collect user input using selection screens:
50
+
Classic ABAP supports user input through selection screens:
55
51
56
52
```abap
57
53
REPORT zre_app_input.
58
54
PARAMETERS pa_arbgb TYPE t100-arbgb DEFAULT 'MDG_TR'.
59
55
START-OF-SELECTION.
60
56
MESSAGE |Input: { pa_arbgb }| type 'I'.
61
57
```
62
-
Benefits:
63
-
* Data Transfer with inputs
64
-
* events and buttons
65
-
* fullstack application (already deployt) with 4 lines
58
+
Why it matters:
59
+
- Rapid prototyping with minimal code
60
+
- Built-in input validation and events
61
+
- Fullstack behavior with no setup
66
62
67
-
abap2UI5 brings this concept into the browser:
63
+
abap2UI5 brings this idea into the browser using an XML view builder and data binding:
68
64
```abap
69
65
CLASS zcl_app_input DEFINITION PUBLIC CREATE PUBLIC.
70
66
PUBLIC SECTION.
@@ -95,7 +91,7 @@ Why this improves Developer Experience:
95
91
96
92
### API III: Output Tables with ABAP List Viewer
97
93
98
-
CL_SALV_TABLE brought major productivity gains to classic ABAP:
94
+
ALV tools such as `CL_SALV_TABLE` helped make tabular output effortless:
99
95
100
96
```abap
101
97
REPORT zre_app_alv.
@@ -112,12 +108,14 @@ cl_salv_table=>factory(
112
108
t_table = gt_t100 ).
113
109
go_salv->display( ).
114
110
```
115
-
Benefits:
116
-
* Table output with a single method calls
117
-
* generic table input, ui is generated out of an internal table
118
-
* no additonal cds artifacts needed
119
111
120
-
abap2UI5 brings this benefits into the browser:
112
+
Why it matters:
113
+
- Generates full UI from internal tables
114
+
- No external annotations or CDS needed
115
+
- Ideal for admin tools and quick overviews
116
+
117
+
abap2UI5 brings this to the browser:
118
+
121
119
```abap
122
120
CLASS zcl_app_alv DEFINITION PUBLIC.
123
121
PUBLIC SECTION.
@@ -150,12 +148,11 @@ CLASS zcl_app_alv IMPLEMENTATION.
150
148
ENDMETHOD.
151
149
ENDCLASS.
152
150
```
153
-
154
151
Additional Benefits in abap2UI5:
155
152
- Fully works in browser and on any device, no SAP GUI dependencies
156
153
157
154
### API IV: popup_to_confirm
158
-
Classic ABAP uses `POPUP_TO_CONFIRM` for simple decisions:
155
+
Classic ABAP offered a straightforward way to ask user decisions:
159
156
160
157
```abap
161
158
REPORT zre_app_alv.
@@ -210,12 +207,12 @@ CLASS zcl_app_alv_event IMPLEMENTATION.
210
207
ENDCLASS.
211
208
```
212
209
213
-
Why this improves Developer Experience:
210
+
Why it matters:
214
211
- Dialog logic stays class-based and readable
215
212
- UI and logic stay in sync
216
213
- The flow mimics classic ABAP screen logic with modern UI5 behavior
217
214
218
-
### Deployment
215
+
### Deployment Simplicity
219
216
220
217
One aspect of Developer Experience is deployment. Even a beautifully written app is frustrating if it’s hard to ship. In abap2UI5, apps are just ABAP classes — deployment is as simple as activating the class. Transport to production happens via the standard TOC system known from traditional ABAP workflows.
221
218
@@ -224,7 +221,7 @@ Why this improves Developer Experience:
224
221
- Code changes can be instantly tested by developers or consultants
225
222
- Every app is abapGit-compatible — no separate artifacts required
226
223
227
-
### Cache
224
+
### No UI Cache
228
225
229
226
A common frustration in SAP frontend development is UI caching — especially with BSP or Fiori Elements apps. You make a change, but nothing happens due to cached files. abap2UI5 avoids this problem entirely by not caching any UI definitions. The UI is dynamically generated on every request.
230
227
@@ -240,7 +237,7 @@ Why this improves Developer Experience:
240
237
- No additional setup required — works in any ABAP system
241
238
- Ideal for teams already experienced with ABAP
242
239
243
-
### Debugging
240
+
### Debugging Made Simple
244
241
245
242
Frontend-heavy applications often require jumping between browser dev tools, JavaScript logs, and network inspectors. With abap2UI5, the UI is pure ABAP — no JavaScript, no additional layers. Set a breakpoint in the ABAP method and you’re done.
0 commit comments