Skill 023

HTML Report Generator

Overview

The HTML Report Generator skill enables users to convert JSON data into a structured and styled HTML report. This can be helpful for creating dashboards or reports that need to be shared in a web-friendly format.

Workflow Decision Tree

Generating HTML Reports

Use the "Creating a new HTML report" workflow below.

Creating a New HTML Report

To generate an HTML report, you can use a simple templating engine like Handlebars.js to create a visually appealing report.

Sample Code

Here is a basic example of how to create an HTML report:

const fs = require('fs');
const Handlebars = require('handlebars');

// Sample JSON data
const data = {
  title: 'Monthly Sales Report',
  sales: [
    { product: 'Widget A', amount: 300 },
    { product: 'Widget B', amount: 450 },
  ],
};

// HTML template
const template = `

{{title}}

{{title}}

{{#each sales}}{{product}}: {{amount}}{{/each}}

`;

// Compile the template
const compiledTemplate = Handlebars.compile(template);

// Generate the HTML report
const html = compiledTemplate(data);

// Write the HTML report to a file
fs.writeFileSync('report.html', html);

Conclusion

The HTML Report Generator skill provides a straightforward way to visualize and present JSON data in an accessible HTML format, making it ideal for web-based reporting.

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: legendtkl
• Source: legendtkl/agentic-skill-router
• License: MIT
• Homepage: https://legendtkl.github.io/agentic-skill-router/

Install and usage instructions live in the source repository linked above.