Introduction to builders

Builders provide a way to create complex images using React-like components API. Canvacord under the hood abstracts over satori, an enlightened library to convert HTML and CSS to SVG by providing JSX interface as well as rendering the SVG to other numerous formats like PNG, JPEG, WEBP, etc. This makes it possible to create complex images with little to no configuration.

​

Anatomy of a Builder

A builder is a class that extends the Builder class exported by Canvacord. This class contains all the complex logic behind rendering the jsx.

​

Usage

// Create an instance of the builder
const builder = new MyBuilder()
  // Set the message property
  .setMessage("Hello, World!");

// Render the builder into image
const result = await builder.build();
// ^ result is by default a png buffer