{"id":2405,"date":"2024-04-23T12:52:37","date_gmt":"2024-04-23T10:52:37","guid":{"rendered":"https:\/\/www.cobicon.de\/sap-fiori-apps\/"},"modified":"2025-03-31T11:34:07","modified_gmt":"2025-03-31T09:34:07","slug":"sap-fiori-apps","status":"publish","type":"post","link":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/","title":{"rendered":"How SAP Fiori Elements generates SAP Fiori apps"},"content":{"rendered":"<h1 id=\"how-sap-fiori-elements-sap-fiori-apps-generated\">How SAP Fiori Elements generates SAP Fiori Apps<\/h1>\n<p>SAP Fiori Elements is a powerful framework that drama\u00adti\u00adcally simplifies and accele\u00adrates the development of SAP Fiori apps by automa\u00adti\u00adcally generating the front end from metadata. But how exactly does this process work? Let\u2019s take a look at the technical details.<\/p>\n<h2 id=\"the-basis-odata-services\">The basis: OData services<\/h2>\n<p>The basic requi\u00adrement for using SAP Fiori Elements is the existence of OData services that provide the data for the app. These OData services must support the OData V2 or V4 protocol. Other data sources are not supported. The OData services not only provide the data itself, but also contain metadata in the form of annota\u00adtions that define attri\u00adbutes and relati\u00adonships of the data.<\/p>\n<h2 id=\"generation-of-the-app-at-runtime\">Generation of the app at runtime<\/h2>\n<p>The central concept behind SAP Fiori Elements is the&nbsp;<strong>generation of an SAP Fiori app at runtime from an existing OData API with additional metadata (annota\u00adtions)<\/strong>. Not only the content of the appli\u00adca\u00adtion\u2019s pages is generated by SAP Fiori Elements, but also the logic and behavior. This results in&nbsp;<strong>very little UI development<\/strong>as navigation, filtering, editing, saving, etc. are all handled by SAP Fiori Elements. By using the metadata from the OData services, SAP Fiori Elements can automa\u00adti\u00adcally generate the entire app UI, including the layout, forms, lists, and other UI elements. Developers don\u2019t have to worry about the details of UI imple\u00admen\u00adtation, but instead focus on providing the right metadata.<\/p>\n<h2 id=\"annotations-for-customization\">Annota\u00adtions for custo\u00admization<\/h2>\n<p>Although the front end of the app is automa\u00adti\u00adcally generated, developers can influence the appearance and behavior of the app by custo\u00admizing the annota\u00adtions. The annota\u00adtions can either be added directly to the data in the backend or overwritten in a local annotation file in the project. To make it easier to create and edit annota\u00adtions, SAP offers the \u201cSAP Fiori Tools\u201d. These tools allow developers to create new SAP Fiori Elements appli\u00adca\u00adtions or edit the annotation file using Guided Develo\u00adp\u00adments. These guided develo\u00adp\u00adments allow developers to walk through the steps required to implement a specific function\u00adality in the appli\u00adcation and generate a code snippet that can be easily inserted into the code.<\/p>\n<h2 id=\"technical-requirements\">Technical requi\u00adre\u00adments<\/h2>\n<p>Like any technology, SAP Fiori Elements also has some technical requi\u00adre\u00adments:<\/p>\n<ul>\n<li><strong>Execution Environment<\/strong>: SAP Fiori Elements appli\u00adca\u00adtions are web appli\u00adca\u00adtions that run in a browser. Native iOS or Android Fiori Elements appli\u00adca\u00adtions do not exist.<\/li>\n<li><strong>Data connection<\/strong>: The data source must support the OData V2 or V4 protocol. Other data sources are not supported. Offline use of the app is not supported.<\/li>\n<\/ul>\n<p>Overall, SAP Fiori Elements offers an efficient and standar\u00addized way to develop SAP Fiori apps by automa\u00adti\u00adcally generating the user interface from metadata. By reducing the amount of UI development required, developers can focus their attention on providing the right data and metadata instead of dealing with technical details of UI imple\u00admen\u00adtation.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>How SAP Fiori Elements generates SAP Fiori Apps SAP Fiori Elements is a powerful framework that drama\u00adti\u00adcally simplifies and accele\u00adrates the development of SAP Fiori apps by automa\u00adti\u00adcally generating the front end from metadata. But how exactly does this process work? Let\u2019s take a look at the technical details. The basis: OData services The basic [\u2026]<\/p>\n","protected":false},"author":7,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","wp_typography_post_enhancements_disabled":false,"footnotes":""},"categories":[27],"tags":[],"class_list":["post-2405","post","type-post","status-publish","format-standard","hentry","category-programming-models"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How SAP Fiori Elements generates SAP Fiori apps &#8226; cobicon<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How SAP Fiori Elements generates SAP Fiori apps &#8226; cobicon\" \/>\n<meta property=\"og:description\" content=\"How SAP Fiori Elements generates SAP Fiori Apps SAP Fiori Elements is a powerful framework that drama\u00adti\u00adcally simplifies and accele\u00adrates the development of SAP Fiori apps by automa\u00adti\u00adcally generating the front end from metadata. But how exactly does this process work? Let\u2019s take a look at the technical details. The basis: OData services The basic [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\" \/>\n<meta property=\"og:site_name\" content=\"cobicon\" \/>\n<meta property=\"article:published_time\" content=\"2024-04-23T10:52:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-03-31T09:34:07+00:00\" \/>\n<meta name=\"author\" content=\"Cobicon\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Cobicon\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\"},\"author\":{\"name\":\"Cobicon\",\"@id\":\"https:\/\/www.cobicon.de\/en\/#\/schema\/person\/d6c07819c20510e30e3fe968f13389d5\"},\"headline\":\"How SAP Fiori Elements generates SAP Fiori apps\",\"datePublished\":\"2024-04-23T10:52:37+00:00\",\"dateModified\":\"2025-03-31T09:34:07+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\"},\"wordCount\":477,\"publisher\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/#organization\"},\"articleSection\":[\"Programming Models\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\",\"url\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\",\"name\":\"How SAP Fiori Elements generates SAP Fiori apps &#8226; cobicon\",\"isPartOf\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/#website\"},\"datePublished\":\"2024-04-23T10:52:37+00:00\",\"dateModified\":\"2025-03-31T09:34:07+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Startseite\",\"item\":\"https:\/\/www.cobicon.de\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How SAP Fiori Elements generates SAP Fiori apps\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.cobicon.de\/en\/#website\",\"url\":\"https:\/\/www.cobicon.de\/en\/\",\"name\":\"cobicon\",\"description\":\"SAP Beratung, Consulting &amp; Development\",\"publisher\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.cobicon.de\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.cobicon.de\/en\/#organization\",\"name\":\"cobicon\",\"url\":\"https:\/\/www.cobicon.de\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.cobicon.de\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.cobicon.de\/wp-content\/uploads\/cobicon-logo-white.svg\",\"contentUrl\":\"https:\/\/www.cobicon.de\/wp-content\/uploads\/cobicon-logo-white.svg\",\"width\":432,\"height\":106,\"caption\":\"cobicon\"},\"image\":{\"@id\":\"https:\/\/www.cobicon.de\/en\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.cobicon.de\/en\/#\/schema\/person\/d6c07819c20510e30e3fe968f13389d5\",\"name\":\"Cobicon\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.cobicon.de\/en\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/17cf00524892f097c1dedb1c7cf671f8e61b1b69d54613b9b4fedc990459139a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/17cf00524892f097c1dedb1c7cf671f8e61b1b69d54613b9b4fedc990459139a?s=96&d=mm&r=g\",\"caption\":\"Cobicon\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How SAP Fiori Elements generates SAP Fiori apps &#8226; cobicon","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/","og_locale":"en_US","og_type":"article","og_title":"How SAP Fiori Elements generates SAP Fiori apps &#8226; cobicon","og_description":"How SAP Fiori Elements generates SAP Fiori Apps SAP Fiori Elements is a powerful framework that drama\u00adti\u00adcally simplifies and accele\u00adrates the development of SAP Fiori apps by automa\u00adti\u00adcally generating the front end from metadata. But how exactly does this process work? Let\u2019s take a look at the technical details. The basis: OData services The basic [&hellip;]","og_url":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/","og_site_name":"cobicon","article_published_time":"2024-04-23T10:52:37+00:00","article_modified_time":"2025-03-31T09:34:07+00:00","author":"Cobicon","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Cobicon","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/#article","isPartOf":{"@id":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/"},"author":{"name":"Cobicon","@id":"https:\/\/www.cobicon.de\/en\/#\/schema\/person\/d6c07819c20510e30e3fe968f13389d5"},"headline":"How SAP Fiori Elements generates SAP Fiori apps","datePublished":"2024-04-23T10:52:37+00:00","dateModified":"2025-03-31T09:34:07+00:00","mainEntityOfPage":{"@id":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/"},"wordCount":477,"publisher":{"@id":"https:\/\/www.cobicon.de\/en\/#organization"},"articleSection":["Programming Models"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/","url":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/","name":"How SAP Fiori Elements generates SAP Fiori apps &#8226; cobicon","isPartOf":{"@id":"https:\/\/www.cobicon.de\/en\/#website"},"datePublished":"2024-04-23T10:52:37+00:00","dateModified":"2025-03-31T09:34:07+00:00","breadcrumb":{"@id":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.cobicon.de\/en\/sap-fiori-apps\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Startseite","item":"https:\/\/www.cobicon.de\/en\/"},{"@type":"ListItem","position":2,"name":"How SAP Fiori Elements generates SAP Fiori apps"}]},{"@type":"WebSite","@id":"https:\/\/www.cobicon.de\/en\/#website","url":"https:\/\/www.cobicon.de\/en\/","name":"cobicon","description":"SAP Beratung, Consulting &amp; Development","publisher":{"@id":"https:\/\/www.cobicon.de\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.cobicon.de\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.cobicon.de\/en\/#organization","name":"cobicon","url":"https:\/\/www.cobicon.de\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.cobicon.de\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.cobicon.de\/wp-content\/uploads\/cobicon-logo-white.svg","contentUrl":"https:\/\/www.cobicon.de\/wp-content\/uploads\/cobicon-logo-white.svg","width":432,"height":106,"caption":"cobicon"},"image":{"@id":"https:\/\/www.cobicon.de\/en\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.cobicon.de\/en\/#\/schema\/person\/d6c07819c20510e30e3fe968f13389d5","name":"Cobicon","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.cobicon.de\/en\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/17cf00524892f097c1dedb1c7cf671f8e61b1b69d54613b9b4fedc990459139a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/17cf00524892f097c1dedb1c7cf671f8e61b1b69d54613b9b4fedc990459139a?s=96&d=mm&r=g","caption":"Cobicon"}}]}},"_links":{"self":[{"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/posts\/2405","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/comments?post=2405"}],"version-history":[{"count":1,"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/posts\/2405\/revisions"}],"predecessor-version":[{"id":3750,"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/posts\/2405\/revisions\/3750"}],"wp:attachment":[{"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/media?parent=2405"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/categories?post=2405"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.cobicon.de\/en\/wp-json\/wp\/v2\/tags?post=2405"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}