How can I integrate TiddlyWiki with Reactjs webapp

86 views
Skip to first unread message

Raphael Chaula

unread,
Dec 8, 2020, 1:00:01 AM12/8/20
to TiddlyWiki
Hello here,
I am new to TiddlyWiki, just found about it recenlty, here is my usecase.

I want to integrate it to my Reactjs webapp in such a way when the app starts, I fetch all the wikis I stored in my database and add them to tiddlywiki to display, when user creates a new wiki, I store it in database, the same happens when user edits a wiki.

So I just want to know how to embed Tiddlywiki in Reactjs if there is a way or solution out there, and how can I load wikis from my database when TiddlyWiki starts and store a new wiki or an update to my database when users creates or edits one.

Thanks in advance!

Joshua Fontany

unread,
Dec 8, 2020, 7:32:05 PM12/8/20
to TiddlyWiki
I have not seen any integrations using both. This might be a bit hard to pull off, actually, as TW manipulates the DOM in a different way than React does.

Whenever you make a change to any data in a TW web-page, that change is communicated up the "tree of widgets" (a Javascript-object model native to TW which is used as an internal state mechanism), and if necessary the new widget tree renders a new DOM (& that gets re-rendered onscreen via the browser).

Where-as with REACT, "React is unaware of changes made to the DOM outside of React. It determines updates based on its own internal representation, and if the same DOM nodes are manipulated by another library, React gets confused and has no way to recover."

From: https://reactjs.org/docs/integrating-with-other-libraries.html

I would start there.

Best,
Joshua F
Reply all
Reply to author
Forward
0 new messages