---
title: React and Next.js
description: Use the Nuni component in React, Next.js, Remix, React Router and TanStack Start.
sidebar:
order: 1
---
```bash
npm install @nuniapp/react@latest
```
Render `` **once**, as high as possible in the tree. It is a client component, so it works in Next.js Server Component layouts.
**Next.js App Router**
```tsx app/layout.tsx
import { Nuni } from "@nuniapp/react"
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
{children}
)
}
```
**Next.js Pages Router**
```tsx pages/_app.tsx
import { Nuni } from "@nuniapp/react"
import type { AppProps } from "next/app"
export default function App({ Component, pageProps }: AppProps) {
return (
<>
)
}
```
**Vite / React**
```tsx src/main.tsx
import { Nuni } from "@nuniapp/react"
createRoot(document.getElementById("root")!).render(
)
```
**React Router / Remix**
```tsx app/root.tsx
import { Nuni } from "@nuniapp/react"
export default function App() {
return (
<>
)
}
```
Client-side navigation is detected automatically; comments switch with the page.
The component takes the same [options](/reference/options) as `init()`.