Swagger UI + Docker: Initial Setup

This content originally appeared on DEV Community and was authored by box

Environment

Mac
- CPU: Apple M1
- OS: Sonoma 14.6.1
Docker Desktop
- Version: 4.34.2

Dir Structure

* Drawn by mermaid.

graph TD;
    subgraph top["top"]
        subgraph docker["docker"]
            env[".env"]
            docker_compose["docker-compose.yml"]
        end
        subgraph openapi["openapi"]
            openapi_file["openapi.yml"]
        end
    end

docker/.env

SWAGGER_UI_HOST_PORT={host-port}

docker/docker-compose.yml

services:
  swagger-ui:
    image: swaggerapi/swagger-ui:v5.17.14
    environment:
      SWAGGER_JSON: /oas/openapi.yml
    ports:
      - "${SWAGGER_UI_HOST_PORT}:8080"
    volumes:
      - ../openapi:/oas

As image, We specify the one provided by the official.
If the version is specified as latest, the image will be created based on the latest version.
As environment, we specify the absolute path of the OAS file mounted inside the Docker container.
The reason why the property name contains the string 'JSON' is that in the early days, only the .json extension was used for the file.
Now that .yml can also be used, even if the property name does not include the string 'YAML', we can still specify the path of a .yml file there.
As ports, we specify port 8080 mentioned in the documentation as the container port.
As volumes, we share the OAS file between the host machine and the Docker container.
This mapping allows the file on the host machine to be accessible inside the container.

openapi/openapi.yml

Define a minimal API documentation conforming to OAS 3.0.3.

openapi: 3.0.3
info:
  title: Sample API
  version: 1.0.0
paths:
  /hello:
    get:
      summary: Hello World Request
      responses:
        "200":
          description: OK
          content:
            text/plain:
              schema:
                type: string
                example: "Hello, World!"

Docker

Create Container and Image.

Open the terminal.
Move the current-dir to the location where docker-compose.yml is located.
Execute docker compose create.
```
docker compose create
```

Open Swagger UI.

Start the container.
```
docker compose start
```
Open http://localhost:{SWAGGER_UI_HOST_PORT}.
Stop the container once satisfied.
```
docker compose stop
```

This content originally appeared on DEV Community and was authored by box

Print Share Comment Cite Upload Translate Updates

APA

box | Sciencx (2024-10-14T01:54:52+00:00) Swagger UI + Docker: Initial Setup. Retrieved from https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/

MLA

" » Swagger UI + Docker: Initial Setup." box | Sciencx - Monday October 14, 2024, https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/

HARVARD

box | Sciencx Monday October 14, 2024 » Swagger UI + Docker: Initial Setup., viewed ,<https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/>

VANCOUVER

box | Sciencx - » Swagger UI + Docker: Initial Setup. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/

CHICAGO

" » Swagger UI + Docker: Initial Setup." box | Sciencx - Accessed . https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/

IEEE

" » Swagger UI + Docker: Initial Setup." box | Sciencx [Online]. Available: https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/. [Accessed: ]

rf:citation

» Swagger UI + Docker: Initial Setup | box | Sciencx | https://www.scien.cx/2024/10/14/swagger-ui-docker-initial-setup/ |

Please log in to upload a file.

There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.