How to create static documents in Redoc-CLI from files exported from API Gateway in the form of Swagger +API Gateway extensions

How to create static documents in Redoc-CLI from files exported from API Gateway in the form of Swagger +API Gateway extensions

We have shown how to create static documents using Swagger-UI.

There are many other static document generation tools available, and we introduce Redoc.

Install redoc-cli since it is generated from the command line.

npm install -g redoc-cli

Check the version.

redoc-cli --version

Export the OpenAPI yaml from API Gateway.

Name the file “lambda-dev-oas30-apigateway.yaml”.

There are two ways to use redoc-cli: to start it on a local server and view static HTML, or to generate static HTML.

Start on local server with redoc-cli command

Place yaml in the current directory and execute the following

redoc-cli serve aliastestlambda-api-dev-oas30-apigateway.yaml

Start “http://127.0.0.1:8080”.

It is beautifully rendered.

Generating static HTML with the redoc-cli command

Now generate the HTML that was rendered earlier.

redoc-cli bundle lambda-dev-oas30-apigateway.yaml

By default, “doc-static.html” is created, but the file name can be optionally changed. See Help for details.

redoc-cli bundle --help

You can see that static HTML is generated.

no summary?

The generated HTML shows no summary. This is because there is no summary in the yaml.

Add summary to the GET part of the yaml.

paths:
  /user:
    get:
      summary: GET TEST # Add summary
      responses:
        200:

This will generate HTML again.

A summary is now displayed. Please refer to “What Is OpenAPI?” for other detailed descriptions.

In addition, the download button can be hidden by setting the option --options.hideDownloadButton=true when generating HTML.

redoc-cli bundle lambda-dev-oas30-apigateway.yaml --options.hideDownloadButton=true

–options.pathInMiddlePanel=true to make the path visible.

redoc-cli bundle lambda-dev-oas30-apigateway.yaml --options.hideDownloadButton=true --options.pathInMiddlePanel=true

高橋