Code blocks

Code blocks are powered by Expressive Code, a project by Astro. This is just a small showcase of functionality, it has a lot of options!

PowerShell terminal example

Write-Output "This one has a title!"

// Example with wrap
function getLongString() {
  return 'This is a very long string that will most probably not fit into the available space unless the container is extremely wide'
}

function demo() {
  console.log('These are inserted and deleted marker types');
  // The return statement uses the default marker type
  return true;
}

function thisIsJavaScript() {
  // This entire block gets highlighted as JavaScript,
  // and we can still add diff markers to it!
  console.log('Old code to be removed')
  console.log('New and shiny code!')
}

```powershell title="PowerShell terminal example"
Write-Output "This one has a title!"
```

```js wrap
// Example with wrap
function getLongString() {
  return 'This is a very long string that will most probably not fit into the available space unless the container is extremely wide'
}
```

```js "return true;" ins="inserted" del="deleted"
function demo() {
  console.log('These are inserted and deleted marker types');
  // The return statement uses the default marker type
  return true;
}
```

```diff lang="js"
  function thisIsJavaScript() {
    // This entire block gets highlighted as JavaScript,
    // and we can still add diff markers to it!
-   console.log('Old code to be removed')
+   console.log('New and shiny code!')
  }
```

Playground

If you add the playground option to the opening code fence for a Worker example, it will add a “Run Worker in Playground” link that will take the user to the Worker’s playground

export default {
  fetch() {
    return new Response("Test!")
  }
}

Run Worker in Playground

```js playground
export default {
  fetch() {
    return new Response("Test!")
  }
}
```