# Quick start

> Render your first Notion page in a Next.js app.

This renders a Notion page in a Next.js App Router page. notionic works with any React framework that renders on the server; only the caching line is Next.js-specific.

```typescript
import { Client } from "@notionhq/client"
import { NotionRenderer } from "notionic"
import { fetchPage } from "notionic/fetch"

const notion = new Client({ auth: process.env.NOTION_TOKEN })

// Rebuild at most once an hour, instead of calling Notion on every visit.
export const revalidate = 3600

export default async function Page() {
  const { page, blocks } = await fetchPage(notion, "your-page-id")
  return (
    <article>
      <h1>{page.title}</h1>
      <NotionRenderer blocks={blocks} />
    </article>
  )
}
```

The page ID is the 32 characters at the end of the page's URL.

## What you get

- Every block of the page, nested blocks included, rendered as HTML on the server.
- Headings with anchor links. Notion's heading 1 renders as `<h2>`, since your page title is the `<h1>`.
- Links between Notion pages pointing to [notion.so](http://notion.so/). To point them at your own routes, see [Linking pages](https://notionic.dev/docs/linking-pages).

> ⏱️ Notion's API allows about 3 requests a second on average. Cache rendered pages rather than fetching on every request.
