diff --git a/steps/01/README.md b/steps/01/README.md index 259a72ea..e430f8fc 100644 --- a/steps/01/README.md +++ b/steps/01/README.md @@ -57,29 +57,31 @@ In our webapp folder, we create a new HTML file named `index.html` and copy the ### webapp/manifest.json \(New\) -The manifest file, also known as the "descriptor" or "app descriptor," serves as a crucial configuration file for applications, components, and libraries. Stored in the `webapp` folder, this file is read by OpenUI5 to instantiate a component. Although we haven't created a component yet (which is part of [Step 9: Component Configuration](../09/README.md)), we need to create the app descriptor now because the UI5 Tooling we intend to use for development also requires it. +The manifest serves as a crucial configuration file for applications, components, and libraries. For applications, the manifest file is stored in the `webapp` folder and is read by OpenUI5 to instantiate a component. Although we haven't created a component yet (which is part of [Step 9: Component Configuration](../09/README.md)), creating the manifest now is necessary due to the UI5 Tooling requirements for development. -Hence, we create a new file called `manifest.json` in the webapp folder and define its essential attributes: +Let's start by creating a new file named `manifest.json` in the webapp folder and define its essential attributes: -- The `_version` attribute is a mandatory field in the app descriptor that indicates the format version of the descriptor. This attribute is crucial for identifying application settings when the descriptor is read by various tools. As new features or changes are introduced in future versions of the descriptor, the version number helps ensure compatibility and proper interpretation of the descriptor's contents. Consequently, with each new version of OpenUI5 a corresponding version of the app descriptor is released. For this tutorial, we have determined that our app requires a minimum OpenUI5 version of 1.120. Therefore, we specify the descriptor format version as 1.60.0, aligning it with the appropriate OpenUI5 version. +- The `_version` attribute in the root is mandatory in the manifest. It indicates the format version of the manifest, which is crucial for identifying application settings whenever the file is read by various tools. As new features or changes are introduced in future versions, maintaining the correct version number ensures compatibility and precise interpretation of the manifest's contents. - > πŸ’‘ **Tip:**
- > To find the appropriate `_version` for each OpenUI5 release, see [Descriptor for Applications, Components, and Libraries \(manifest.json\)](httsp://sdk.openui5.org/topic/be0cf40f61184b358b5faedaec98b2da.html). +Since we want our app to support not only the latest OpenUI5 version but rather the latest long-term maintenance version, which is OpenUI5 1.120, we set the format version to `1.60.0`. -- The **`sap.app`** namespace is used to define properties that are specific to the application itself. It includes the following obligatory application-specific attributes: + > πŸ“ **Note:**
+ > The manifest version should not necessarily align directly with the OpenUI5 version being used. Instead, choose the descriptor version that matches the requirements or supports the features you intend to use in your application. + + To find the appropriate `_version` for each OpenUI5 release, refer to [Descriptor for Applications, Components, and Libraries \(manifest.json\)](https://sdk.openui5.org/topic/be0cf40f61184b358b5faedaec98b2da.html) or the [mapping.json](https://github.com/SAP/ui5-manifest/blob/main/mapping.json) file of the [ui5-manifest](https://github.com/SAP/ui5-manifest/) project. - - `id`: This property specifies a unique identifier for the application and states the namespace of the application. - It's used to identify the application within the SAP Fiori launchpad or any other deployment environment. - The id has to be provided in dot notation and must not exceed 70 characters. +- The **`sap.app`** namespace defines properties specific to the application. It includes the following required attributes: - - `title`: This property defines the title of the application, which can be displayed in the SAP Fiori launchpad or other application management tools. + - `id`: This specifies an identifier for the application. It is provided in dot notation and is limited to 70 characters. It must be unique and must correspond to the component ID/namespace. - > πŸ“ **Note:**
- > It's recommended to make the title language-dependent, although for now we will use a static title. We'll discuss how to implement language-dependent titles in [Step 10: Descriptor for Applications](../10/README.md). + - `type`: This property defines the nature of the project and specifies whether it is an `application`, `component`, `library`, or `card`. It provides a clear classification, helping to identify the project's purpose and ensuring the correct loading and handling of the project within the system. + + - `title`: This defines the title of the application, which appears in application management tools like the SAP Fiori launchpad. - - `applicationVersion`: This property is used to specify the version of the application. It's typically used for tracking and managing changes to the application over time. The application version must be provided using semantic versioning principles. + > πŸ“ **Note:**
+ > It is advisable to make the title language-dependent. We'll cover implementing language-dependent titles in [Step 10: Manifest (Descriptor for Applications)](../10/README.md), but for now we'll use a static title. - - `type`: This property defines the type of the project, such as `application` or `component`. It helps in determining the application's behavior and how it should be loaded. While the type is actually not a mandatory attribute, it provides a useful project description; hence, it makes sense to conigure it as well. We describe an `application`. + - `applicationVersion`: This is used to denote the version of the application using semantic versioning principles. It's typically used for tracking and managing changes to the application over time. ```json { @@ -166,6 +168,8 @@ This will open a new browser window hosting your newly created `index.html`. [Descriptor for Applications, Components, and Libraries \(manifest.json\)](https://sdk.openui5.org/topic/be0cf40f61184b358b5faedaec98b2da.html "The descriptor for applications, components, and libraries (in short: app descriptor) is inspired by the WebApplication Manifest concept introduced by the W3C. The descriptor provides a central, machine-readable, and easy-to-access location for storing metadata associated with an application, an application component, or a library.") +[ui5-manifest](https://github.com/SAP/ui5-manifest/tree/main) + [Development Environment](https://sdk.openui5.org/topic/7bb04e05f9484e1b95b38a2e48ecef4f.html "This part of the documentation introduces you to some common and recommended use cases for the installation, configuration, and setup of OpenUI5 development environments.") [App Development](https://sdk.openui5.org/topic/b1fbe1a22f8d4a5bbb601591e27b68d1 "There are several ways to develop OpenUI5 applications. Select the one that meets the requirements of your projects and your expectations best.") diff --git a/steps/09/README.md b/steps/09/README.md index 2e525b0f..6059b409 100644 --- a/steps/09/README.md +++ b/steps/09/README.md @@ -157,7 +157,7 @@ new ComponentContainer({ *** -**Next:** [Step 10: Descriptor for Applications](../10/README.md "All application-specific configuration settings will now further be put in a separate descriptor file called manifest.json. This clearly separates the application coding from the configuration settings and makes our app even more flexible. For example, all SAP Fiori applications are realized as components and come with a descriptor file in order to be hosted in the SAP Fiori launchpad.") +**Next:** [Step 10: Manifest (Descriptor for Applications)](../10/README.md "All application-specific configuration settings will now further be put into the manifest. This clearly separates the application coding from the configuration settings and makes our app even more flexible.") **Previous:** [Step 8: Translatable Texts](../08/README.md "In this step we move the texts of our UI to a separate resource file.") diff --git a/steps/10/README.md b/steps/10/README.md index eed67fbf..0598395e 100644 --- a/steps/10/README.md +++ b/steps/10/README.md @@ -1,8 +1,8 @@ -## Step 10: Descriptor for Applications +## Step 10: Manifest (Descriptor for Applications) -All application-specific configuration settings will now further be put in a separate descriptor file called `manifest.json`. This clearly separates the application coding from the configuration settings and makes our app even more flexible. +All application-specific configuration settings will now be put into the manifest. This clearly separates the application coding from the configuration settings and makes our app even more flexible. -Instead of relying on a local HTML file for the bootstrap, the descriptor file is parsed and the component is loaded directly into the current HTML page. This allows multiple apps to be displayed in the same context. Each app can define its own local settings, such as language properties and supported devices. Additionally, the descriptor file can be used to load additional resources and instantiate models, such as the `i18n` resource bundle. +Instead of relying on a local HTML file for the bootstrap, the manifest is parsed and the component is loaded directly into the current HTML page. This allows multiple apps to be displayed in the same context. Each app can define its own local settings, such as language properties and supported devices. Additionally, the manifest can be used to load additional resources and instantiate models, such as the `i18n` resource bundle.   @@ -24,14 +24,14 @@ To download the solution for this step as a zip file, just choose the link here: ### webapp/i18n/i18n.properties -In our resource bundle, we include two new name-value pairs: `appTitle` for the title of our app and `appDescription` for a short description. We'll use these texts in our app descriptor file at a later stage. +In our resource bundle, we include two new name-value pairs: `appTitle` for the title of our app and `appDescription` for a short description. We'll use these texts in our manifest file at a later stage. To improve readability, we also add comments to separate the bundle texts based on their meaning. ```ini -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello @@ -41,13 +41,13 @@ helloMsg=Hello {0} ### webapp/manifest.json -As mentioned in [Step 1](../01/README.md#webappmanifestjson-new), the manifest file is used by OpenUI5 to instantiate the component. We have already configured the essential attributes of the file so that it can be used with the UI5 Tooling. Now, we'll add further attributes that are important for creating a proper UI component in OpenUI5. +As mentioned in [Step 1](../01/README.md#webappmanifestjson-new), the manifest is used by OpenUI5 to instantiate the component. We have already configured the essential attributes of the file so that it can be used with the UI5 Tooling. Now, we'll add further attributes that are important for creating a proper UI component in OpenUI5. We enhance the **`sap.app`** namespace by adding configuration for the following application-specific attributes: - `i18n`: The `i18n` property is an attribute to configure internationalization settings. It is optional and only necessary if the manifest contains text symbols (placeholders in {{...}} syntax). The `i18n` property has the following sub-settings: - - The `bundleName` parameter specifies the name of the resource bundle file that contains the text symbols for the descriptor. The file is referenced using a dot notation namespace. In our case, we stored the texts for the app descriptor in the same resource bundle as the remaining texts, so we reference the properties file stored in the `i18n` folder. + - The `bundleName` parameter specifies the name of the resource bundle file that contains the text symbols for the manifest. The file is referenced using a dot notation namespace. In our case, we stored the texts for the manifest in the same resource bundle as the remaining texts, so we reference the properties file stored in the `i18n` folder. - The `supportedLocales` property defines an array of locales supported by the application (for example en_GB, en-GB, or en). This helps optimize the loading performance of resource bundles. It controls the language fallback chain and prevents unnecessary and potentially failing requests. In our application, we only use the base `i18n.properties` file for simplicity, so we set this property to an empty string. This ensures that the browser does not attempt to load additional `i18n_*.properties` files based on the browser's language setting and locale. @@ -57,13 +57,13 @@ We enhance the **`sap.app`** namespace by adding configuration for the following - `description`: Similarly, we make the description text language-dependent by referencing the `appDescription` text from the resource bundle using the handlebar syntax: {{key}} -> :warning: **Remeber:**
-> Properties of the resource bundle are enclosed in two curly brackets in the descriptor. This is not an OpenUI5 data binding syntax, but a variable reference to the resource bundle in the descriptor in handlebars syntax. The referred texts are not visible in the app itself but can be read by an application container like the SAP Fiori launchpad. +> :warning: **Remember:**
+> Properties of the resource bundle are enclosed in two curly brackets in the manifest. This is not an OpenUI5 data binding syntax but a variable reference to the resource bundle in the manifest in handlebars syntax. In addition to the `sap.app` namespace, there are two other important namespaces: The **`sap.ui`** namespace is used for UI-specific attributes and comes with the following main attributes: -- `technology`: This property specifies the technology used for the application; the value is `UI5`. +- `technology` \(mandatory\): This property specifies the technology used for the application; its value must be `UI5`. - `deviceTypes` \(mandatory\): This property defines the supported device types for the application. It is an object that contains three boolean properties: `desktop`, `tablet`, and `phone`. Each property indicates whether the application is designed to be used on that particular device type. We define all three device types as "true", which means that our application is intended to be used on desktops, tablets, and phones. @@ -74,12 +74,16 @@ The **`sap.ui5`** namespace adds OpenUI5-specific configuration parameters that - `dependencies`\(mandatory\): This section defines the dependencies of the component. It comes with the following sub-settings: - - The `minUI5Version` property is mandatory and specifies the minimum version of OpenUI5 required by the component. Our component requires version 1.20 as minimum. + - The `minUI5Version` property is mandatory as it specifies the minimum version of OpenUI5 that the component requires to function properly. Following the guideline discussed in step 1, our component should be designed to work with the long-term support (LTS) version 1.120 of OpenUI5. - - The `libs` settings declare the libraries that the OpenUI5 core should load for use in the component. To benefit from the asynchronous library preload, it is essential to add all obligatory libraries here. You can set the `lazy` parameter to "true" to indicate that the lib shall be lazy loaded. This makes sure that the libraries are only loaded when they're needed. If your app requires a minimum version of the lib, you need to specify the `minVersion` for information purposes. We declare here the two libraries `sap.ui.core` and `sap.m` as dependencies to be loaded directly when starting the component. + - The `libs` settings is used to declare all OpenUI5 libraries that the component depends on. It's crucial to list every library within the component here for correct dependency management.
+ In our component we currenetly only use the `sap.ui.core` and `sap.m` liibraries. The `sap.ui.core` library provides the basic framework functionality and is required for any OpenUI5 application.
+ By default, loading of libraries is set to `"lazy": false`, which means they are loaded immediately when the component initializes. For libraries that are essential for your app to function from the start, like `sap.ui.core` and in our case also `sap.m` (since it is used in the root view), we can keep the default setting of `"lazy": false`. > πŸ“Œ **Important:**
- > Make sure that you don't load too many dependencies. In most apps it's enough to load the libraries sap.ui.core and sap.m by default, and add additional libraries only when needed. + > It is crucial to be mindful of the lazy loading configuration for libraries. Only libraries that are absolutely necessary for your component to start should be declared with `"lazy": false`. For libraries that are not required immediately, it is recommended to override the default setting and set `"lazy": true`. This approach allows for better performance and faster initial loading of the component by deferring the loading of non-essential libraries until they are actually needed. + > For more information on loading libraries, refer to the [sap.ui.core.Lib.load](https://sdk.openui5.org/api/sap.ui.core.Lib#methods/sap.ui.core.Lib.load) API reference. + > If your component requires a minimum version of the library, you need to specify the `minVersion` for information purposes. - `rootView`: This section defines the root view of the application. The root view is the initial view that is displayed when the component is loaded. It specifies view name as a string for XML views, or the view configuration object with `viewName` for the view name as string and `type` for the view type, `id`, `async`, and other properties of `sap.ui.core.mvc.view`. We configure our app view as root view and add the ID "app" to it. @@ -143,15 +147,15 @@ In our current scenario, we only have one model called `i18n`, which is a resour ``` > πŸ“ **Note:**
-> In this tutorial, we only introduce the most important settings and parameters of the descriptor file. In some development environments you may get validation errors because some settings are missing - you can ignore those in this context. +> In this tutorial, we only introduce the most important settings and parameters of the manifest. In some development environments you may get validation errors because some settings are missing - you can ignore those in this context. *** ### webapp/Component.ts -To apply the settings specified in the app descriptor to the component, we need to include the descriptor file in the component's metadata. To do this, we add a `manifest` property to the `metadata` section of the component and set it to "json". This property acts as a reference to the `manifest.json` file, which will be loaded and used. +To apply the settings specified in the manifest to the component, we need to include the manifest in the component's metadata. To do this, we add a `manifest` property to the `metadata` section of the component and set it to "json". This property acts as a reference to the `manifest.json` file, which will be loaded and used. -Now that the resource model is automatically instantiated based on the configuration in the app descriptor, we can safely remove the corresponding code block from the `init` method in our component controller. This also means that we can remove the import statement for the `ResourceModel` module from `sap/ui/model/resource/ResourceModel`, as it is no longer needed. Additionally, we can remove the `createContent` call since the configuration of the rootView is specified in the app descriptor and therefore makes the implementation in this method unnecessary. +Now that the resource model is automatically instantiated based on the configuration in the manifest, we can safely remove the corresponding code block from the `init` method in our component controller. This also means that we can remove the import statement for the `ResourceModel` module from `sap/ui/model/resource/ResourceModel`, as it is no longer needed. Additionally, we can remove the `createContent` call since the configuration of the rootView is specified in the manifest and therefore makes the implementation in this method unnecessary. ```ts import UIComponent from "sap/ui/core/UIComponent"; @@ -221,9 +225,9 @@ We can now delete our `index.ts` file, because our component is now initiated di ### Conventions -- The descriptor file is named `manifest` and stored as JSON file. +- The manifest file is named `manifest` and stored as a JSON file. -- The descriptor file is located in the `webapp` folder. +- The manifest file is located in the `webapp` folder. - Use translatable texts for the title and the description of the app. diff --git a/steps/10/webapp/i18n/i18n.properties b/steps/10/webapp/i18n/i18n.properties index 65863fe4..6800f876 100644 --- a/steps/10/webapp/i18n/i18n.properties +++ b/steps/10/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/11/README.md b/steps/11/README.md index ea48f222..af8035a1 100644 --- a/steps/11/README.md +++ b/steps/11/README.md @@ -24,9 +24,9 @@ To download the solution for this step as a zip file, just choose the link here: We add new key/value pairs to the '# Hello Panel' section of our text bundle for the start page title and the panel title. ```ini -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello @@ -91,7 +91,7 @@ The `App` control does the following important things for us: **Next:** [Step 12: Shell Control as Container](../12/README.md "Now we use a shell control as container for our app and use it as our new root element. The shell takes care of visual adaptation of the application to the device’s screen size by introducing a so-called letterbox on desktop screens.") -**Previous:** [Step 10: Descriptor for Applications](../10/README.md "All application-specific configuration settings will now further be put in a separate descriptor file called manifest.json. This clearly separates the application coding from the configuration settings and makes our app even more flexible. For example, all SAP Fiori applications are realized as components and come with a descriptor file in order to be hosted in the SAP Fiori launchpad.") +**Previous:** [Step 10: Manifest (Descriptor for Applications)](../10/README.md "All application-specific configuration settings will now further be put into the manifest. This clearly separates the application coding from the configuration settings and makes our app even more flexible.") *** diff --git a/steps/11/webapp/i18n/i18n.properties b/steps/11/webapp/i18n/i18n.properties index ef687309..96d13fd7 100644 --- a/steps/11/webapp/i18n/i18n.properties +++ b/steps/11/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/12/webapp/i18n/i18n.properties b/steps/12/webapp/i18n/i18n.properties index ef687309..96d13fd7 100644 --- a/steps/12/webapp/i18n/i18n.properties +++ b/steps/12/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/13/webapp/i18n/i18n.properties b/steps/13/webapp/i18n/i18n.properties index ef687309..96d13fd7 100644 --- a/steps/13/webapp/i18n/i18n.properties +++ b/steps/13/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/14/webapp/i18n/i18n.properties b/steps/14/webapp/i18n/i18n.properties index ef687309..96d13fd7 100644 --- a/steps/14/webapp/i18n/i18n.properties +++ b/steps/14/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/15/webapp/i18n/i18n.properties b/steps/15/webapp/i18n/i18n.properties index ef687309..96d13fd7 100644 --- a/steps/15/webapp/i18n/i18n.properties +++ b/steps/15/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/16/webapp/i18n/i18n.properties b/steps/16/webapp/i18n/i18n.properties index 36227d96..af9864db 100644 --- a/steps/16/webapp/i18n/i18n.properties +++ b/steps/16/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/17/webapp/i18n/i18n.properties b/steps/17/webapp/i18n/i18n.properties index 723ec2eb..d8b94b6b 100644 --- a/steps/17/webapp/i18n/i18n.properties +++ b/steps/17/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/18/webapp/i18n/i18n.properties b/steps/18/webapp/i18n/i18n.properties index 723ec2eb..d8b94b6b 100644 --- a/steps/18/webapp/i18n/i18n.properties +++ b/steps/18/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/19/webapp/i18n/i18n.properties b/steps/19/webapp/i18n/i18n.properties index 1ae3080b..e3d0462f 100644 --- a/steps/19/webapp/i18n/i18n.properties +++ b/steps/19/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/20/webapp/i18n/i18n.properties b/steps/20/webapp/i18n/i18n.properties index 1ae3080b..e3d0462f 100644 --- a/steps/20/webapp/i18n/i18n.properties +++ b/steps/20/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/21/webapp/i18n/i18n.properties b/steps/21/webapp/i18n/i18n.properties index 1ae3080b..e3d0462f 100644 --- a/steps/21/webapp/i18n/i18n.properties +++ b/steps/21/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/22/webapp/i18n/i18n.properties b/steps/22/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/22/webapp/i18n/i18n.properties +++ b/steps/22/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/23/webapp/i18n/i18n.properties b/steps/23/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/23/webapp/i18n/i18n.properties +++ b/steps/23/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/24/webapp/i18n/i18n.properties b/steps/24/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/24/webapp/i18n/i18n.properties +++ b/steps/24/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/25/webapp/i18n/i18n.properties b/steps/25/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/25/webapp/i18n/i18n.properties +++ b/steps/25/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/26/webapp/i18n/i18n.properties b/steps/26/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/26/webapp/i18n/i18n.properties +++ b/steps/26/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/27/webapp/i18n/i18n.properties b/steps/27/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/27/webapp/i18n/i18n.properties +++ b/steps/27/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/28/webapp/i18n/i18n.properties b/steps/28/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/28/webapp/i18n/i18n.properties +++ b/steps/28/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/29/webapp/i18n/i18n.properties b/steps/29/webapp/i18n/i18n.properties index 5678d051..6bb98b40 100644 --- a/steps/29/webapp/i18n/i18n.properties +++ b/steps/29/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/30/webapp/i18n/i18n.properties b/steps/30/webapp/i18n/i18n.properties index 8cdb305b..f9629981 100644 --- a/steps/30/webapp/i18n/i18n.properties +++ b/steps/30/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/31/webapp/i18n/i18n.properties b/steps/31/webapp/i18n/i18n.properties index 8cdb305b..f9629981 100644 --- a/steps/31/webapp/i18n/i18n.properties +++ b/steps/31/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/32/webapp/i18n/i18n.properties b/steps/32/webapp/i18n/i18n.properties index 8cdb305b..f9629981 100644 --- a/steps/32/webapp/i18n/i18n.properties +++ b/steps/32/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/33/webapp/i18n/i18n.properties b/steps/33/webapp/i18n/i18n.properties index abd58622..1c2cff74 100644 --- a/steps/33/webapp/i18n/i18n.properties +++ b/steps/33/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/34/webapp/i18n/i18n.properties b/steps/34/webapp/i18n/i18n.properties index ee5e5e19..ba5ba347 100644 --- a/steps/34/webapp/i18n/i18n.properties +++ b/steps/34/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/35/webapp/i18n/i18n.properties b/steps/35/webapp/i18n/i18n.properties index 7ae4c487..7594c6e4 100644 --- a/steps/35/webapp/i18n/i18n.properties +++ b/steps/35/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/36/README.md b/steps/36/README.md index 1002bce4..db3e0e71 100644 --- a/steps/36/README.md +++ b/steps/36/README.md @@ -10,7 +10,7 @@ In this step of our Walkthrough tutorial, we adjust the content density based on ![](https://sdk.openui5.org/docs/topics/loiof216b131c492448d8a1df25db2b9a26d_LowRes.png "The content density is compact on desktop devices and cozy on touch-enabled devices") -*The content density is compact on desktop devices and cozy on touch-enabled devices* +*The content density is compact on devices without a touch screen and cozy on touch-enabled devices* You can access the live preview by clicking on this link: [πŸ”— Live Preview of Step 36](https://sap-samples.github.io/ui5-typescript-walkthrough/step-36/test/mockServer-cdn.html). @@ -74,9 +74,9 @@ export default class App extends Controller { ### webapp/manifest.json -In the `sap.ui5` namespace of the app descriptor we add the `contentDensities` section to specify the modes that the application supports. Containers like the SAP Fiori launchpad allow switching the content density based on these settings. +In the `sap.ui5` namespace of the manifest we add the `contentDensities` section to specify the modes that the application supports. Containers like the SAP Fiori launchpad allow switching the content density based on these settings. -As we have just enabled the app to run in both modes depending on the devices capabilities, we can set both to `true` in the application descriptor. +As we have just enabled the app to run in both modes depending on the devices capabilities, we can set both to `true` in the manifest. ```json { diff --git a/steps/36/webapp/i18n/i18n.properties b/steps/36/webapp/i18n/i18n.properties index 7ae4c487..7594c6e4 100644 --- a/steps/36/webapp/i18n/i18n.properties +++ b/steps/36/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 # Hello Panel showHelloButtonText=Say Hello diff --git a/steps/37/README.md b/steps/37/README.md index 1a4b1b05..3c18bf92 100644 --- a/steps/37/README.md +++ b/steps/37/README.md @@ -32,9 +32,9 @@ One part of the ARIA attribute set are the so-called landmarks. You can compare We add the labels we will need for the ARIA regions to the text bundle. ```ini -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 #Overview Page Overview_rootLabel=Overview Page diff --git a/steps/37/webapp/i18n/i18n.properties b/steps/37/webapp/i18n/i18n.properties index 9c970d54..442d3a75 100644 --- a/steps/37/webapp/i18n/i18n.properties +++ b/steps/37/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 #Overview Page Overview_rootLabel=Overview Page diff --git a/steps/38/webapp/i18n/i18n.properties b/steps/38/webapp/i18n/i18n.properties index 9c970d54..442d3a75 100644 --- a/steps/38/webapp/i18n/i18n.properties +++ b/steps/38/webapp/i18n/i18n.properties @@ -1,6 +1,6 @@ -# App Descriptor +# Manifest appTitle=Hello World -appDescription=A simple walkthrough app that explains the most important concepts of UI5 +appDescription=A simple walkthrough app that explains the most important concepts of OpenUI5 #Overview Page Overview_rootLabel=Overview Page