Public
Edited
Mar 7, 2023
Insert cell
Insert cell
{
yield '1';
const response = await request('https://swapi.dev/api/people/1', { mode: 'cors' });
yield '2';
const json = await response.json();
yield json;
}
Insert cell
viewof request = {
const requests = [];
const value = REQUEST;
const self = htl.html`<div>${TEMPLATE()}`;
return Object.defineProperties(self, {
value: {
get: () => value,
},
});

function RENDER() {
self.replaceChildren(TEMPLATE());
self.dispatchEvent(new CustomEvent('input',));
};

function REQUEST(url, options={}) {
requests.push(url, options);
RENDER();
};
function TEMPLATE() {
return htl.html`
<table>
<thead>
<th>Actions
<th>URL
<tbody>
${requests.map((request) => htl.html.fragment`
<tr>
<td>
<button onclick=${() => APPROVE(request)}>Approve</button>
<button onclick=${() => DENY(request)}>Deny</button>
<td>${request.url}
`)}
`; // htl.html
};

function APPROVE() {};
function DENY() {};
};
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