skilld
All skills
secondsky avatar

/sapui5

@620a19a
by Eddiesecondsky/sap-skills456 stars
120

This skill should be used when developing SAP UI5 applications, including creating freestyle apps, Fiori Elements apps, custom controls, testing, data binding, OData integration, routing, and troubleshooting. Use when building enterprise web applications with SAP UI5 framework, implementing MVC patterns, configuring manifest.json, creating XML views, writing controllers, setting up data models (JSON, OData v2/v4), implementing responsive UI with sap.m controls, building Fiori Elements apps, writing unit tests with QUnit, integration tests with OPA5, setting up mock servers, handling security (XSS, CSP), optimizing performance, implementing accessibility features, or debugging UI5 applications. Also covers sap.ui.mdc controls and TypeScript control libraries.

Ask your Agent

Use this Skill: https://skilld.dev/gh/secondsky/sap-skills/sapui5

This session only. Nothing lands on disk.

README.md

≈2.9k tokens on demand. Your agent reads this file only when SKILL.md points to it.

SAPUI5 Development Skill

Comprehensive skill for developing enterprise web applications with SAP UI5 framework.

Capability Index

Capability Status
Commands 5: /ui5-api, /ui5-lint, /ui5-mcp-tools, /ui5-scaffold, /ui5-version
Agents 4: ui5-api-explorer, ui5-app-scaffolder, ui5-code-quality-advisor, ui5-migration-specialist
Hooks Yes: hooks/hooks.json
MCP Yes: .mcp.json
LSP No
Source Freshness last_verified: 2026-05-31; UI5 MCP/tooling package evidence tracked in audit report.
Verification npm run validate; app-specific preview/build checks require a target UI5 app.

Auto-Trigger Keywords

This skill is automatically triggered when Claude Code detects these keywords in user requests:

Framework & Core

sapui5, ui5, openui5, sap ui5, sap-ui5, ui5 framework, sapui5 framework, ui5 application, sapui5 app, ui5 development, sapui5 development

Project Setup

ui5 init, ui5 serve, ui5 build, ui5 tooling, ui5 cli, @ui5/cli, ui5.yaml, ui5-project, ui5 configuration, sap business application studio, sap web ide

Application Structure

Component.js, manifest.json, application descriptor, ui5 component, sap.ui.core.UIComponent, component-based, ui5 manifest, sap.app, sap.ui5, ui5 routing

Views & Controllers

xml view, json view, javascript view, html view, mvc:View, sap.ui.core.mvc.Controller, controller.js, view.xml, ui5 controller, ui5 view, view controller binding

Data Binding & Models

data binding, property binding, aggregation binding, element binding, expression binding, json model, odata model, odata v2, odata v4, xml model, resource model, i18n model, sap.ui.model, two-way binding, one-way binding, binding mode, binding path, binding context

Controls & Libraries

sap.m, sap.ui.table, sap.f, sap.uxap, sap.ui.layout, sap.tnt, sap.suite.ui.commons, ui5 controls, mobile controls, table control, list control, button control, input control, dialog control, popover control, responsive table, analytical table, tree table

Fiori Elements

fiori elements, sap fiori elements, list report, object page, analytical list page, overview page, worklist, fiori template, sap.fe.templates, ui annotations, odata annotations, @UI.LineItem, @UI.SelectionFields, @UI.HeaderInfo, @UI.Facets, @UI.FieldGroup, building blocks, flexible column layout

Routing & Navigation

ui5 routing, sap.m.routing.Router, router configuration, route pattern, routing targets, navigation, navTo, route matched, hash navigation, url parameters, deep linking

Testing

qunit, opa5, ui5 testing, unit test, integration test, opa test, mock server, sap.ui.test, test automation, ui5 inspector, support assistant, code coverage, karma ui5, test journey, page object

OData Integration

odata service, odata binding, odata batch, odata filter, odata read, odata create, odata update, odata delete, $expand, $select, $filter, $orderby, $skip, $top, odata metadata, service metadata, odata v2 model, odata v4 model, draft handling, function import

Performance & Optimization

component preload, lazy loading, bundling, minification, cache buster, async loading, ui5 performance, table virtualization, growing list, batch request, preload, ui5 build optimization

Security

xss prevention, content security policy, csp, ui5 security, input validation, output encoding, csrf token, clickjacking, secure programming, browser security

Accessibility

aria, accessibility, screen reader, keyboard navigation, high contrast, a11y, sapUiSizeCompact, sapUiSizeCozy, content density, rtl, right-to-left

Theming

sap_horizon, sap_fiori_3, sap_fiori_3_dark, sap_belize, ui5 theme, theme parameter, custom theme, ui theme designer, theme css

Deployment & Build

ui5 deployment, sapui5 deployment, bsp repository, abap repository, cloud foundry deployment, btp deployment, fiori launchpad, flp integration, ui5 build, production build

