# node-json2html

> json2html - HTML templating in pure javascript

Latest version **3.4.0** (published 2026-08-14) · 0 weekly downloads

## Install

```sh
npm install node-json2html
pnpm add node-json2html
yarn add node-json2html
bun add node-json2html
```

## Health

**Score 60/100 (C)** — status: active.

Positive: has types; no vulnerabilities; recently updated; high quality score.

Warnings: low downloads; no esm support.

## Facts

| | |
|---|---|
| Version | 3.4.0 |
| Published | 2026-08-14 |
| First published | 2013-03-07 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | * |
| Dependencies | 0 |
| Unpacked size | 152.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 644 |
| Author | Chad Brown |
| Maintainers | moappi |
| Keywords | json2html, templating, html, web, templates, json |

## Links

- npm: https://www.npmjs.com/package/node-json2html
- Repository: https://github.com/moappi/json2html
- Homepage: https://www.json2html.com
- Issues: https://github.com/moappi/json2html/issues
- npm.io page: https://npm.io/package/node-json2html

## Alternatives

- [@mapbox/jsonlint-lines-primitives](https://npm.io/package/@mapbox/jsonlint-lines-primitives.md) — 5.3M weekly downloads
- [reftools](https://npm.io/package/reftools.md) — 3.5M weekly downloads
- [@hey-api/openapi-ts](https://npm.io/package/@hey-api/openapi-ts.md) — 3.5M weekly downloads
- [@mapbox/geojson-rewind](https://npm.io/package/@mapbox/geojson-rewind.md) — 2.4M weekly downloads
- [turbo-stream](https://npm.io/package/turbo-stream.md) — 1.7M weekly downloads

## Recent versions

- 3.4.0 (latest) — 2026-08-14
- 3.3.3 — 2025-02-22
- 3.3.2 — 2025-02-05
- 3.2.2 — 2024-12-11
- 3.2.0 — 2024-09-11
- 3.0.0 — 2023-12-19
- 2.2.3 — 2023-02-09
- 2.2.2 — 2022-04-08
- 2.2.1 — 2022-01-24
- 2.2.0 — 2021-11-03
- 2.1.0 — 2021-03-30
- 2.0.0 — 2021-03-26
- 1.4.0 — 2020-03-02
- 1.3.0 — 2019-12-01
- 1.2.0 — 2018-02-09
- … 3 more at https://npm.io/package/node-json2html/versions

## README

json2html
------------------

json2html is an open source javascript library that uses json templates to render JSON objects into HTML.

Build lightning fast, interactive client side templates using nothing but javascript.

Free to use under the MIT license.

<a href='http://www.json2html.com'>www.json2html.com</a> for full documentation.

Features
--------------

+   Native JS templates that work both the client and server
+   Interactive with embedded events directly in your templates
+   Reusable components
+   Dynamically update parts of your rendered templates when changes occur
+   Use simple inline js functions for complex logic
+   100% javascript so no need to learn special syntax

Example
--------------
```javascript
json2html.render(
    [
        {"name": "Sasha", "age":27},
        {"name": "Bobby", "age":45}
    ], 
    {"<>": "li", "html":[
    	{"<>": "span", "text": "${name} (${age} years old)"}
      ]});
    
```

Will render the following html

```html
<li>
	<span>Sasha (27 years old)</span>
</li>
<li>
	<span>Bobby (45 years old)</span>
</li>
```

jQuery
=========
Use seemlessly with jQuery, oh did we also mention that you can embed events in your template?  Forget attaching your events after you've rendered your templates.

```javascript
 {"<>":"button","text":"Click Me","onclick":(e)=>{
	alert("You just clicked this");
  }};		
```
Will render into the following html and will alert when clicked :)

```html
<button>Click Me</button>
```

Node.js
=========
Use your temlpates seemlessly on Node.js

Installation
------------

	npm install node-json2html


Usage
-----
```javascript
	const json2html = require('node-json2html');
        
	let html = json2html.transform([{'name':'Bob','fruit':'Bananas'},{'name':'Rick','fruit':'Apples'}],{"<>":"div","text":"${name} likes ${fruit}"});
```

TypeScript:
```javascript
  import json2html from 'node-json2html'; //Import module
  const { render, component } = json2html; // Import methods from Json2html
```

<a href='http://www.json2html.com'>www.json2html.com</a> for full documentation.

---
_Source: https://npm.io/package/node-json2html · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._