Use the Application Accelerator Visual Studio Code extension

This topic describes how to use the Application Accelerator Visual Studio Code extension to explore and generate projects from the defined accelerators in Tanzu Application Platform (commonly known as TAP) using VS Code.

Dependencies

Install the extension

Use the following steps to install the Application Accelerator Visual Studio Code extension:

  1. Open Visual Studio Code.
  2. Open the command palette and enter Extensions.
  3. Click Extensions: Install Extensions.
  4. The Extensions view opens on the left side of your screen. In the search box, enter Tanzu.
  5. Click Tanzu App Accelerator.
  6. Click Install.

Configure the extension

Before using the extension, you must configure it as follows:

  1. Go to VS Code settings and click Code > Preferences > Settings > Extensions > Tanzu App Accelerator.

  2. Configure the extension to either use Tanzu Developer Portal or the local engine server:

    • For Tanzu Developer Portal:

      In the Tanzu Application Platform Gui Url text box, add your Tanzu Developer Portal URL. For example, https://tap-gui.myclusterdomain.myorg.com.

      To get the fully-qualified domain name, if you have access to the Tanzu Application Platform cluster that is running Tanzu Developer Portal, run:

      kubectl get httpproxy tap-gui -n tap-gui
      

      The Server Configure Setting page is open with the acc server URL highlighted.

    • For the local engine server:

      To use the local engine server to explore and generate projects based on local files without requiring access to Tanzu Developer Portal, follow the instructions in Use a local Application Accelerator engine server.

Use the extension

You can use the VS Code extension to generate a project and to export your accelerator configuration.

Generate a project

To use the VS Code extension to generate a project:

  1. Click the Tanzu Application Accelerator extension icon in the Activity Bar to explore the defined accelerators.

    In the VS Code Activity Bar, the Tanzu Application Accelerator icon is highlighted.

  2. Choose any of the defined accelerators, fill in the options under Configure Accelerator, and click Next.

    The Tanzu Java Restful Web App accelerator form. The text boxes display example text.

  3. Review your settings and click Generate Project.

Export accelerator configuration options

For faster iteration while writing accelerators, you can export the accelerator options you set under Configure Accelerators to a JSON file. You can use this file to generate your project again from the CLI.

To export your options using the VS Code extension:

  1. Select the accelerator that you want to use.

  2. On the under Configure Accelerators page, use the form to configure the accelerator with your options and click Next.

  3. On the Review and Generate page, export the options you configured by clicking Export Options before clicking Generating Project.

    The Review and Generate page with the Export Options button highlighted.

  4. Choose a location to save the JSON file.

Use the language server provided by the local server

If you are using the local engine server, it includes a language server that enables you to use VS Code features such as syntax highlighting and code folding.

To enable these features, you must start the local server. For instructions, see Use a local Application Accelerator engine server. After you have enabled the local server, these features are available while editing an accelerator.axl file in VS Code.

Note

If the language features are not available after opening an accelerator.axl file, you might have to manually activate the Application Accelerator VS Code extension. To do so, click the Tanzu Application Accelerator extension icon in the Activity Bar, and then re-open the accelerator.axl file.

Retrieve the URL for the Tanzu Developer Portal

If you have access to the Tanzu Application Platform cluster that is running Tanzu Developer Portal, run the following command to determine the fully-qualified domain name:

kubectl get httpproxy tap-gui -n tap-gui

Example output:

NAME      FQDN                                      TLS SECRET     STATUS   STATUS DESCRIPTION
tap-gui   tap-gui.tap.tapdemo.myorg.com             tap-gui-cert   valid    Valid HTTPProxy

Download and install self-signed certificates from the Tanzu Developer Portal

To enable the Application Accelerator extension for VS Code to communicate with a Tanzu Developer Portal instance that is secured using TLS, you must download and install the certificates locally.

Prerequisites

yq is required to process the YAML output.

Procedure

  1. Find the name of the Tanzu Developer Portal certificate. The name of the certificate might look different to the following example.

    kubectl get secret -n cert-manager
    
    NAME                                           TYPE                             DATA   AGE
    canonical-registry-secret                      kubernetes.io/dockerconfigjson   1      18d
    cert-manager-webhook-ca                        Opaque                           3      18d
    postgres-operator-ca-certificate               kubernetes.io/tls                3      18d
    tanzu-sql-with-mysql-operator-ca-certificate   kubernetes.io/tls                3      18d
    tap-ingress-selfsigned-root-ca                 kubernetes.io/tls                3      18d <------- This is the certificate that is needed
    
  2. Download the certificate:

    kubectl get secret -n cert-manager tap-ingress-selfsigned-root-ca -o yaml | yq '.data."ca.crt"' | base64 -d > ca.crt
    
  3. Install the certificate on your local system and fully restart any applications that uses the certificate. After restarting, the application uses the certificate to communicate with the endpoints using TLS. For more information, see Installing a root CA certificate in the trust store in the Ubuntu documentation.

    macOS
    Run:
    sudo security add-trusted-cert -d -r trustRoot -k /Library/Keychains/System.keychain ca.crt
    
    Windows
    Complete the following steps:
    1. Use Windows Explorer to navigate to the directory where the certificate was downloaded and click on the certificate.
    2. In the Certificate window, click Install Certificate….
    3. Change the Store Location from Current User to Local Machine. Click Next.
    4. Select Place all certificates in the following store, click Browse, and select Trusted Root Certification Authorities
    5. Click Finish.
    6. A pop-up window stating The import was successful. is displayed.
check-circle-line exclamation-circle-line close-line
Scroll to top icon