-
As an alternative to ViewComponent, I found Phlex. It comes with the boldness of creating components using only Ruby code. This is the kind of boldness that scares. I was scared when I first saw React put HTML, JS, and CSS (StyledComponents) inside a component. I was scared to see Tailwind create classes for each CSS property and have HTML created with dozens of classes in an element. Letting go of this "prejudice" and testing Phlex was important here. But the decisive factor was following the creator of Phlex, Joel Drapper, on social media and realizing how motivated he is.
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
-
view_component
A framework for building reusable, testable & encapsulated view components in Ruby on Rails.
To try to solve this, the first solution that emerged was ViewComponents, a framework created by the folks at Github. ViewComponent is our React, allowing the frontend to be thought of as components. It is the most popular solution today. Although I have never used it, I feel it lacked boldness. It seems like a fusion of partials with erb. But what disappointed me the most was that Github is migrating from Rails to React, and the maintainers of ViewComponents don't seem very enthusiastic.
-
shadcn/ui
A set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.
As we saw in Part I of this article, views in React/Vue/etc. introduced the concept of components. These components are small interface blocks that condense "Style (Tailwind)", "Structure (HTML)", and "Behavior/JavaScript". Componentization, in addition to promoting reuse and facilitating testing, allows customization or use to create your own Design System. But most importantly, they are ready-made. You don't need to reinvent the wheel. A great example is Shadcn, launched only in March 2023 and already has 60k stars on Github.
-
The first step to start the migration to SSR with Phlex and Hotwire was to map the PhlexUI components and place them in Lookbook within our application with our brand colors.
-
But the great benefit of returning to Server Side Rendering (SSR) is not needing APIs. Creating an API, whether REST or GraphQL, makes development slower. And it's not just Rails that is realizing this; Elixir with Liveview, PHP with Livewire, and even JS with HTMX, and React are following this trend. As Deno.js says: The Future (and the Past) of the Web is Server Side Rendering.
