https://github.com/connected-web/html-asset-generator
A utility that converts HTML and CSS templates into rendered Image assets, and can also produce Text and JSON assets.
https://github.com/connected-web/html-asset-generator
Last synced: 4 months ago
JSON representation
A utility that converts HTML and CSS templates into rendered Image assets, and can also produce Text and JSON assets.
- Host: GitHub
- URL: https://github.com/connected-web/html-asset-generator
- Owner: connected-web
- Created: 2015-11-30T20:35:00.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2022-12-30T20:52:05.000Z (over 3 years ago)
- Last Synced: 2025-08-20T13:39:32.640Z (10 months ago)
- Language: JavaScript
- Homepage:
- Size: 733 KB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# HTML Asset Generator (HAG)
The generator processes `instructions` to `render` `assets` based on `templates` combined with `data`.
Supports rendering of HTML to Images using `webshot`, and creation of text based assets such as JSON, CSS, and HTML using Handlebar templates.
[](https://david-dm.org/connected-web/node-hag)
## Key terms
- Instruction - a JSON block that specifies what to render
- Asset - a useful item to be generated, such as an image, HTML, text, or JSON file
- Template - a cookie-cutter layouts that can be fed with data
- Renderer - the method used to combine the template, with the data, and then save it out as an asset
- Data - JSON data that can be fed into templates to create an asset
## Project structure
- `generator.js` - the entry point to run the generator
- `build` - the target directory for produced assets
- `templates` - a folder of usable templates
- `templates/template-name` - an individual template
- `instructions` - a folder full of data to be rendered
## Installation
`npm install node-hag -g`
## Getting started
1. Run `hag --help` to view up-to-date Help and Instructions
2. Run `hag init` to create an example project in the current working directory
3. Run `hag generate` to compiled the instructions and generate assets
If that all worked as expected, take a closer look at the `instructions` folder, and the resulting `build` folder to see the generated assets.
## Guides
- [Command line arguments](docs/command-line-args.md)
- [Instructions, data, and templates](docs/instructions-data-templates.md)
- [Output formats; text, json, image](docs/output-formats.md)
- [Samples and use cases](docs/samples-and-use-cases.md)
## Development
- Checkout the project, run `npm install`
- Run `npm test`
## Changelog
See: [CHANGELOG.md](CHANGELOG.md)