Pinned
LiveCodes is here! 🎊
LiveCodes, a feature-rich, open-source, client-side, code playground that supports 80+ languages and frameworks. With LiveCodes, learning, experimenting, documenting, teaching, and sharing code is easier and more enjoyable than ever.
![await using view = new Bun.WebView();
const script = '<script src="https://cdn.jsdelivr.net/npm/livecodes/livecodes.umd.js"></script>';
const url = `data:text/html;charset=UTF-8;base64,${btoa(script)}`;
await view.navigate(url);
const code = `import { useState } from "react";
export default () => {
const [count, setCount] = useState(0);
return <button onClick={() => setCount(count + 1)}>{count}</button>;
};`;
const html = await view.evaluate(`(async() => {
const playground = await livecodes.createPlayground({
headless: true,
config: { script: { language: 'react', content: ${JSON.stringify(code)} } },
});
const { result } = await playground.getCode();
return result;
})()`);
console.log(html);](https://pbs.twimg.com/media/HQVDOlgXYAABYsX?format=webp&name=large)
