Rhyme

Appearance

React ​

In addition to pure DOM components, Rhyme can also be made to produce React trees.

Simple React Blog ​

Generate a simple blog UI from a JSON dataset.

<!DOCTYPE html>
<html>
<head>
  <title>Parcel Sandbox</title>
  <meta charset="UTF-8" />
  <link rel="stylesheet" href="/styles.css" />
</head>
<body>
  <h1>Hello world</h1>
</body>
</html>
Open on CodeSandboxOpen Sandbox

React Todo App ​

Here we show a slightly more involved example, implementing a Todo app in the style of TodoMVC.

Note that this example orchestrates multiple Rhyme queries to update various pieces of application state.

<!DOCTYPE html>
<html>
<head>
  <title>Parcel Sandbox</title>
  <meta charset="UTF-8" />
  <link rel="stylesheet" href="/styles.css" />
</head>
<body>
  <h1>Hello world</h1>
</body>
</html>
Open on CodeSandboxOpen Sandbox