Ruby on Rails 7.0 : HOTWIRE

So, What’s new in rails 7.0 ?

Applications generated with Rails 7 will get Turbo and Stimulus (from Hotwire) by default, instead of Turbolinks and UJS.

Hotwire may be a new approach that delivers quick updates to the DOM by sending HTML over the wire.

Basically, Hotwire is an alternative approach to building modern web applications without using much JavaScript by sending HTML instead of JSON over the wire.

This makes for quick first-load pages, keeps templet rendering on the server, and permits for an easier, additional productive development expertise in any programming language, while not sacrificing any of the speed or responsiveness related to a standard single-page application.

The heart of Hotwire is Turbo. The collection of complementary techniques for dashing up page changes and kind submissions, dividing advanced pages into parts, and streaming partial page updates over WebSocket. All while not writing any JavaScript in the slightest degree. And designed from the beginning to integrate perfectly with native hybrid applications for iOS and Android.

While Turbo sometimes takes care of a minimum of 80% of the interactivity that traditionally would have needed JavaScript, there are still cases wherever a dash of custom code is needed. Stimulus makes this straightforward with an HTML-centric approach to state and wiring.

Standardizes the means that internet and native components of a mobile hybrid application consult with one another via markup language bridge attributes. This makes it simple to have more and more level-up web interactions with native replacements.

Installation :

1. Add the hotwire-rails gem to your gemfile : gem ‘hotwire-rails’

Gemfile

1. Run bundle install
2. Run rails hotwire:install

Implementation :

Let’s make a simple CRUD app like Twitter using hotwire in which we can post/tweet a message, like a message, retweet a message, and edit a message.

So, Let’s move forward towards the implementation.

Basically, We are going to make an app like the below :

app -> views -> tweets -> index.html.erb

app -> models -> tweet.rb

app -> views -> tweets -> _form.html.erb

app -> views -> tweets -> _tweet.html.erb

app -> views -> tweets -> edit.html.erb

app -> views -> tweets -> new.html.erb

app -> views -> tweets -> show.html.erb

app -> controllers -> likes_controller.rb

app -> controller -> retweets_controller.rb

app -> controller -> tweets_controller.rb (1)

app -> controller -> tweets_controller.rb (2)

app -> controller -> tweets_controller.rb (3)