Skip to content

samzong/swagger-online

Repository files navigation

Swagger Online

A modern Swagger UI aggregator for browsing multiple swagger specifications across different services and versions. Built with React and designed for Swagger OpenAPI ecosystem.

Features

Core Capabilities

  • Multi-Version Support: Browse and switch between multiple versions of API services seamlessly
  • Dynamic Configuration: Automatically processes and downloads Swagger specifications from URLs or local files
  • Version Comparison: Compare two API versions side-by-side with detailed diff visualization
    • Highlights added, removed, and modified endpoints
    • Shows parameter and response schema changes
    • Color-coded diff indicators (green for additions, red for deletions, yellow for modifications)
  • Flexible Layouts: Multiple navigation modes to suit your workflow
    • Top navigation bar (full-width or centered)
    • Left/right sidebar navigation
    • Responsive design for all screen sizes

Quick Start

Development

# Install dependencies
npm install

# Start development server
# Note: This will automatically download Swagger specs before starting
npm start

The app will open at http://localhost:3000

Swagger Configuration

Edit public/swagger.config.yaml to define your API services and versions:

title: "DaoCloud OpenAPI"
logo: "" # Optional: URL to logo image

specs:
  ServiceName:
    - https://example.com/api/v1.0.0.json
    - https://example.com/api/v0.9.0.json
  AnotherService:
    - /local/path/to/spec.json

The build script (scripts/build-specs.js) will:

  1. Download specs from URLs or copy from local paths
  2. Organize them in public/swagger-files/
  3. Generate public/config.json for runtime use
  4. Skip already-downloaded files to speed up builds

Environment Variables

The app uses PUBLIC_URL from environment for GitHub Pages deployment:

  • Set in package.json via the homepage field
  • Automatically handled by Create React App

Docker

Build

docker build -t swagger-online .

Run Container

docker run -p 8080:80 swagger-online

The application will be available at http://localhost:8080

The Dockerfile uses a multi-stage build:

  1. Build stage: Node.js 18 Alpine - installs dependencies, downloads specs, builds React app
  2. Production stage: Nginx Alpine - serves static files

About

Swagger Online is a lightweight React tool that aggregates multiple Swagger/OpenAPI specs into one unified, searchable, and comparable interface.

Topics

Resources

License

Contributing

Stars

Watchers

Forks

Packages

 
 
 

Contributors