JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://fb.me/react-js-fiddle-integration.js"></script>

JavaScript 1.7

/** @jsx React.DOM */

var products = [
    {name: 'Vacuum', price: '$5.00', category: 'Cleaning'},
    {name: 'Mop', price: '$10.00', category: 'Cleaning'},
    {name: 'iPod', price: '$20.00', category: 'Electronics'},
];

var App = React.createClass({
    render: function() {
        var items = [];
        var lastCategory = null;
        products.forEach(function(product) {
            if (product.category !== lastCategory) {
                items.push(<tr><td colspan="2"><strong>{product.category}</strong></td></tr>);
            }
            items.push(<tr><td>{product.name}</td><td>{product.price}</td></tr>);
            lastCategory = product.category;
        });
        return (
            <table>
                <tbody>
                    <tr><th>Product</th><th>Price</th></tr>
                    {items}
                </tbody>
            </table>
        );
    }
});
 
React.renderComponent(<App products={products} />, document.body);