UI5 Controls demo project

The UI5 Controls demo project exists out of two artifacts, a UI5 library that contains the UI5 controls and a UI5 app:

It can help to make a dedicated folder where you put in the different artifacts for the UI5 Control demo together. In this folder you can clone the following GitHub Repositories:

UI5 Library: https://github.com/lemaiwo/ui5-control-space-library.git
UI5 App: https://github.com/lemaiwo/ui5-control-space-demoapp.git

Run the following commands for both starting with the library:

git clone <url-repo>
npm i
npm run build

Once done for both you can run the app using npm start or npm run start:dist. This last one will run from the dist folder as a prebuild version of the app like it runs in production.

The library is connected to the app using local npm dependencies in the package.json:

This is resolved by the UI5 tooling and load the library when starting the UI5 app.

UI5 Web Components demo project

The UI5 Web Components demo project exists out of tree artifacts:

A UI5 Web Component package that contains the web components
A UI5 Library that contains the UI5 control wrappers for the web components
A UI5 app that consumes the Web Components through the UI5 controls from the UI5 library

It can again help to make a dedicated folder where you put in the different artifacts for the UI5 Web Component demo together. In this folder you can clone the following GitHub Repositories:

Web Component package: https://github.com/lemaiwo/ui5-webc-space-package.git
UI5 Library: https://github.com/lemaiwo/ui5-webc-space-library.git
UI5 App: https://github.com/lemaiwo/ui5-webc-space-demoapp.git

Run the following commands for both starting with the library:

git clone <url-repo>
npm i
npm run build
- Use git bash for building the Web Component package

Once done for both you can run the app using npm start or npm run start:dist. This last one will run from the dist folder as a prebuild version of the app like it runs in production.