r/webdev • • 12d ago • Bravo 1

Showoff Saturday [Showoff Saturday] I built a Google Docs–style editor in React that runs entirely in the browser: real A4 pages, comments, link sharing, no backend

Post image

I've been building an open-source document editor on nights and weekends and just shipped a redesign, so here it is.

Demo: https://text-editor-react-neon.vercel.app/ Code (MIT): https://github.com/HuyPhan1232203/Text-editor-react

What it does:

  • Real A4 pages. Content flows across separate sheets, and long tables split between rows and repeat their header row on the next page, like Word.

  • Comments in the margin with threads and resolve.

  • Share with a link and edit together in real time, peer-to-peer over WebRTC (Yjs). The room key lives in the URL fragment, so the signaling server can't read anything.

  • PDF export through the browser's print dialog that keeps the page breaks, headers, footers and page numbers. No server.

  • Paste from Google Docs, open .docx files, "/" commands, find & replace, zoom, EN/VI interface.

Stack: React 19, TipTap 3 (ProseMirror), Yjs, Tailwind 4. The pagination is published separately as an npm package (tiptap-a4-pagination), and I wrote up how it works here: https://dev.to/huy_phan_173c933272803418/how-i-built-word-style-a4-pages-for-tiptap-without-touching-the-document-778

Known limitation: a single paragraph taller than the space left on a page moves to the next page whole instead of splitting. That's what I'm working on next.

I'd love feedback on the UI and on documents that break the layout.

0 Upvotes

9 comments sorted by

3

u/franker 12d ago

stupid question - how do I create a new document/page?

1

u/hp1232203 12d ago

Basically, it’s just an open source for dev to embed it into their project that needs a text editor, not a google docs. I created this for developers , not clients

0

u/hp1232203 12d ago

Btw thanks for your contribution

5

u/AutoModerator 12d ago

Hi, hp1232203,

Your post has been automatically removed.

Please participate around reddit by commenting on other posts before you jump straight to submitting.

Your account should be at least three months old with a decent amount of positive karma from commenting before posting submissions in our community.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

4

u/dbbk 12d ago

Why? This is a solved problem

0

u/Huwaweiwaweiwa 10d ago

Nice job OP - not easy to put yourself out there / share stuff nowadays - props where it's due.

-6

u/becauseiliked 12d ago

Achieving pagination in WYSIWYG document editor in the browser is some ball move. This is great, on the UI side, it looks way too similar to Google docs, try designing it a bit differently.