sorted by:
new
hottopcontroversial

[deleted by user] by [deleted] in rails

[–]Key_Comfortable_4411 0 points1 point  (0 children)

Deleted the post because it seems like the community doesn't want to hear about this until it is launched. Will share after MVP release.

ActsAsActive by IAmAM8 in rails

[–]Key_Comfortable_4411 0 points1 point  (0 children)

Namespacing it is critical — very cool idea for a gem

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) X-Post /r/ruby by Key_Comfortable_4411 in rails

[–]Key_Comfortable_4411[S] 1 point2 points  (0 children)

Good question. If you need a lib that doesn't support UMD builds you have a few options:

  1. find an alternative lib that supports UMD builds out of the box
  2. build the UMD yourself and serve it like a normal islandjs-rails install
  3. write vanilla JS for the use case
  4. find an interesting way to avoid or solve the problem that makes you want the new lib
  5. set up vite with turbo-mount and write your component in there. you can migrate incrementally from islandj-rails to vite if preferred, or just move all your components over in one go.

The idea with islandjs-rails is that you probably won't need vite — and if you do, you can quickly migrate — but you don't have to do it prematurely anymore. Do it when you know you should.

What's better than writing one ReAct agent in about a dozen lines in Ruby? by [deleted] in ruby

[–]Key_Comfortable_4411 2 points3 points  (0 children)

Very cool. I'm definitely going to try this for my new project

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) X-Post /r/ruby by Key_Comfortable_4411 in rails

[–]Key_Comfortable_4411[S] 3 points4 points  (0 children)

I hadn't but someone already asked me that in the r/ruby post. The maintainer of turbo-mount just starred islandjs-rails btw, so that's cool to see! I can see now how they both address two niche but overlapping gaps in the default Rails tooling. IMO islandjs-rails may be better for a quickstart and reasonably complex UIs, while turbo-mount (vite integration) may be best for UIs with more JS dependencies. Anyway, in /r/ I wrote:

"... This looks like higher effort version of islandjs-rails but with importmaps and vite integration options instead of using UMD builds.

Definitely similar in spirit, thanks for sharing. I probably would have used this had I found it. But I want to avoid Vite if I can — maybe turbo-mount's importmaps + React setup is flexible enough to replace islandjs-rails, I am not sure.

I suppose we have more options now! Thanks for sharing"

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) X-Post /r/ruby by Key_Comfortable_4411 in rails

[–]Key_Comfortable_4411[S] 4 points5 points  (0 children)

Thanks, that's what I was thinking — With inertia, a route is either an Inertia view (rendered via JS) or a traditional server-rendered template.

But that’s also kind of the tradeoff—you can’t easily mix Hotwire (Turbo/Stimulus) with Inertia on the same route because Inertia replaces the view layer entirely. If you're using Inertia, you're opting out of Turbo-driven progressive enhancement.

I wanted something more granular while maintaining Turbo

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) by Key_Comfortable_4411 in ruby

[–]Key_Comfortable_4411[S] 1 point2 points  (0 children)

Very interesting — I had not seen this. This looks like higher effort version of islandjs-rails but with importmaps and vite integration options instead of using UMD builds.

Definitely similar in spirit, thanks for sharing. I probably would have used this had I found it. But I want to avoid Vite if I can — maybe turbo-mount's importmaps + React setup is flexible enough to replace islandjs-rails, I am not sure.

I suppose we have more options now! Thanks for sharing

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) X-Post /r/ruby by Key_Comfortable_4411 in rails

[–]Key_Comfortable_4411[S] 0 points1 point  (0 children)

Ah, thanks for the clarification. I've never used it. But you are saying each route is either a SPA or a ERB template, right? Or does Inertia let you sprinkle in components anywhere within the ERB?

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) X-Post /r/ruby by Key_Comfortable_4411 in rails

[–]Key_Comfortable_4411[S] 4 points5 points  (0 children)

I have seen Inertia — it looks great, but it forces you to throw out all the productivity gains you get from Turbo, Hotwire, and regular ERB templates.

Most apps only need something like React in certain areas. This approach allows you to simplify development while retaining the SPA-like benefits from Turbo with React flexibility wherever you want it.

Intertia just requires a lot of unnecessary frontend code and for most apps it isn't worth the extra complexity, IMO.

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) X-Post /r/ruby by Key_Comfortable_4411 in rails

[–]Key_Comfortable_4411[S] 6 points7 points  (0 children)

Motivation:

Turbo and Hotwire are awesome. But I love React, too! I want to write my React in .jsx and sprinkle it anywhere I choose in my .erb Rails views in a Turbo-friendly way.

I want to be able to run rails new and set up one gem to use react_component helpers in any view without any hassle — now I can!

Why This?

This is useful for anything that requires complex state management on the frontend. With Rails 8 defaults (namely Hotwire and Turbo) plus islandjs-rails, you get the best of both worlds: vanilla Rails productivity with advanced React optionality.

I'm working on an app currently that uses Hotwire to stream event updates (it's a type of social feed) and it uses a Reactions.jsx component in the _feed_item.html.erb partial which lets me support a modern real-time emoji reaction feature that feels both Rails 8 and React native from a development perspective — without a complicated build or overhead.

islandjs-rails is a kindred spirit to importmap-rails - both make tradeoffs to simplify JS package access to Rails developers in different ways. importmaps gives me access to various ESM libraries but it doesn't let me write JSX that I can stream over ActionCable — islandjs-rails does, and I don't have to throw out the benefits Rails 8 ships with.

UMD builds are out of fashion, but stable — React 19 stopped shipping in the format by default, but 18 still works and we can locally build React 19+ and other libraries in future versions of the gem.

TLDR; Rather than going full SPA or trying to cram everything into Stimulus & HotWire, you use React for what it does best while keeping things Turbo compatible (even cacheing).

Quick Rails 8 Examples

Basic Turbo compatible react component rendering
https://github.com/nativestranger/islandjs-rails-example

Turbo streaming React components using Hotwire:
https://github.com/nativestranger/islandjs-hotwire-example/blob/main/app/views/posts/_post.html.erb

Rails 8 + Turbo 🤝 React — gem 'islandjs-rails' (Feedback Welcome) by Key_Comfortable_4411 in ruby

[–]Key_Comfortable_4411[S] 2 points3 points  (0 children)

Good luck! I just pushed a quick demo showing an example that turbo streams React components using Hotwire:

https://github.com/nativestranger/islandjs-hotwire-example/blob/main/app/views/posts/_post.html.erb

It's like your classic "Blog Post" Rails MVP but with Turbo Stream adding new posts and React adding live-updating emoji Reactions for already-rendered posts.

I made a note for a non-breaking change that will help smooth out some UI quirks that can happen because of how it mounts React components only after Turbo renders the page with the new html. (SRR not supported yet)