Error Handling

ui5 error, binding error, odata error, runtime error, ui5 debug, console error, error handling, message handling, sap.m.MessageBox, sap.m.MessageToast, sap.m.MessageStrip

Fragments

ui5 fragment, xml fragment, fragment definition, dialog fragment, loadFragment, fragment reuse, core:FragmentDefinition

Formatters & Types

formatter, data type, sap.ui.model.type, format date, format currency, format number, custom formatter, expression binding, composite binding

State Management

view model, json model, device model, app model, local storage, session storage, state management, variant management, personalization

Custom Controls

custom control, control development, control renderer, control metadata, control properties, control events, control aggregations, sap.ui.core.Control, composite control

Metadata-Driven Controls (MDC)

sap.ui.mdc, mdc controls, mdc table, mdc filterbar, mdc value help, metadata-driven controls, control delegates, PropertyInfo, TypeMap, VariantManagement, mdc personalization, p13nMode, mdc delegate

TypeScript Control Libraries

control library typescript, ts-interface-generator, @ui5/ts-interface-generator, ui5-tooling-transpile, typescript control library, library.ts, enum registration, ObjectPath, TypeScript UI5 library

APF (Analysis Path Framework)

apf, analysis path framework, apf configuration, apf modeler, analysis step, apf representation, smart filter bar apf

Common Issues & Troubleshooting

ui5 troubleshooting, binding not working, odata not loading, view not displaying, routing not working, cors error ui5, 404 error ui5, metadata error, service error, component not found

File Extensions

.controller.js, .view.xml, .fragment.xml, Component.js, manifest.json, i18n.properties, ui5.yaml, .qunit.html, .opa.js

Development Tools

ui5 tooling, yeoman ui5, generator-easy-ui5, ui5 snippets, ui5 linter, ui5 typescript, ui5 migration

SAP Technologies

sap gateway, sap netweaver, sap s/4hana, sap btp, sap cloud platform, sap fiori launchpad, sap business suite

What This Skill Covers

Application Development

  • Freestyle SAPUI5 applications
  • SAP Fiori Elements applications
  • Component-based architecture
  • Project structure and organization
  • manifest.json configuration
  • UI5 Tooling setup

MVC Pattern

  • XML, JSON, JavaScript, and HTML views
  • Controllers with lifecycle hooks
  • Model types (JSON, OData v2/v4, XML, Resource)
  • Data binding patterns
  • Routing and navigation

Data Management

  • OData v2 and v4 integration
  • CRUD operations
  • Batch requests
  • Filters and sorters
  • Data types and formatters
  • Expression binding

UI Development

  • sap.m controls (mobile/responsive)
  • Tables and lists
  • Forms and inputs
  • Dialogs and popovers
  • Layouts (FlexBox, Grid, Dynamic Page)
  • Fragments for reuse

Fiori Elements

  • List Report applications
  • Object Page applications
  • Analytical List Page
  • Overview Page
  • Worklist
  • OData annotations (@UI, @Common, @Capabilities)
  • Building blocks
  • Extension points

Testing

  • Unit testing with QUnit
  • Integration testing with OPA5
  • Mock server setup
  • Test automation
  • Code coverage
  • Page objects and journeys

Advanced Features

  • Custom control development
  • Application extensions
  • Draft handling
  • Flexible Column Layout
  • Variant management
  • Personalization

Security & Performance

  • XSS prevention
  • Content Security Policy
  • Performance optimization
  • Lazy loading
  • Bundling and minification
  • Accessibility implementation

Templates Included

  1. basic-component.js: Component template with router and device model
  2. manifest.json: Complete application descriptor
  3. xml-view.xml: XML view with table, search, and filters
  4. controller.js: Controller with CRUD operations and event handlers
  5. formatter.js: Common formatters (date, currency, status, etc.)

Reference Documentation

  1. glossary.md: Complete SAPUI5 terminology (100+ terms)
  2. core-architecture.md: Framework architecture and concepts
  3. data-binding-models.md: Data binding and model usage
  4. testing.md: Testing strategies and best practices
  5. fiori-elements.md: Fiori Elements configuration and annotations
  6. typescript-support.md: TypeScript setup, configuration, and migration
  7. routing-navigation.md: Routing, navigation, and Flexible Column Layout
  8. performance-optimization.md: Performance best practices and optimization
  9. accessibility.md: WCAG 2.1 compliance, screen readers, ARIA, keyboard navigation
  10. security.md: XSS prevention, CSP, authentication, CSRF, secure coding
  11. mdc-typescript-advanced.md: Metadata-Driven Controls (sap.ui.mdc), TypeScript control library development

Official Documentation

Version

  • Skill Version: 2.0.0
  • Minimum UI5 Version: 1.120.0
  • Latest SAPUI5 Version Verified: 1.148.1
  • Last Updated: 2026-05-31
  • Status: Production

