Public
Edited
Sep 19, 2023
Insert cell
# React

Insert cell
React.createElement('div', { className: 'aa'}, "A")
Insert cell
React.createContext("ctx")
Insert cell
React.createRef()
Insert cell
mutable v = null
Insert cell
v[1](5)
Insert cell
{
function A() {
const a = React.useState(0)
mutable v = a

return `AAAA ${a[0]}`
}

const el = document.createElement('div')
const root = ReactDOM.createRoot(el)
root.render(React.createElement(A))

return el
return [el, root]
}
Insert cell
{
const div = document.createElement("div");
const root = ReactDOM.createRoot(div);
root.render({
...React.createElement(),
type: "h1",
props: { style: { color: "red" }, children: "Heading Level 1" },
});

return div
}
Insert cell
Insert cell
React = await import('https://esm.sh/react')
Insert cell
ReactDOM = await import('https://esm.sh/react-dom')
Insert cell
htm = {
const m = await import("https://esm.sh/htm");
m.default.bind(React.createElement);
return m.default;
}
Insert cell

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.
Learn more