← Back to scenarios
ScenarioCatalog DB

Cloud provider kit

Create matching storage, queue, and compute clients for a selected cloud provider.

Problem

The application must select a cloud provider implementation while keeping its infrastructure-facing code independent of provider-specific client APIs.

Related patterns

Abstract Factory

View pattern →

Implementations

Abstract Factory

TypeScriptApplication

Abstract Factory in TypeScript

Creates matching button and dialog families for a selected UI theme without exposing concrete component classes to application code.

TypeScript
interface Button {
  render(): string;
}

interface Dialog {
  render(): string;
}

interface UiFactory {
  createButton(): Button;
  createDialog(): Dialog;
}

class LightButton implements Button {
  render() {
    return "Light button";
  }
}

class LightDialog implements Dialog {
  render() {
    return "Light dialog";
  }
}

class DarkButton implements Button {
  render() {
    return "Dark button";
  }
}

class DarkDialog implements Dialog {
  render() {
    return "Dark dialog";
  }
}

class LightUiFactory implements UiFactory {
  createButton() {
    return new LightButton();
  }

  createDialog() {
    return new LightDialog();
  }
}

class DarkUiFactory implements UiFactory {
  createButton() {
    return new DarkButton();
  }

  createDialog() {
    return new DarkDialog();
  }
}

function renderSettings(factory: UiFactory) {
  return [
    factory.createButton().render(),
    factory.createDialog().render(),
  ];
}

Associated technologies