live_react - React inside Phoenix LiveView

I needed to reuse React components from my Chrome extension in my Phoenix/LiveView backend. I noticed that for Svelte/Vue, there are live_vue and live_svelte. So, I created the equivalent in React, live_react:

Here is a small demo on Fly: demo.

I have not yet implemented SSR, slots, sigil, and the macro to generate components.

8 Likes

Great work! I do wonder if there is some kind of shared abstraction these libraries could build on - if there was something like live_vite or live_frontend, or something like that, then have adaptors for each FE framework.

4 Likes

The LOC of each library is quite short but specific to Vite, Svelte, React.

Builder JS Prod
live_svelte Custom esbuild none
live_vue vite vue
live_react hex esbuild react, react-dom

Have a look at the hooks.js of each

3 Likes

Great work! Thank you for live_react!

I’m not sure if it’s what @johnknott had in mind but have you looked at Komodo?

3 Likes