catchy-image v0.1.6

catchy-image

A Node.js module for dynamically generating Open Graph images.

:art: Example

It can create an image like this by using the module.

:arrow_forward: Usage

Executing this module requires Node v12.

Install a package using the npm CLI.

$ npm install --save catchy-image

Write codes for importing a module, setting up options for generating an image, and executing a module.

const catchy = require('catchy-image')

async function run() {
    const options = {
      output: {
        directory: '',
        fileName: 'thumbnail.png',
      },
      image: {
        width: 1200,
        height: 630,
        backgroundColor: '#222639',
        // backgroundImage: require.resolve('./images/background.jpg'),
      },
      style: {
        title: {
          fontFamily: 'Noto Sans CJK JP',
          fontColor: '#bb99ff',
          fontWeight: 'bold',
          fontSize: 64,
          paddingTop: 100,
          paddingBottom: 200,
          paddingLeft: 150,
          paddingRight: 150,
        },
        author: {
          fontFamily: 'Noto Sans CJK JP',
          fontColor: '#f0f5fa',
          fontWeight: '400',
          fontSize: 42,
        },
      },
      meta: {
        title: 'How to dynamically create  an Open Graph image.',
        author: 'Kentaro Matsushita',
      },
      fontFile: [
        {
          path: require.resolve('./fonts/NotoSansCJKjp-Bold.otf'),
          family: 'Noto Sans CJK JP',
          weight: 'bold',
        },
        {
          path: require.resolve('./fonts/NotoSansCJKjp-Regular.otf'),
          family: 'Noto Sans CJK JP',
          weight: '400',
        },
      ],
      iconFile: require.resolve('./images/avatar.jpeg'),
      timeout: 10000,
    }

    const output = await catchy.generate(options)
    console.log(`Successfully generated: ${output}`)
  } catch (error) {
    console.error(error)
  }
}

run()

:gear: Options

Output

Image

Style

Title

Author

Meta

Font File

Icon File

Timeout

:construction_worker: Development

$ npm install
# Execute an example script (src/example.js)
$ npm run build && npm run dev

Tests

$ docker build -t snapshot-test:0.1.1 .
$ docker run -v `pwd`/test:/usr/src/app/test snapshot-test:0.1.1

:memo: Licence

MIT

:heart: Acknowledgments

Inspired by @shuhei's article.

Generating Twitter Card Images from Blog Post Titles - Shuhei Kagawa