Published
Edited
Oct 19, 2020
1 star
import { React, jsx } from '@mbostock/hello-jsx'
React.render(jsx`<div style={{fontWeight:700}}>I am using React!</div>`)
md `Let's make a list`
function List(props) {
const { items } = props;
return jsx({ items })`<div>
<ul>
${items.map(item => `<li>${item}</li>`).join('')}
</ul>
</div>`;
}
React.render(jsx({ List, items: ['a', 'b', 'c'] })`<List items={items}/>`)
myBox = (color = "#ccc") => ({
margin: '.5rem',
border: `2px solid ${color}`,
borderRadius: '.5rem'
})
hello = React.render(
jsx({
style: myBox('#ccc')
})`<div style={style}>Hello!</div>`
)
d3 = require('d3')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
