Curator

A masonry gallery viewer for open museum APIs.

Report Bug · Request Feature · Ask Question

Supported Open Museum APIs:

• Art Institute of Chicago
• The Metropolitan Museum of Art Collection
• The Cleveland Museum of Art Open Access

See demo on Github Pages

Developing Locally

Install dependencies

pnpm i

Run server & watch for changes

pnpm dev

Adding a new Open Museum API

1. Implement an image fetcher that satifies ImageFetcher interface

// src/services/imageFetcher.ts

export interface Image {
  id: string;
  url: string;
  alt: string;
}

export interface ImageFetcher {
  fetchImages(query: string, count: number): AsyncGenerator<Image, void, unknown>;
}

The image fetcher must:

• Define an async *fetchImages() generator.

• Yield Image objects containing id, url, and alt.

// src/lib/api/<api>.ts

export const ArticFetcher: ImageFetcher = {
  async *fetchImages(
    query: string,
    count: number,
  ): AsyncGenerator<Image, void, unknown> {
      ...
      yield {
        id: <image_id>,
        url: <image_url>,
        alt: <image_alt>,
      };
}

2. Add it to the available museum options

// src/lib/index.ts

export interface OpenMuseumApi {
  fetcher: ImageFetcher;
  value: string;
  label: string;
}

export const museumOptions: Record<string, OpenMuseumApi> = {
  artic: {
    fetcher: ArticFetcher,
    value: "artic",
    label: "Art Institute of Chicago",
  },
  ...
}