Integrate the HTML/CSS to Image API with the Data Stores API

Setup the HTML/CSS to Image API trigger to run a workflow which integrates with the Data Stores API. Pipedream's integration platform allows you to integrate HTML/CSS to Image and Data Stores remarkably fast. Free for developers.

Popular HTML/CSS to Image and Data Stores Actions#

Create Image From HTML with the HTML/CSS to Image API

Create Image From HTML. See the docs.

Try it

Add or update a single record with the Data Stores API

Add or update a single record in your Pipedream Data Store.

Try it

Create Image From URL with the HTML/CSS to Image API

Create Image From URL. See the docs.

Try it

Add or update multiple records with the Data Stores API

Add or update multiple records to your Pipedream Data Store.

Try it

Append to record with the Data Stores API

Append to a record in your data store Pipedream Data Store. If the record does not exist, a new record will be created in an array format.

Try it

Overview of HTML/CSS to Image#

With the HTML/CSS to Image API you can:

Generate images from HTML/CSS code snippets
Use CSS selectors to grab specific elements from the HTML code
Use HTML5 canvas to crop, filter, or resize the images
Output the resulting images in various formats (JPEG, PNG, GIF, WebP)

Connect HTML/CSS to Image#

import { axios } from "@pipedream/platform"
export default defineComponent({
  props: {
    html_css_to_image: {
      type: "app",
      app: "html_css_to_image",
    }
  },
  async run({steps, $}) {
    const data = {
      "url": `https://google.com`,
    }
    return await axios($, {
      method: "post",
      url: `https://hcti.io/v1/image`,
      auth: {
        username: `${this.html_css_to_image.$auth.user_id}`,
        password: `${this.html_css_to_image.$auth.api_key}`,
      },
      data,
    })
  },
})

Overview of Data Stores#

With the Data Stores API, you can build applications that:

Store data for later retrieval
Retrieve data from a store
Update data in a store
Delete data from a store

Connect Data Stores#

export default defineComponent({
  props: {
    myDataStore: {
      type: "data_store",
    },
  },
  async run({ steps, $ }) {
    await this.myDataStore.set("key_here","Any serializable JSON as the value")
    return await this.myDataStore.get("key_here")
  },
})