Zuplo
Guide

​Multiple APIs

This documentation is for the preview version of the Dev Portal. If you are not part of the preview program, please refer to the current Dev Portal docs.

Dev Portal supports creating documentation and API references for multiple APIs and can work with as many OpenAPI documents as you need.

In order to do this you will need to modify the Dev Portal Configuration file to include additional APIs.

​Configuration

Using multiple APIs is a configuration setting that you can add in the Dev Portal Configuration file.

​Step 1: Add all your APIs

First, create a new array in Dev Portal Configuration that lists each API you want to include as its own object:

const navigation = [
  {
    label: "The first API",
    id: "the-first-api-openapi",
  },
  {
    label: "The second API",
    id: "the-second-api",
  },
];
typescript

​Step 2: Modify the config

Modify the Dev Portal Configuration file so that the sidebar and apis settings look the same as below:

import { type ZudokuConfig } from "zudoku";

const navigation = [
  {
    label: "The first API",
    id: "the-first-api-openapi",
  },
  {
    label: "The second API",
    id: "the-second-api",
  },
];

const config: ZudokuConfig = {
  topNavigation: [
    { id: "home", label: "Home" },
    { id: "home2", label: "Home 2" },
  ],
  redirects: [{ from: "/", to: "/home" }],
  sidebar: {
    home: [
      ...navigation.map((item) => ({
        type: "link",
        label: item.label,
        href: `/${item.id}`,
      })),
    ],
  },
  apis: [
    ...navigation.map((item) => ({
      type: "url",
      input: `http://example.com/api/${item.id}.json`,
      navigationId: item.label,
      skipPreload: true,
    })),
  ],
};

export default config;
typescript

As you can see in the example above, we have added additional code that maps through the items in the navigation array and creates new sidebar items, as well as the correct URLs for the APIs.

← Previous page
Custom pages
Next page →
Custom Plugins