Guide

Maths

The following features are configured via the Next.js configuration and are available in all themes.

Variance ($\sigma^2$) = $np(1 - p)$

will be rendered as: $\sigma^2$ = $np(1 - p)$

Quotes

There is nothing to writing. All you do is sit down at a typewriter and bleed.

— Ernest Hemingway

YouTube Video 1

YouTube Video 2

YouTube Video 3

Image

Landscape

You can even make it full-bleed using <Bleed full>:

Image Full

Landscape

Coding

bleed.mdx

<Bleed>Hey, I can use **Markdown** syntax here.</Bleed>
 
<Bleed full>
  ![Landscape](https://source.unsplash.com/eaxwP9J_V6s/1600x398)
</Bleed>
 
<Bleed full>
  <iframe
    src="https://codesandbox.io/embed/swr-states-4une7"
    width="100%"
    height="500px"
    title="SWR-States"
  />
</Bleed>

Tabs

hi.cpp

#include <iostream>

Highlight 1

💡

An example of the blog theme can be found here (opens in a new tab).

SVG Images from web

This pattern is to fetch data and revalidate it later.

A pattern for fetch and revalidate

SVG Image from File Storage

This pattern is to fetch data and change the key and revalidate it later.

A pattern for key change

Emoji

📝

Fallback data and previous data are not considered "loaded data," so when you use fallback data or enable the keepPreviousData option, you might have data to display.

GIF Images

An example of using the isLoading state

Video

Video with Caption

Video: using focus revalidation to automatically sync login state between pages.

Introduction