Skip to Content
Technical Articles

cf-create-app: Create End-to-End apps and deploy to Cloud Foundry in minutes

Hi developer!

We are in an exiting moment for SAP cloud development. Since SAP decided to offer Cloud Foundry environments, the company has release several tools and frameworks that clearly speed up development, and what I even like the most, it gives us flexibility to choose what we want to use and how we want to use it.

This is great, but it also makes the learning curve harder, as we have to learn many tools, the documentation is very spread, and the boilerplate to start a project gets complicated.

Today I want to introduce a tool to solve this issue, and get an end-to-end application up and running in the cloud with just a couple of commands and a few minutes: cf-create-app

This is a project my friends and colleagues @albertodelgado, @sergio-delgado, and myself have built, and now we are continuously improving. Read this article till the end, to know how you can contribute.

Index

  • Recent updates
  • What does this project do?
  • Requirements
  • How to use it
  • Contribute

Recent updates

Aug 2020 – Adding React.js, Angular and Vue.js as FrontEnd options

What does this project do?

With just one command it creates an MTA app in your local environment, with the following features:

  1. A CAP application to design your services, your DB schema, and much more.
  2. A preconfigured HTML5 application, choosing between React.js, Angular or Vue.js (These frameworks are not mandatory, and you can easily change the FrontEnd app for whatever technology you prefer. Preconfigured UI5 apps are coming in future releases of this project)
  3. An Application Router configuration, to serve your backend and Frontend under the same domain.
  4. The HTML5 Application Repository configuration + HTML5 deployer needed to host your HTML5 app in the cloud.
  5. An instance of the authentication an authorisation service (XSUAA)
  6. An MTA configuration to easily deploy your app to the cloud with one command (Node.js instance, HANA DB instance, HTML5 Application Repository, App Router Instance, XSUAA, etc.)

Basically, this gives you all you need to build a huge collection of apps just taking care of your business logic.

Prerequisites

Local prerequisites

Pre-requisite Description Documentation
Node.js v12 Required runtime for this boilerplate. Recommended install with NVM. Download
cf cli Cloud Foundy CLI tool Download

Cloud prerequisites

To be able to deploy this application you need an SAP Cloud Platform account in the Cloud Foundry (CF) environment.

In your CF account space, the following services must be available:

  • HTML5 Application Repository | html5-apps-repo
  • SAP HANA Schemas & HDI Containers | hana
  • Authorization & Trust Management | xsuaa

 

How to use it

Just open a terminal in your workspace and run:

npx cf-create-app YOUR_APP_NAME

Choose the framework you want to use for your FrontEnd app, or just skip the UI installation if you don’t need it.

After several seconds installing all the dependencies needed, you end up with an application with the following structure

File / Folder Purpose
app/ content for UI frontends go here
approuter/ Application Router configuration files
db/ your domain models and data go here
html5Deployer/ helper application to deploy HTML5 apps to the HTML5 Application Repository service in SAP Cloud Platform
srv/ your service models and code go here
package.json project metadata and configuration
README.md this getting started guide

You are ready now to add your business logic:

  • Add/modify entities to your DB schema on db/ folder
  • Add/modify services to your backend app in the srv/ folder
  • Add/modify your custom HTML5 application in the app/ folder
  • Modify the Application Router behaviour on approuter/xs-app.json

If you are ready to deploy your app to the cloud, you just have to run 2 commands:

Build your MTA deployable archive:

mbt build

Deploy your app:

cf deploy mta_archives/<yourMtaArchiveName.mtar>

And that’s it. When the process is finished you can see the application router endpoint in the console.

Open it in a browser, and you will see your application hosted in the SAP Cloud.

Navigate to <yourHost>/api to check your backend services.

Cool! Now that you see the magic, probably you want to know more. Please check our documentation in our repo to know about:

  1. HOW TO: Run and develop your app in localhost —> Localhost Development
  2. HOW TO: Create this boilerplate manually step-by-step —> Manual Configuration

Contribute

We use this all the time to build our POCs very quickly, but this project has just started, and we would love to have your feedback, help and wisdom to make it grow and serve multiple purposes.

Please feel free to contribute with code or comments in our repository: https://github.com/turutupa/cf-create-app

These are some of the next improvements in our pipeline:

  • Add UI5 app via setup script
  • Include test automation to the setup script
  • Add a basic CI/CD pipeline via setup script
/
2 Comments
You must be Logged on to comment or reply to a post.