{"id":20484526,"url":"https://github.com/sap-samples/ui5-cap-event-app","last_synced_at":"2025-04-06T03:11:46.084Z","repository":{"id":45384753,"uuid":"303769820","full_name":"SAP-samples/ui5-cap-event-app","owner":"SAP-samples","description":"Showcase of SAP Cloud Application Programming Model and OData V4 with draft mode in a freestyle SAPUI5 app and an SAP Fiori elements app.","archived":false,"fork":false,"pushed_at":"2025-03-07T13:58:53.000Z","size":4729,"stargazers_count":92,"open_issues_count":1,"forks_count":36,"subscribers_count":14,"default_branch":"main","last_synced_at":"2025-03-30T02:09:08.914Z","etag":null,"topics":["odata","openui5","sample","sample-code","sap-cap","sapui5","ui5","wip"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/SAP-samples.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-10-13T16:48:13.000Z","updated_at":"2025-03-07T13:58:57.000Z","dependencies_parsed_at":"2025-03-07T14:33:07.385Z","dependency_job_id":"90e83862-fa03-4026-96db-94b4d692f30c","html_url":"https://github.com/SAP-samples/ui5-cap-event-app","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SAP-samples%2Fui5-cap-event-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SAP-samples%2Fui5-cap-event-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SAP-samples%2Fui5-cap-event-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SAP-samples%2Fui5-cap-event-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SAP-samples","download_url":"https://codeload.github.com/SAP-samples/ui5-cap-event-app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247427012,"owners_count":20937213,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["odata","openui5","sample","sample-code","sap-cap","sapui5","ui5","wip"],"created_at":"2024-11-15T16:23:38.437Z","updated_at":"2025-04-06T03:11:46.070Z","avatar_url":"https://github.com/SAP-samples.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ui5-cap-event-app\n\n[![REUSE status](https://api.reuse.software/badge/github.com/SAP-samples/ui5-cap-event-app)](https://api.reuse.software/info/github.com/SAP-samples/ui5-cap-event-app)\n\nShowcase of two UI5 user interfaces, one built with freestyle [SAPUI5](https://ui5.sap.com/) (or rather [OpenUI5](https://openui5.org/)), the other using [SAP Fiori elements](https://community.sap.com/topics/fiori-elements), with a [CAP](https://cap.cloud.sap/docs/) backend, using [OData V4](https://www.odata.org/) with [Draft mode](https://experience.sap.com/fiori-design-web/draft-handling/).\n\n## Description\n\nThis app uses simple attendee registration and administration for events as an example scenario for demonstrating the data handling and overall setup. The app consists of three parts: an end-user UI implemented in freestyle SAPUI5, a metadata-driven administrator UI generated with Fiori elements and a Node.js-based CAP backend.\nWhile the code implements a complete end-to-end full-stack app, it is kept as simple as possible and the main focus is on freestyle SAPUI5 code making use of OData V4 as well as of \"Draft\" functionality to persist non-final datasets.\n\nFurther details about how the functionality is implemented can be found [in the documentation](docs/documentation.md).\n\n## Requirements\n\n- [Node.js](https://nodejs.org) (latest LTS version which supports npm workspaces)\n- [SAP CAP CLI](https://www.npmjs.com/package/@sap/cds-dk) (do `npm install -g @sap/cds-dk`)\n- [sqlite3](https://www.sqlite.org) (only needed separately on Windows, [commandline tools](https://www.sqlite.org/download.html) zip need to be downloaded, extracted, and directory added to the PATH)\n\n## Download and Installation\n\n1. Clone the project.\n\n    ```sh\n    git clone https://github.com/SAP-samples/ui5-cap-event-app\n    cd ui5-cap-event-app\n    ```\n\n2. Use npm to install the dependencies.\n\n    ```sh\n    npm i\n    ```\n\n## Running the Project\n\nExecute the following command to run the project locally for development (start the CDS server running the admin UI and form UI embedded):\n\n```sh\nnpm start\n```\n\nAs also shown in the terminal after executing this command, the CDS server is running on http://localhost:4004/.\n\nFor the form UI, you can use user name `employee@test.com` with password `123`. For the admin UI, use `admin@test.com` and password `123`.\n\n## Building the Project\n\nExecute the following command to build the project and get one integrated app that can be deployed (build the form UI, admin UI, and CDS server):\n\n```sh\nnpm run build\n```\n\n**Prerequisite:** `npm run build` runs `cds build` in the CDS server package which requires `@sap/cds-dk`. Please ensure to install `@sap/cds-dk` globally via:\n```sh\nnpm i -g @sap/cds-dk\n```\n\nAfter building the individual packages, the build results will be copied to the central `dist` folder. The resulting package inside the `dist` folder consists of the CDS server hosting the form UI and the admin UI as well as a sandbox Fiori launchpad to start the individual UIs.\n\nTo start the generated package, just run `npm install` and `npm start` inside the `dist` folder. This installs the dependencies and starts the CDS server hosting the UIs. Now the sandbox Fiori launchpad can be opened on http://localhost:4004/.\n\n## Debugging the Project\n\nWe have prepared two ways of debugging the Node.js part of the app easily:\n\n### Debugging with VSCode\n\nThe launch configuration \"debug server in vscode\" is part of the project and can be used to run the CAP server in debug mode and debug directly in VSCode (e.g. set breakpoints).\n\nNote: the UI parts are not started by this launch configuration. To debug the interaction of server and UI, the form UI or admin UI has to be started separately with `npm run start:ui-form` or `npm run start:ui-admin`.\n\n## Limitations\n\nThe local database uses in-memory mode. Data will be re-initialized after each restart.\n\nThe sample does not cover deployment of the app, where additional considerations e.g. regarding database and authentication are needed.\n\n## How to obtain support\n\nThe sample code is provided **as-is**. No support is provided.\n\n## References\n\nOther projects demonstrating similar use-cases:\n\n* https://github.com/vobu/ui5-cap - a repository showcasing the use of UI5 Tooling, CAP + UIveri5-based testing in an app for media upload and preview (as presented at UI5conBE in Feb 2020) by Volker Buzek.\n* https://blogs.sap.com/2020/07/08/ui5-freestyle-app-in-cap - a UI5 freestyle app in CAP, with approuter, by Wouter Lemaire.\n* https://blogs.sap.com/2020/09/06/developing-a-fiori-elements-app-with-cap-and-fiori-tools/ - about developing a Fiori elements app with CAP and Fiori Tools\n* https://blogs.sap.com/2020/04/07/ui5-tooling-a-modern-development-experience-for-ui5/ - an overview on the UI5 Tooling and its extensions for a modern development experience.\n\n## License\n\nCopyright (c) 2020-2023 SAP SE or an SAP affiliate company. All rights reserved.\nThis project is licensed under the Apache Software License, version 2.0 except as noted otherwise in the [LICENSE](LICENSE) file.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsap-samples%2Fui5-cap-event-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsap-samples%2Fui5-cap-event-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsap-samples%2Fui5-cap-event-app/lists"}