MDX Example

Overview¶

This page is just an example MDX.

TOC¶

Will be auto-generated from h2 headings

MDX blocks¶

Paragraph¶

Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15^th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.

List¶

• one
• two
• three

Code blocks¶

async function main() {
  const allUsers = await prisma.user.findMany()
  console.log(allUsers)
}

datasource db {
  provider = "sqlite"
  url      = env("DATABASE_URL")
}
generator client {
  provider = "prisma-client-js"
}
model Post {
  id        Int     @id @default(autoincrement())
  title     String
  content   String?
  published Boolean @default(false)
  author    User?   @relation(fields: [authorId], references: [id])
  authorId  Int?
}
model User {
  id    Int     @id @default(autoincrement())
  email String  @unique
  name  String?
  posts Post[]
}

Code block with copy¶

```js copy async function main() { const allUsers = await prisma.user.findMany() console.log(allUsers) }

### Code block with line number

```js line-number
async function main() {
  const allUsers = await prisma.user.findMany()
  console.log(allUsers)
}

Code block with highlighted code¶

async function main() {
+  added code
-  deleted code
|  neutral highlight
}

Inline code¶

inlineCode

File name with icon¶

4 different icons available - - - -

Tabbed blocks¶

, \]}>

copy bash-symbol npm run dev

Expand/Collapse section¶

Table¶

Fancy button¶

Button text