Previously, you set up Gloo Gateway, the portal server, and several sample apps. In this tutorial, you bundle your apps into ApiProducts that you later expose in a frontend developer portal.

Before you begin

Complete the portal setup tutorial.

Verify your ApiDocs

With Gloo Portal, you can share REST API services that conform to the OpenAPI specification (OAS), v2 or v3. Gloo uses an ApiDoc custom resource to identify the OpenAPI spec for all of the API services in your environment. For more options to create ApiDocs, see the Create ApiDocs guide.

  1. Describe the app services that you created in the previous tutorial. Check the annotations of the services. For more information about the annotations or to update them, see the Create ApiDocs guide.

    Example output:

      annotations:
       gloo.solo.io/scrape-openapi-pull-attempts: "60"
       gloo.solo.io/scrape-openapi-retry-delay: 1s
       gloo.solo.io/scrape-openapi-source: /swagger.json
       gloo.solo.io/scrape-openapi-use-backoff: "false"
      
  2. List the ApiDocs in each app’s namespace.

      kubectl get apidocs -A
      
  3. Describe one of the ApiDocs, and verify that the ApiDoc has the OpenAPI spec for the service. For more information, see the Verify ApiDocs guide.

      kubectl describe apidocs -n tracks
      

    Example output:

      ...
    Spec:
      Openapi:
        Inline String:  {"components":{"schemas":{"Author":{"properties":{"id":{"type":"string"},"name":{"type":"string"},"photo":{"type":"string"}},"type":"object"},"Module":{"properties":{"authorId":{"type":"string"},"content":{"type":"string"}
      

Create API products

API products are what your users find and use in your developer portal. The API products might represent an entire product with many APIs, such as a pet store, or a large feature within the product that you want to treat separately, such as a checkout cart. Each API product might represent a particular version of your API.

API products target the route that the backing app is available on. This way, you have greater flexibility in how you structure your API products. For example, you might create several HTTPRoutes that are backed by the same app. For each route, you can apply different routing rules and policies, such as rate limits and external auth. Then, you can create different ApiProducts for different routes.

  1. Create an ApiProduct for the Tracks app. Notice that you configure fields such as id and displayName that describe the ApiProduct, as well as an image in the customMetadata.imageURL field. Then, you configure a single version of the API in the ApiProduct, v1. You create the ApiProduct in the same namespace as the HTTPRoute. This way, you do not need to create a Kubernetes ReferenceGrant to let the ApiProduct refer to the HTTPRoute.

      kubectl apply -n gloo-system -f- <<EOF
    apiVersion: portal.gloo.solo.io/v1
    kind: ApiProduct
    metadata:
      labels:
        expose-portal: "true"
      name: tracks-svc-api-product
      namespace: gloo-system
    spec:
      id: "tracks"
      displayName: "Catstronauts Course Tracks"
      customMetadata:
        imageURL: https://raw.githubusercontent.com/solo-io/gloo-mesh-use-cases/fbf090f7f6e9dd14c1b14d7c274b8611c9b0443e/gloo-gateway/portal/astronauts-image.jpeg
      versions:
      - apiVersion: "v1"
        openapiMetadata:
          title: "Catstronauts REST API v1"
          description: "REST API for Catstronauts to retrieve data for tracks, authors and modules."
          termsOfService: "You must authenticate to use this API! And other Terms of Service."
          contact: "support@example.com"
          license: "License info, such as MIT"
        customMetadata:
          compatibility: "None"
          lifecyclePhase: "Generally Available"
        targetRefs:
        - group: gateway.networking.k8s.io
          kind: HTTPRoute
          name: tracks-route
          namespace: gloo-system  
    EOF
      
  2. Repeat the previous steps for the Petstore ApiProduct.

      kubectl apply -n gloo-system -f- <<EOF
    apiVersion: portal.gloo.solo.io/v1
    kind: ApiProduct
    metadata:
      labels:
        expose-portal: "true"
      name: petstore-svc-api-product
      namespace: gloo-system
    spec:
      id: "petstore"
      displayName: "Pet Store"
      customMetadata:
        imageURL: https://raw.githubusercontent.com/solo-io/gloo/8d9df95602c506067d49db9b1447b4003b19a070/docs/content/img/portal/petstore-food-bowl-collar.png
      versions:
      - apiVersion: "v1"
        openapiMetadata:
          title: "Pet Store REST API v1"
          description: "Totally awesome API for all things pets!"
          termsOfService: "You must authenticate to use this API! And other Terms of Service."
          contact: "support@example.com"
          license: "License info, such as MIT"
        customMetadata:
          compatibility: "None"
          lifecyclePhase: "Generally Available"
        targetRefs:
        - group: gateway.networking.k8s.io
          kind: HTTPRoute
          name: petstore-route
          namespace: gloo-system
    EOF
      
  3. Check the status of your ApiProducts. Notice the FAILED message that indicates no portal was found. Your ApiProducts are not healthy until you create a portal that shares the ApiProducts with your end users.

      kubectl get apiproducts -n gloo-system -o yaml | grep status -A5
      

    Example output:

      status:
      state:
        State:
          approval: FAILED
          message: no portal found for APIProduct tracks-svc-api-product.gloo-system
          observedGeneration: 1
      

Next steps

Next, create the backend and frontend for your developer portal.