Sandpack embedded code playground

See the full blog post about using this Sandpack React component in Markdown!

Here's the code for this page:


      ---
      import BaseLayout from '../../layouts/BaseLayout.astro'
      import MySandpack from '../../components/experiments/MySandpack.jsx';

      const codez = `export default function App() {
        return (
          <div>
            <h1>Hello Sandpack on my site!</h1>
            <p>This is the custom starting code.</p>
            <p>Now, I can start with custom examples.</p>
          </div>
        )
      }`
      ---
      <BaseLayout title="Sandpack code playground">
        <main>
          <h1>Sandpack embedded code playground</h1>
          
          <MySandpack 
          client:only="react"
          codez={codez} />

        </main>
      </BaseLayout>