GeneratorGeneratorCreates a project, a component or configuration once, when you run it, rather than taking part in every build.See every one →What this type is →by a community orgby a community orgPublished by a community organisation, so it outlives any one maintainer.See every one →
generator-ui5-ts-app-fcl
A generator that scaffolds a UI5 TypeScript application built around the FlexibleColumnLayout and bound to an OData service, asking for the endpoint, entity set, key and fields to show.
A master-detail FlexibleColumnLayout app bound to an OData service needs the service endpoint, an entity set, its key and the fields to show before any code exists. On top of the basic TypeScript template's appname and namespace, this generator asks for those: an endpoint pointing at the service document, one entity set from the list it reads there, the key field used as the routing parameter to the detail page, a title field bound in the list and on the detail page, and one further field of your choosing. It runs through Easy-UI5generator-easy-ui5A Yeoman meta-generator that scaffolds UI5 projects, prompting for a target platform, and loads further sub-generators from the UI5 Community for TypeScript apps, launchpad plugins and libraries.community org, ui5 as yo easy-ui5 ts-app-fcl or standalone as yo ./generator-ui5-ts-app-fcl, and npm start then runs the generated project through the UI5 tooling development server.
Facts
Last pushLicenceApache-2.0
Where it sits
Lives in
Provides
GeneratorsUI5GeneratorsGetting from nothing to a project that runs, and from a project that runs to one that has the piece you just decided you need. Two different moments: the first is a one-time decision about layout, the second recurs for the life of the project.
Optional
generator-easy-ui5generator-easy-ui5The host generator that runs this one as yo easy-ui5 ts-app-fcl; the README's standalone route runs it from a local path with Yeoman alone.
Who is behind it
Wouter LemaireWouter LemaireMaintains this
In the atlas: maintains 25, contributes to 39, wrote 12@lemaiwoPeter MuessigPeter MuessigMaintains this
In the atlas: maintains 14, contributes to 80, wrote 1@petermuessigUI5 CommunityUI5 CommunityMaintains this
In the atlas: maintains 69@ui5-communitymaintainersAndreas KunzContributes to this
In the atlas: contributes to 19@akudevJohannes GluchContributes to this
In the atlas: contributes to 12@H4zeMarian ZeisContributes to this
In the atlas: maintains 35, contributes to 86, wrote 25@marianfooMauricio LaufferContributes to this
In the atlas: maintains 16, contributes to 41, wrote 4@mauriciolaufferVolker BuzekContributes to this
In the atlas: maintains 7, contributes to 53, wrote 2@vobuIlya KlopkovContributes to this
In the atlas: contributes to 9@whydrae6 contributors
In the atlas: maintains 25, contributes to 39, wrote 12@lemaiwoPeter MuessigPeter MuessigMaintains this
In the atlas: maintains 14, contributes to 80, wrote 1@petermuessigUI5 CommunityUI5 CommunityMaintains this
In the atlas: maintains 69@ui5-communitymaintainersAndreas KunzContributes to this
In the atlas: contributes to 19@akudevJohannes GluchContributes to this
In the atlas: contributes to 12@H4zeMarian ZeisContributes to this
In the atlas: maintains 35, contributes to 86, wrote 25@marianfooMauricio LaufferContributes to this
In the atlas: maintains 16, contributes to 41, wrote 4@mauriciolaufferVolker BuzekContributes to this
In the atlas: maintains 7, contributes to 53, wrote 2@vobuIlya KlopkovContributes to this
In the atlas: contributes to 9@whydrae6 contributors
What it declares
Every artifact
- Type
- Generator
- Origin
- By a community org
As a generator
- Generates
- A new project
- Run with
- Yeoman
- Distributed through
- does not say
Connections
Group by
NodeRelationBasis
Functional
GeneratorsGeneratorsStarting a project, and adding pieces to one that runsSAP and community, narrow by design
provides
stated
provides Generators
Scaffolds a UI5 TypeScript FlexibleColumnLayout application whose master and detail pages are bound to an OData service, from the endpoint, entity set, key and fields given while it runs.
“UI5 TypeScript application using the FlexibleColumnLayout. This generator was build as a plug-in for the community project Easy-UI5 by SAP.”“Besides the options you have in the basic TypeScript template like appname and namespace, we have added more options that will be used to configure the OData service:”
Starting a project, and adding pieces to one that runs
Technical
generator-easy-ui5generator-easy-ui5Yeoman meta-generator for scaffolding UI5 projectscommunity org, ui5
optionally needs
stated
optionally needs generator-easy-ui5
run through Easy-UI5 rather than standalone as `yo ./generator-ui5-ts-app-fcl`
The host generator that runs this one as `yo easy-ui5 ts-app-fcl`; the README's standalone route runs it from a local path with Yeoman alone.
“This generator was built as a plug-in for the community project [Easy-UI5](https://github.com/SAP/generator-easy-ui5/) by [SAP](https://github.com/SAP/).”“$> npm i -g yo generator-easy-ui5”
Yeoman meta-generator for scaffolding UI5 projects
Download
README
quoted from ui5-community/generator-ui5-ts-app-fcl under Apache-2.0, readui5-community/generator-ui5-ts-app-fcl/README.mdthe maintainer’s wordsOn GitHub
generator-ui5-ts-app-fcl
Generator which uses the official UI5 tooling and supports multiple deployment targets such as the SAP Business Technology Platform. This generator was built as a plug-in for the community project Easy-UI5 by SAP.
Usage with easy-ui5
$> npm i -g yo generator-easy-ui5
$> yo easy-ui5 ts-app-fcl
_-----_
| | ╭──────────────────────────╮
|--(o)--| │ Welcome to the easy-ui5 │
`---------´ │ generator! │
( _´U`_ ) ╰──────────────────────────╯
/___A___\ /
| ~ |
__'.___.'__
´ ` |° ´ Y `After the generation of your project you can use npm start (or yarn start) to start the local development server.
Standalone usage
Note the different greeting when the generator starts:
$> npm i -g yo
$> yo ./generator-ui5-ts-app-fcl
_-----_ ╭──────────────────────────╮
| | │ Welcome to the │
|--(o)--| │ generator-ui5-ts-app-fcl │
`---------´ │ generator! │
( _´U`_ ) ╰──────────────────────────╯
/___A___\ /
| ~ |
__'.___.'__
´ ` |° ´ Y `Options
Besides the options you have in the basic TypeScript template like appname and namespace, we have added more options that will be used to configure the OData service:
EndPoint
This should be an endpoint that points to the Service Document of your OData service, like for example the northwind service: https://services.odata.org/V2/OData/OData.svc/
EntitySet
Based on the provided OData Service Document, the generator will provide you a list of all available OData EntitySets. You will be able to select one as your main EntitySet. The Master page will show a list of all entries in this EntitySet, while the detail page will show the details of the selected entry.
Key
The next option is the key. You'll have to select the field you would like to use as the main key. This will be used in the routing configuration as parameter to navigate to the detail page.
Title
The title option will be bound to the title in the list as well as on the detail page.
Other Field
This last one is an open and free field to bind a second field to the table and on the detail page. It can be a numbe or a description of the title. Just one additional field to kickstart your project!
Support
Please use the GitHub bug tracking system to post questions, bug reports or to create pull requests.
Contributing
We welcome any type of contribution (code contributions, pull requests, issues) to this generator equally.
License
This project is licensed under the Apache Software License, version 2.0 except as noted otherwise in the LICENSE file.
This generator is provided to you by Peter Muessig and Wouter Lemaire
Others providing
Compare all 32 on the Generators page →GeneratorsGeneratorsGetting from nothing to a project that runs, and from a project that runs to one that has the piece you just decided you need. Two different moments: the first is a one-time decision about layout, the second recurs for the life of the project.SAP and community, narrow by design
- abap2UI5 Layout Editorabap2UI5 Layout EditorA browser editor that lays out a UI5 view by drag and drop and writes it out as one abap2UI5 app class, pulled into the system with abapGit.community org, abapDrag-and-drop UI5 view editor that writes an abap2UI5 app classfrom ABAP
- generator-ui5-react-nestgenerator-ui5-react-nestA Yeoman generator that scaffolds a pnpm monorepo with a UI5 app and a Vite React app, which the UI5 app embeds through a custom control, UI5Nest, rather than an iframe.independent, ui5Yeoman generator for a UI5 app that loads a React appfrom UI5
- SAP Build CodeSAP Build CodeSAP's development environment on BTP for SAPUI5, SAP Fiori, mobile and CAP applications that run on the SAP BTP, Cloud Foundry Runtime, in which Joule generates models, services, logic, tests and apps.sap official, btpDevelopment environment on BTP for UI5, Fiori, mobile and CAPfrom BTP/BAIP
- @cap-handler/generator@cap-handler/generatorInteractive generator for CAP event handlers: reads the model through the reflection API, asks which service, target and phase, then writes the handler file and wires the import and registration into the service implementation.independent, capInteractive generator for CAP event handler filesfrom CAP
- com.sap.cds:cds-maven-plugincom.sap.cds:cds-maven-pluginThe Maven plugin that runs CDS build steps in a CAP Java project: compiling the model, generating typed Java accessor interfaces and adding facets to an existing project.sap official, capMaven plugin running CDS build steps in a CAP Java projectfrom CAP
- com.sap.cds:cds-services-archetypecom.sap.cds:cds-services-archetypeA Maven archetype that generates a new CAP Java project: a Spring Boot service with a starter CDS model, wired to the CDS Maven plugin for its build.sap official, capMaven archetype generating a new CAP Java projectfrom CAP
- @khalidmh/capx@khalidmh/capxAn opinionated installer for CAP Node.js projects — asks a short set of questions, runs cds init, adds the chosen facets, then writes the configuration and starter files that make those choices work together.independent, capInteractive project installer for CAP Node.jsfrom CAP
- ui5-control-generatorui5-control-generatorA command-line generator that writes UI5 custom controls, in JavaScript or TypeScript, from the html files in a project, with control logic and renderer split into two files by default.independent, ui5Command line generator of UI5 custom controls from htmlfrom UI5
- AbapGeneratorAbapGeneratorAn ABAP transaction, ZABAP_GENERATOR, that generates a Model-View-Controller-style project by copying a template package's objects into a new one under the project's name.independent, abapABAP transaction generating an MVC-style project from a templatefrom ABAP
- Joule in SAP Build CodeJoule in SAP Build CodeJoule's generative AI inside SAP Build Code, pitched as "optimized for Java and JavaScript application development": opened from SAP Business Application Studio's activity bar, slash commands generate a CAP data model, services, sample data, business logic and a Fiori elements UI.sap official, capJoule's generative AI inside SAP Build Codefrom CAP
- @sap/cds-dk@sap/cds-dkThe command line client and development toolkit for CAP projects, with the commands cds build, cds deploy, cds watch and cds add among them.sap official, capCommand line client and development toolkit for CAPfrom CAP
- @sap/generator-cap-project@sap/generator-cap-projectThe CAP project generator behind SAP Business Application Studio's wizard; its readme says it is meant to be used only there.sap official, capCAP project generator behind SAP Business Application Studio's wizardfrom CAP
- @sap/generator-cds@sap/generator-cdsA CDS project generator, deprecated by its own readme in favour of installing @sap/cds-dk globally.sap official, capCDS project generator, deprecated in favour of @sap/cds-dkfrom CAP
- @sap-ux/cap-config-writer@sap-ux/cap-config-writerSAP's writer module for changing a CAP project's configuration from code, so a tool can add a UI5 app to a project that already exists, returning a mem-fs editor whose commit writes the changes.sap official, capWriter module for changing a CAP project's configuration from codefrom CAP
- @sap-ux/create@sap-ux/createSAP Fiori tools as a command: npx @sap-ux/create changes the features of a Fiori project that already exists, through its add, generate, convert, remove, update and change subcommands.sap official, ui5Command line for changing features of an existing Fiori projectfrom UI5
- @sap-ux/fe-fpm-writer@sap-ux/fe-fpm-writerA library that writes flexible programming model elements, such as a custom page wired into the app's routing, into a Fiori elements application for OData v4 from Node code.sap official, ui5Writer of flexible programming model elements into Fiori elements appsfrom UI5
- @sap-ux/fiori-generator-shared@sap-ux/fiori-generator-sharedThe shared functions and types the Fiori generators are built from; a dependency of theirs rather than a generator itself.sap official, capShared functions and types of the Fiori generatorsfrom CAP
- @sap-ux/odata-service-writer@sap-ux/odata-service-writerA library that adds an OData service to a UI5 project that already exists, writing the file updates from a config object naming the service url, its OData version and a destination.sap official, ui5Writer that adds an OData service to an existing UI5 projectfrom UI5
- @sap-ux/ui5-application-writer@sap-ux/ui5-application-writerA library that writes the base structure of a UI5 project from Node code, out of an app id, title and description, returning a mem-fs editor so a generator needs no template engine of its own.sap official, ui5Writer of the base structure of a UI5 project from Node codefrom UI5
- create-easy-ui5create-easy-ui5An npm-init and npx wrapper that runs the Easy-UI5 Yeoman generator without a global Yeoman install, handing control to generator-easy-ui5 and forwarding any arguments.community org, ui5npm-init wrapper for the Easy-UI5 Yeoman generatorfrom UI5
- create-wdi5create-wdi5An npm initializer that adds wdi5 end-to-end testing to an existing UI5 application, installing WebdriverIO's peer dependencies, writing a wdio.conf file and setting an npm script.community org, ui5npm initializer adding wdi5 testing to an existing UI5 appfrom UI5
- generator-easy-ui5generator-easy-ui5A Yeoman meta-generator that scaffolds UI5 projects, prompting for a target platform, and loads further sub-generators from the UI5 Community for TypeScript apps, launchpad plugins and libraries.community org, ui5Yeoman meta-generator for scaffolding UI5 projectsfrom UI5
- generator-ui5-addgenerator-ui5-addA Yeoman generator that creates UI5 tooling-extension projects and manages the tooling extensions of an existing project, from the bestOfUI5 catalogue.community org, ui5Yeoman generator for UI5 tooling-extension projectsfrom UI5
- generator-ui5-appgenerator-ui5-appA Yeoman generator, built on the official UI5 tooling, that scaffolds a new UI5 application in one pass, run as a plug-in for Easy-UI5 or standalone, ready for npm start.community org, ui5Easy-UI5 generator scaffolding a new UI5 applicationfrom UI5
- generator-ui5-controlgenerator-ui5-controlA Yeoman generator that scaffolds a UI5 custom control structured for npm distribution, with a manual test app with live reload and a Jest test suite already wired in.community org, ui5Yeoman generator for UI5 custom controls distributed via npmfrom UI5
- generator-ui5-library-webcgenerator-ui5-library-webcA Yeoman generator that scaffolds a UI5 library wrapping UI5 Web Components on the official UI5 tooling, run through Easy-UI5 or standalone, and served afterwards with npm start.community org, ui5Yeoman generator for UI5 libraries wrapping UI5 Web Componentsfrom UI5
- generator-ui5-librarygenerator-ui5-libraryA Yeoman generator, built on the official UI5 tooling, that scaffolds a new UI5 library as a plug-in for Easy-UI5.community org, ui5Easy-UI5 generator scaffolding a new UI5 libraryfrom UI5
- generator-ui5-projectgenerator-ui5-projectA Yeoman generator for a UI5 project holding several applications in npm workspaces, with eight subgenerators for recurring tasks and a choice of six deployment targets.community org, ui5Yeoman generator for UI5 projects holding several applicationsfrom UI5
- generator-ui5-ts-appgenerator-ui5-ts-appA Yeoman generator, built on the official UI5 CLI, that scaffolds a new UI5 application in TypeScript with its tsconfig and UI5 CLI configuration, as a plug-in for Easy-UI5.community org, ui5Easy-UI5 generator scaffolding a TypeScript UI5 applicationfrom UI5
- generator-ui5-ts-librarygenerator-ui5-ts-libraryA Yeoman generator, built on the official UI5 tooling, that scaffolds a new UI5 library in TypeScript as a plug-in for Easy-UI5.community org, ui5Easy-UI5 generator scaffolding a TypeScript UI5 libraryfrom UI5
- generator-ui5-wdi5generator-ui5-wdi5A Yeoman generator that scaffolds wdi5 end-to-end test configuration and sample tests into a UI5 app, wrapping npm init wdi5 in prompts and run through Easy-UI5.community org, ui5Yeoman generator scaffolding wdi5 test configuration into a UI5 appfrom UI5
Details
Sources
Sources are graph entities: the same page may back several entries, and an unreachable source flags every row that rests on it.
Compatibility and provenance
discovered viaAdded by hand
first seen in the atlas
ecosystem and domainui5, developer-experience
History in the atlas
- First seen.
For your agent
- Ref
artifact:ui5-community-generator-ui5-ts-app-fcl- JSON
- /artifacts/ui5-community-generator-ui5-ts-app-fcl.json
- MCP
- Connecting an agent