SAP UI Frameworks for Enterprise Developers: A Practical Guide

✍ Scribed by Marius Obert, Volker Buzek

• Publisher: Apress
• Tongue: English
• Leaves: 317
• Category: Library

✦ Synopsis

Dive into the world of SAP UIs and begin your journey to becoming a development expert. In this book, you will learn the latest cutting-edge web technologies and gain a comprehensive understanding of the user experience concept that undergirds the SAP Fiori design system. SAP UI Frameworks for Enterprise Developers is filled with hands-on tutorials that will guide you through every step of the development journey, from setting up your coding editor to building your first application using UI5, SAP Fiori Elements, UI5 Web Components, or Fundamental Library Styles. 

Authors Marius Obert and Volker Buzek understand that staying ahead in the rapidly evolving UI technology landscape can be challenging, so they’ve included insights into upcoming industry-wide trends and future innovations. This book will provide you with the knowledge and skills needed to build intuitive applications with an eye-catching, SAP Fiori-conforming user interface. Don’t miss this opportunity to take your UI development skills to the next level!

What You Will Learn

• Gain an overview of the technologies that can be used to implement enterprise-ready SAP Fiori UIs ready to be deployed in the cloud as well as on-premises
• Discover resources for connecting with domain experts to stay on top your game and learn about innovations in the SAP ecosystem
• Survey industry-wide technologies trends, like micro frontends and PWA, and relate these trends to both enterprise software and  new projects led by SAP

Who This Book Is For

This book is intended for anyone interested in building intuitive enterprise user interfaces with modern web technologies in the greater SAP universe.

✦ Table of Contents

Table of Contents
About the Authors
About the Technical Reviewer
Acknowledgments
Foreword
Introduction
Chapter 1: Enterprise User Interfaces
The SAP Journey in a Nutshell
To a Hammer, Everything Looks like a Nail
Consumer-Grade vs. Enterprise Readiness
Enterprise Software – Today and in the Future
A Note on Development Environments
Characteristics of an Enterprise-Grade Development Environment
Production Boosters
Looking Through the Frontend Lens
The SAP Fiori Design System
Summary
Chapter 2: Dual: SAPUI5 and OpenUI5
What Is SAPUI5?
Setting Up Your Workspace
Learning by Doing
Bootstrap the Project
Enrich the UI with More Controls
Build a Reusable and Consistent Header
Navigate to New Views
Show a List of Beers
Validate User Input
Debug the Code
Translate the User Interface
Build the Project
Make the App Robust
Test Scopes
Tests Help Realistic Work Estimates
Tests Make You a Better and More Relaxed Developer
Unit Tests
Integration Tests
End-to-End Tests
Deploy Continuously
Cut Locally, Move to Central
The @sap/approuter As the Central Module
The Road from Here
UI5 for Enterprise Applications
Chapter 3: Colossal: SAP Fiori Elements
What Is SAP Fiori Elements?
Introducing the Open Data Protocol
SAP Fiori Elements Configuration
Learning by Doing
Bootstrap the Project
Give It a Test Run
Filter the Data
Hide Irrelevant Columns
Autoload Data
A Header for Details
A Custom Fragment
Inspecting the Changes
Make the App Robust
OData v4 Test Library with OPA5
OData v4 Test Library with wdi5
CI and the OData v4 Test Library
Deploy Continuously
Include Parts of SAP Fiori Elements in UI5 Freestyle Apps
The Road from Here
SAP Fiori Elements for Enterprise Applications
Chapter 4: Standard: UI5 Web Components
What Are Web Components?
Setting Up Your Workspace
Learning by Doing
Bootstrap the Project
Install the UI5 Web Components Dependencies
Add More Components
Display Sample Data
Handle Form Submissions
Build
A Note on Debugging, Testing, and Deployment
Usage with SPA Frameworks
Usage in UI5
Usage in React
The Road from Here
UI5 Web Components for Enterprise Applications
Chapter 5: Elementary: Fundamental Library Styles
What Are Fundamental Library Styles?
Extending CSS
Setting Up Your Workspace
Learning by Doing
Copy the Existing Project
Add HTML Elements with Fundamental Styles
Integrate Fundamental Library Styles in Your Project
Clear the List
Bring the Form Back
Use Sass Mixins
Build and Deployment
The Road from Here
Fundamental Library Styles for Enterprise Applications
Chapter 6: Industry Trends Impacting SAP UI Technologies
Visual UI Development
Type Safety in the Frontend
Micro Frontends
GraphQL
Next-Gen Full-Stack Web Frameworks
Chapter 7: Staying on Top of the Ball
Meeting the Community in Real Life
SAP TechEd
SAP User Group Events
UI5con
SAP Stammtisch
SAP Inside Tracks
Joining the Community Virtually
SAP Community
YouTube
OpenSAP
Twitter & Co
Slack & Co
Stack Overflow
Mailing Lists
GitHub
The Journey Just Started
Index