There are a lot of cool things you can do to code blocks using Expressive Code in Astro’s Starlight.
Add File Names to Code Blocks
```js
// my-title.js
export default function MyTitle() {
return <h1>My Title</h1>
}
```
Add Titles to Code Blocks
```js title="my-title.js"
export default function MyTitle() {
return <h1>My Title</h1>
}
```
Add Line Numbers to Code Blocks
```javascript {1}
export default function MyTitle() {
return <h1>My Title</h1>
}
```
Combine diffing with Syntax Highlighting
```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!')
}
```