From R/3 ABAP to CAP/Fiori Elements on SAP BTP- Deployment

In part 1, I talked about how CAP made my transition to the cloud development world smoother.

This post will show the main steps and code to deploy my application and have a functioning application.

I used the multi-target application approach to build the deployable package.

• Create mta.yml file which contains the services and their associations
• The below section is responsible for the UI

  - name: invoice_browser-app-content
    type: com.sap.application.content
    requires:
      - name: invoice_browser_xsuaa
        parameters:
          service-key:
            name: invoice_browser_xsuaa-key

      - name: invoice_browser-html5-repo-host
        parameters:
          service-key:
            name: invoice_browser-html5-repo-host-key

      - name: invoice_browser-destination-service
        parameters:
          content-target: true
    parameters:
      content:
        subaccount:
          destinations:
            - Name: invoice_browser-html5-repo-host
              ServiceInstanceName: invoice_browser-html5-app-host-service
              ServiceKeyName: invoice_browser-html5-repo-host-key
              sap.cloud.service: invoice_browser
            - Authentication: OAuth2UserTokenExchange
              Name: xsuaa_invoice_browser
              ServiceInstanceName: invoice_browser-xsuaa-service
              ServiceKeyName: invoice_browser_xsuaa-key
              sap.cloud.service: invoice_browser
          existing_destinations_policy: update
    build-parameters:
      no-source: true

  - name: invoice_browser_ui_deployer
    type: com.sap.application.content
    path: .
    requires:
      - name: invoice_browser-html5-repo-host
        parameters:
          content-target: true
    build-parameters:
      build-result: resources
      requires:
        - artifacts:
            - comsapaccinvoicebrowser.zip
          name: comsapaccinvoicebrowser
          target-path: resources/

  - name: comsapaccinvoicebrowser
    type: html5
    path: app/invoice_browser
    build-parameters:
      builder: custom
      commands:
        - npm run build
      supported-platforms: [ ]

• This section is responsible for the service

  - name: invoice_browser-srv
    type: nodejs
    path: gen/srv
    parameters:
      memory: 128M
      disk-quota: 512M
    requires:
      - name: invoice-db
      # added
      - name: invoice_browser_xsuaa
        parameters:
          service-key:
          name: invoice_browser_xsuaa-key
    provides:
      - name: srv-api
        properties:
          srv-url: ${default-url}

• and finally, the DB section

  - name: invoice_browser-db-deployer
    type: hdb
    path: gen/db
    parameters:
      buildpack: nodejs_buildpack
    requires:
      - name: invoice-db

• A resources section that contains most services we will use

  - name: invoice-db
    type: com.sap.xs.hdi-container
    parameters:
      service: hana
      service-plan: hdi-shared
    properties:
      hdi-service-name: ${service-name}


  - name: invoice_browser-destination-service
    type: org.cloudfoundry.managed-service
    requires:
      - name: srv-api
    parameters:
      service: destination
      service-name: invoice_browser-destination-service
      service-plan: lite
      config:
        init_data:
          subaccount:
            existing_destinations_policy: update
            destinations:
              - Name: invoice_browser
                Description: invoice browser service
                Authentication: NoAuthentication
                ProxyType: Internet
                Type: HTTP
                URL: ~{srv-api/srv-url}
                HTML5.DynamicDestination: true
                ForwardAuthToken: true

  - name: invoice_browser-html5-repo-host
    type: org.cloudfoundry.managed-service
    parameters:
      service: html5-apps-repo
      service-name: invoice_browser-html5-app-host-service
      service-plan: app-host

  - name: invoice_browser_xsuaa
    type: org.cloudfoundry.managed-service
    parameters:
      path: ./xs-security.json
      service: xsuaa
      service-name: invoice_browser-xsuaa-service
      service-plan: application

you can find the complete file here 

Now we start the build process.

• Run mbt build to generate the deployable artifacts inside a mta_archives directory
• Navigate to the mta_archives directory and run cf deploy invoice_browser_1.0.0.mtar
• The deployment process will start, and a log will be shown in the console

• if you encountered errors use cf dmol -i f0742617-86d2-11eb-88c9-eeee0a93ad76 to download the logs and investigate the reported issue
• finally, to clean up and delete all the deployed resources, use the command cf undeploy invoice_browser --delete-services --delete-service-keys

You can find the deployed UI, under HTML5 applications.

Click on the tile to open.

Enjoy the cloud ride! Cheers!