I've tried a few javascript rich text editors and I like Quill the most. With my default framework being Next.js, I'd like to share how I'm setting it up here. Because I found it a bit confusing to find the right information on how to do it. The official Quill documentation is nice but its written in vanilla JavaScript instead of TypeScript. I'm using Next.js 15.
Disclaimer: It might be easier for you just to use quill-react. But I like using the library directly without a wrapper. That way I can use the latest and greatest version.
First, install the Quill package.
npm install quill
Then create a new file called quill.tsx and copy/paste the following code.
Next create another component which imports the quill component.
I saved this inside a file called quill.editor.tsx.
Note that I'm importing the component dynamically to prevent 'document not found' error, and also to prevent the component from being rendered on the server side.
And that's pretty much it. You can now use the component in your page like so.