A modern Swagger UI aggregator for browsing multiple swagger specifications across different services and versions. Built with React and designed for Swagger OpenAPI ecosystem.
- 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
# Install dependencies
npm install
# Start development server
# Note: This will automatically download Swagger specs before starting
npm startThe app will open at http://localhost:3000
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.jsonThe build script (scripts/build-specs.js) will:
- Download specs from URLs or copy from local paths
- Organize them in
public/swagger-files/ - Generate
public/config.jsonfor runtime use - Skip already-downloaded files to speed up builds
The app uses PUBLIC_URL from environment for GitHub Pages deployment:
- Set in
package.jsonvia thehomepagefield - Automatically handled by Create React App
docker build -t swagger-online .docker run -p 8080:80 swagger-onlineThe application will be available at http://localhost:8080
The Dockerfile uses a multi-stage build:
- Build stage: Node.js 18 Alpine - installs dependencies, downloads specs, builds React app
- Production stage: Nginx Alpine - serves static files