ExamplesBasicBasic Setup

Basic Setup

This example shows the minimal code required to set up a BlockNote editor in React.

Relevant Docs:

import "@blocknote/core/fonts/inter.css";import { BlockNoteView } from "@blocknote/mantine";import "@blocknote/mantine/style.css";import { useCreateBlockNote } from "@blocknote/react";export default function App() {  // Creates a new editor instance.  const editor = useCreateBlockNote();  // Renders the editor instance using a React component.  return <BlockNoteView editor={editor} />;}