Embed a val.town playground in your website.

<!doctype html>
<html>
<head>
<title>vt-playground</title>
<script type="module" src="https://raw.esm.sh/vt-playground@latest/dist/vt-playground.js"></script>
</head>
<body>
<vt-playground id="playground" code="console.log('hello world')"></vt-playground>
</body>
</html>
See @pomdtr/vt_playground_demo on val.town for a live demo.
code
: The code to be executed in the playground. The value of this attribute will be updated when the code changes in the playground.val
: A val to load in the playground.
code-change
: Fired when the code changes. The event detail contains the new code.
npm run dev # Start the development server
npm run build # Build the web component
npm run format # apply prettier to the code