What's New in v2.0.0 (2025-12-28) - MCP Integration & Plugin-Dev Best Practices

  • ✅ MCP Integration: Official @ui5/mcp-server with 9 live tools
  • ✅ 4 Specialized Agents: Scaffolding, API Explorer, Code Quality, Migration
  • ✅ 5 Slash Commands: /ui5-api, /ui5-scaffold, /ui5-lint, /ui5-version, /ui5-mcp-tools
  • ✅ Validation Hooks: PreToolUse and PostToolUse quality gates (user approval)
  • ✅ 15 Reference Files: +4 new guides (MCP integration, scaffolding, migration, quality)
  • ✅ User Settings: Configurable preferences via sapui5.local.md
  • ✅ Graceful Degradation: Full functionality without MCP (reference file fallback)
  • ✅ Keywords: +20 new auto-trigger keywords for agents and commands

What's New in v1.4.0

  • ✅ Major SKILL.md optimization: 855 → 452 lines (47% reduction)
  • ✅ Added comprehensive Table of Contents for improved navigation
  • ✅ Implemented progressive disclosure architecture
  • ✅ Fixed frontmatter name mismatch (critical for discovery)
  • ✅ Token efficiency improved from ~45% to ~70%
  • ✅ Better organized content with clear reference pointers

What's New in v1.3.0

  • ✅ Added Metadata-Driven Controls (MDC) documentation (sap.ui.mdc library)
  • ✅ Added TypeScript control library development guide
  • ✅ New reference file: mdc-typescript-advanced.md (~10KB)
  • ✅ Sources: SAP-samples/ui5-mdc-json-tutorial, SAP-samples/ui5-typescript-control-library
  • ✅ Enhanced coverage from 10 to 11 reference files (~190KB total documentation)

What's New in v1.2.0

  • ✅ Added comprehensive accessibility guide (WCAG 2.1, screen readers, ARIA, keyboard navigation)
  • ✅ Added security best practices (XSS, CSP, clickjacking, CSRF, authentication)
  • ✅ Enhanced coverage from 8 to 10 reference files (~180KB total documentation)
  • ✅ 100% coverage of critical enterprise requirements

What's New in v1.1.0

  • ✅ Added TypeScript support reference (setup, configuration, types, migration)
  • ✅ Added comprehensive routing & navigation guide (hash-based, FCL, parameters)
  • ✅ Added performance optimization reference (async loading, CDN, preload, OData)
  • ✅ Enhanced coverage from 5 to 8 reference files (~150KB total documentation)
  • ✅ All 1,416 documentation files from official SAP SAPUI5 docs reviewed

License

GPL-3.0

Maintained by: Eduard Jiglau | hello@sap-ai-skills.com | sap-ai-skills.com | https://github.com/secondsky/sap-skills

Source: SKILL.md on GitHub

Third-party checks

No alerts1mo3 checks · Risk SAFE
  • Gen Agent Trust Hub1mo

    The sapui5 skill is a high-quality development assistant for building enterprise applications with the SAPUI5 framework. It provides extensive documentation, best practice checklists, and templates for components, controllers, and views. The skill also integrates with official SAP tools like the @ui5/mcp-server for advanced features like live code linting and project scaffolding. No security risks or malicious patterns were found; the skill even includes a dedicated guide on security best practices for developers.

  • Socket1mo

    No alerts

  • Snyk1mo

    Risk: LOW · No issues

Provenance

Signed by skilld at 620a19a. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 2 weeks ago.

Activeupdated 2 months ago

Capability

Other metadata
metadata
{
  "maintainer": "Eduard Jiglau",
  "maintainer_email": "hello@sap-ai-skills.com",
  "website": "https://sap-ai-skills.com",
  "version": "2.4.1",
  "last_verified": "2026-05-31",
  "framework_version": "1.148.1 latest verified, 1.120.0+ baseline",
  "documentation_source": "https://github.com/SAP-docs/sapui5",
  "documentation_files_analyzed": 1416,
  "reference_files": 15,
  "mcp_integration": true,
  "mcp_tools": 9,
  "specialized_agents": 4,
  "slash_commands": 5,
  "status": "production",
  "keywords": [
    "sapui5",
    "ui5",
    "openui5",
    "sap ui5",
    "ui5 framework",
    "ui5 application",
    "ui5 development",
    "ui5 tooling",
    "ui5 cli",
    "Component.js",
    "manifest.json",
    "xml view",
    "data binding",
    "odata v2",
    "odata v4",
    "fiori elements",
    "sap.m controls",
    "mvc pattern",
    "routing",
    "navigation",
    "qunit",
    "opa5",
    "testing",
    "mock server",
    "sap.ui.mdc",
    "mdc table",
    "typescript",
    "accessibility",
    "security",
    "performance",
    "ui5 inspector"
  ]
}

README badge

README badge for secondsky/sap-skills/sapui5