# preact-render-to-string
[](https://www.npmjs.com/package/preact-render-to-string)
[](https://travis-ci.org/preactjs/preact-render-to-string)
Render JSX and [Preact] components to an HTML string.
Works in Node & the browser, making it useful for universal/isomorphic rendering.
\>\> **[Cute Fox-Related Demo](http://codepen.io/developit/pen/dYZqjE?editors=001)** _(@ CodePen)_ <<
---
### Render JSX/VDOM to HTML
```js
import render from 'preact-render-to-string';
import { h } from 'preact';
/** @jsx h */
let vdom =
content
;
let html = render(vdom);
console.log(html);
//
content
```
### Render Preact Components to HTML
```js
import render from 'preact-render-to-string';
import { h, Component } from 'preact';
/** @jsx h */
// Classical components work
class Fox extends Component {
render({ name }) {
return { name };
}
}
// ... and so do pure functional components:
const Box = ({ type, children }) => (
{ children }
);
let html = render(
);
console.log(html);
//
Finn
```
---
### Render JSX / Preact / Whatever via Express!
```js
import express from 'express';
import { h } from 'preact';
import render from 'preact-render-to-string';
/** @jsx h */
// silly example component:
const Fox = ({ name }) => (
{ name }
This page is all about {name}.
);
// basic HTTP server via express:
const app = express();
app.listen(8080);
// on each request, render and return a component:
app.get('/:fox', (req, res) => {
let html = render();
// send it back wrapped up as an HTML5 document:
res.send(`${html}`);
});
```
---
### License
[MIT]
[Preact]: https://github.com/developit/preact
[MIT]: http://choosealicense.com/licenses/mit/