{"id":38991,"date":"2025-02-27T10:47:57","date_gmt":"2025-02-27T10:47:57","guid":{"rendered":"https:\/\/www.railscarma.com\/?p=38991"},"modified":"2025-02-27T11:21:55","modified_gmt":"2025-02-27T11:21:55","slug":"guide-complet-de-hotwire-et-turbo-in-rails","status":"publish","type":"post","link":"https:\/\/www.railscarma.com\/fr\/blog\/guide-complet-de-hotwire-et-turbo-in-rails\/","title":{"rendered":"Hotwire et Turbo dans Rails : Guide complet"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"38991\" class=\"elementor elementor-38991\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-087651f elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"087651f\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-e135103\" data-id=\"e135103\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-60f11e3 elementor-widget elementor-widget-text-editor\" data-id=\"60f11e3\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Hotwire (HTML Over The Wire) et Turbo sont des outils modernes qui simplifient la cr\u00e9ation d'applications web dynamiques, rapides et r\u00e9actives sans avoir \u00e0 \u00e9crire beaucoup de JavaScript. Dans ce guide, nous verrons comment mettre en \u0153uvre Hotwire et Turbo dans un environnement <a href=\"https:\/\/www.railscarma.com\/fr\/developpement-dapplications-de-rails-personnalises\/\">Application Rails<\/a>, avec des exemples de codage.<\/p><h3><strong>Qu'est-ce que Hotwire et Turbo ?<\/strong><\/h3><ul><li><strong>Hotwire<\/strong>: Un cadre pour construire des applications web modernes en envoyant du HTML par c\u00e2ble au lieu de JSON. Il comprend Turbo, Stimulus et Strada.<\/li><li><strong>Turbo<\/strong>: Un \u00e9l\u00e9ment central de Hotwire qui acc\u00e9l\u00e8re la navigation dans les pages et les soumissions de formulaires en \u00e9vitant le rechargement complet de la page.<\/li><\/ul><h3><strong>Mise en place de Hotwire dans Rails<\/strong><\/h3><h4><strong>\u00c9tape 1 : Ajouter Hotwire \u00e0 votre application Rails<\/strong><\/h4><p>Ajoutez les gemmes Hotwire \u00e0 votre Gemfile :<\/p><pre>gem 'hotwire-rails' (en anglais)'<\/pre><p>Ex\u00e9cutez les commandes suivantes pour installer Hotwire :<br \/>installation group\u00e9e<\/p><pre>rails hotwire:install<\/pre><p>Cela installera Turbo et Stimulus dans votre application.<\/p><h4><strong>\u00c9tape 2 : Activer le Turbo Drive<\/strong><\/h4><p>Turbo Drive est activ\u00e9 par d\u00e9faut et acc\u00e9l\u00e8re la navigation sur les pages en interceptant les clics sur les liens et les soumissions de formulaires. Aucune configuration suppl\u00e9mentaire n'est n\u00e9cessaire.<\/p><p><strong>Turbo Frames : Construire des composants dynamiques<\/strong><\/p><p>Les Turbo Frames vous permettent de mettre \u00e0 jour des parties sp\u00e9cifiques d'une page sans recharger la page enti\u00e8re.<\/p><p><strong>Exemple : Mise \u00e0 jour d'une section de commentaires<\/strong><\/p><ul><li><strong>Cr\u00e9er un cadre turbo<\/strong><br \/>Enveloppez la section des commentaires dans un cadre Turbo :<pre>&lt;%= turbo_frame_tag \"comments\" do %&gt;<br \/>    &lt;%= render @post.comments %&gt;<br \/>&lt;% fin %&gt;<\/pre><\/li><li><strong>Ajouter un formulaire \u00e0 l'int\u00e9rieur du cadre<\/strong><br \/>Inclure un formulaire pour ajouter de nouveaux commentaires :<pre>&lt;%= turbo_frame_tag \"new_comment\" do %&gt;<br \/>    &lt;%= form_with model: [@post, Comment.new], data: { turbo_frame: \"comments\" } do |form| %&gt;<br \/>        &lt;%= form.text_area :content %&gt;<br \/>        &lt;%= form.submit \"Post Comment\" %&gt;<br \/>    &lt;% fin %&gt;<br \/>&lt;% fin %&gt;<\/pre><\/li><li><strong>Action du contr\u00f4leur<\/strong><br \/>Dans votre CommentsController, rendez le Turbo Frame apr\u00e8s la cr\u00e9ation d'un commentaire :<pre>cr\u00e9er par d\u00e9faut<br \/>    @comment = @post.comments.create(comment_params)<br \/>    r\u00e9pondre_\u00e0 faire |format|<br \/>        format.turbo_stream<br \/>        format.html { redirect_to @post }<br \/>    fin<br \/>fin<\/pre><\/li><li><strong>R\u00e9ponse au flux turbo<br \/><\/strong>Cr\u00e9er un fichier create.turbo_stream.erb pour mettre \u00e0 jour la section des commentaires :<br \/><pre>&lt;%= turbo_stream.append \"comments\" do %&gt;<br \/>    &lt;%= render @comment %&gt;<br \/>&lt;% fin %&gt;<br \/><br \/>&lt;%= turbo_stream.replace \"new_comment\" do %&gt;<br \/>    &lt;%= render \"form\", post: @post, comment: Comment.new %&gt;<br \/>&lt;% fin %&gt;<\/pre><\/li><li><strong style=\"font-size: 16px;\">Turbo Streams : Mises \u00e0 jour en temps r\u00e9el<br \/><\/strong>Les flux Turbo fournissent des mises \u00e0 jour en temps r\u00e9el en envoyant des extraits HTML via WebSockets ou HTTP.<\/li><\/ul><p><strong>Exemple : Diffusion de nouveaux commentaires<\/strong><\/p><ul><li><strong>Mise en place d'ActionCable<\/strong><br \/>Assurez-vous que ActionCable est activ\u00e9 dans votre application Rails.<\/li><li><strong>Diffusion de nouveaux commentaires<\/strong><br \/>Dans votre mod\u00e8le de commentaire, diffusez les nouveaux commentaires apr\u00e8s leur cr\u00e9ation :<br \/><pre>Commentaire de classe &lt;ApplicationRecord<br \/>    after_create_commit :broadcast_comment<br \/><br \/>    priv\u00e9<br \/><br \/>    def broadcast_commentaire<br \/>        broadcast_append_to \"post_#{post_id}_comments\", partial : \"comments\/comment\", locals : { comment : self }<br \/>    fin<br \/>fin<\/pre><\/li><li><strong>S'abonner aux mises \u00e0 jour<\/strong><br \/>Selon vous, il faut s'abonner au Turbo Stream :<pre>&lt;%= turbo_stream_from \"post_#{@post.id}_comments\" %&gt;<\/pre><\/li><li><strong>Stimulus : Ajouter de l'interactivit\u00e9<\/strong><br \/>Stimulus est un cadre JavaScript l\u00e9ger permettant d'ajouter un comportement au HTML.<\/li><\/ul><p><strong>Exemple : Basculer la visibilit\u00e9<\/strong><\/p><ul><li>Cr\u00e9er un contr\u00f4leur de stimulus<br \/>G\u00e9n\u00e9rer un contr\u00f4leur de stimulus :<pre>rails g\u00e9n\u00e9rer un stimulus basculer<\/pre><\/li><li>Ajouter la logique du contr\u00f4leur<br \/>Dans app\/javascript\/controllers\/toggle_controller.js :<pre>import { Controller } from \"@hotwired\/stimulus\"<br \/>export default class extends Controller {<br \/>    cibles statiques = [\"contenu\"]<br \/>    toggle() {<br \/>        this.contentTarget.classList.toggle(\"hidden\")<br \/>    }<br \/>}<\/pre><\/li><li>Utiliser le contr\u00f4leur dans votre vue<br \/>Ajoutez le contr\u00f4leur \u00e0 votre code HTML :<pre>&lt;div data-controller=&quot;toggle&quot;&gt;<br \/>    <button>toggle#toggle\"&gt;Toggle Content<\/button><br \/>    &lt;div data-toggle-target=&quot;content&quot; class=&quot;hidden&quot;&gt;<br \/>        Ce contenu est bascul\u00e9 !<br \/>    &lt;\/div&gt;<br \/>&lt;\/div&gt;<\/pre><\/li><\/ul><h2><strong>Conclusion<\/strong><\/h2><p>Hotwire et Turbo facilitent la cr\u00e9ation d'applications Rails modernes et dynamiques avec un minimum de JavaScript. En exploitant Turbo Frames, Turbo Streams et Stimulus, vous pouvez cr\u00e9er des exp\u00e9riences utilisateur rapides, r\u00e9actives et interactives. Si vous \u00eates \u00e0 la recherche de conseils d'experts sur la mise en \u0153uvre de ces technologies, <a href=\"https:\/\/www.railscarma.com\/fr\/\">Railscarma<\/a> offre des services de premier ordre <a href=\"https:\/\/www.railscarma.com\/fr\/developpement-dapplications-de-rails-personnalises\/\">Services de d\u00e9veloppement de rails<\/a> pour vous aider \u00e0 cr\u00e9er des applications \u00e9volutives et efficaces. Gr\u00e2ce \u00e0 l'expertise de Railscarma, vous pouvez faire passer vos projets Rails au niveau sup\u00e9rieur tout en vous concentrant sur la fourniture d'exp\u00e9riences utilisateur exceptionnelles.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t  <div class=\"related-post slider\">\r\n        <div class=\"headline\">Articles Similaires<\/div>\r\n    <div class=\"post-list owl-carousel\">\r\n\r\n            <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Ruby on Rails pour MLOps : un guide complet pour le d\u00e9ploiement de ML\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ruby-on-rails-for-mlops-a-complete-guide-to-ml-deployment\/?related_post_from=41350\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Ruby-on-Rails-for-MLOps.png\" class=\"attachment-full size-full wp-post-image\" alt=\"Ruby on Rails pour MLOps\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Ruby-on-Rails-for-MLOps.png 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Ruby-on-Rails-for-MLOps-300x113.png 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Ruby-on-Rails-for-MLOps-768x288.png 768w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Ruby-on-Rails-for-MLOps-18x7.png 18w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Ruby on Rails pour MLOps : un guide complet pour le d\u00e9ploiement de ML\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/ruby-on-rails-for-mlops-a-complete-guide-to-ml-deployment\/?related_post_from=41350\">\r\n        Ruby on Rails pour MLOps : un guide complet pour le d\u00e9ploiement de ML  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Construire des applications d&#039;IA agentique avec Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/building-agentic-ai-applications-with-ruby-on-rails\/?related_post_from=41339\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Building-Agentic-AI-Applications-with-Ruby-on-Rails.png\" class=\"attachment-full size-full wp-post-image\" alt=\"Applications d&#039;IA agentique avec Ruby on Rails\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Building-Agentic-AI-Applications-with-Ruby-on-Rails.png 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Building-Agentic-AI-Applications-with-Ruby-on-Rails-300x113.png 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Building-Agentic-AI-Applications-with-Ruby-on-Rails-768x288.png 768w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/05\/Building-Agentic-AI-Applications-with-Ruby-on-Rails-18x7.png 18w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Construire des applications d&#039;IA agentique avec Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/building-agentic-ai-applications-with-ruby-on-rails\/?related_post_from=41339\">\r\n        Construire des applications d'IA agentique avec Ruby on Rails  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Qu&#039;est-ce que Offliberty Ruby Gem et comment fonctionne-t-il ?\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/quest-ce-que-offliberty-ruby-gem-et-comment-fonctionne-t-il\/?related_post_from=41304\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/What-is-Offliberty-Ruby-Gem-and-How-It-Works.png\" class=\"attachment-full size-full wp-post-image\" alt=\"Offliberty Ruby Gem\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/What-is-Offliberty-Ruby-Gem-and-How-It-Works.png 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/What-is-Offliberty-Ruby-Gem-and-How-It-Works-300x113.png 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/What-is-Offliberty-Ruby-Gem-and-How-It-Works-768x288.png 768w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/What-is-Offliberty-Ruby-Gem-and-How-It-Works-18x7.png 18w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Qu&#039;est-ce que Offliberty Ruby Gem et comment fonctionne-t-il ?\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/quest-ce-que-offliberty-ruby-gem-et-comment-fonctionne-t-il\/?related_post_from=41304\">\r\n        Qu'est-ce que Offliberty Ruby Gem et comment fonctionne-t-il ?  <\/a>\r\n\r\n        <\/div>\r\n              <div class=\"item\">\r\n            <div class=\"thumb post_thumb\">\r\n    <a  title=\"Comment construire une plateforme SaaS \u00e9volutive en utilisant Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/how-to-build-a-scalable-saas-platform-using-ruby-on-rails\/?related_post_from=41273\">\r\n\r\n      <img decoding=\"async\" width=\"800\" height=\"300\" src=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/Build-a-SaaS-Platform-Using-Ruby-on-Rails.png\" class=\"attachment-full size-full wp-post-image\" alt=\"Construire une plateforme SaaS avec Ruby on Rails\" srcset=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/Build-a-SaaS-Platform-Using-Ruby-on-Rails.png 800w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/Build-a-SaaS-Platform-Using-Ruby-on-Rails-300x113.png 300w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/Build-a-SaaS-Platform-Using-Ruby-on-Rails-768x288.png 768w, https:\/\/www.railscarma.com\/wp-content\/uploads\/2026\/04\/Build-a-SaaS-Platform-Using-Ruby-on-Rails-18x7.png 18w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\r\n\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <a class=\"title post_title\"  title=\"Comment construire une plateforme SaaS \u00e9volutive en utilisant Ruby on Rails\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/how-to-build-a-scalable-saas-platform-using-ruby-on-rails\/?related_post_from=41273\">\r\n        Comment construire une plateforme SaaS \u00e9volutive en utilisant Ruby on Rails  <\/a>\r\n\r\n        <\/div>\r\n      \r\n  <\/div>\r\n\r\n  <script>\r\n      <\/script>\r\n  <style>\r\n    .related-post {}\r\n\r\n    .related-post .post-list {\r\n      text-align: left;\r\n          }\r\n\r\n    .related-post .post-list .item {\r\n      margin: 10px;\r\n      padding: 10px;\r\n          }\r\n\r\n    .related-post .headline {\r\n      font-size: 14px !important;\r\n      color: #999999 !important;\r\n          }\r\n\r\n    .related-post .post-list .item .post_thumb {\r\n      max-height: 220px;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n          }\r\n\r\n    .related-post .post-list .item .post_title {\r\n      font-size: 14px;\r\n      color: #000000;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n      text-decoration: none;\r\n          }\r\n\r\n    .related-post .post-list .item .post_excerpt {\r\n      font-size: 12px;\r\n      color: #3f3f3f;\r\n      margin: 10px 0px;\r\n      padding: 0px;\r\n      display: block;\r\n      text-decoration: none;\r\n          }\r\n\r\n    .related-post .owl-dots .owl-dot {\r\n          }\r\n\r\n      <\/style>\r\n      <script>\r\n      jQuery(document).ready(function($) {\r\n        $(\".related-post .post-list\").owlCarousel({\r\n          items: 2,\r\n          responsiveClass: true,\r\n          responsive: {\r\n            0: {\r\n              items: 1,\r\n            },\r\n            768: {\r\n              items: 2,\r\n            },\r\n            1200: {\r\n              items: 2,\r\n            }\r\n          },\r\n                      rewind: true,\r\n                                loop: true,\r\n                                center: false,\r\n                                autoplay: true,\r\n            autoplayHoverPause: true,\r\n                                nav: true,\r\n            navSpeed: 1000,\r\n            navText: ['<i class=\"fas fa-chevron-left\"><\/i>', '<i class=\"fas fa-chevron-right\"><\/i>'],\r\n                                dots: false,\r\n            dotsSpeed: 1200,\r\n                                                    rtl: false,\r\n          \r\n        });\r\n      });\r\n    <\/script>\r\n  <\/div>","protected":false},"excerpt":{"rendered":"<p>Hotwire (HTML Over The Wire) and Turbo are modern tools that simplify building dynamic, fast, and responsive web applications without writing much JavaScript. In this guide, we\u2019ll explore how to implement Hotwire and Turbo in a Rails application, complete with coding examples. What is Hotwire and Turbo? Hotwire: A framework for building modern web applications &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/how-to-build-a-scalable-saas-platform-using-ruby-on-rails\/\"> <span class=\"screen-reader-text\">Comment construire une plateforme SaaS \u00e9volutive en utilisant Ruby on Rails<\/span> Lire la suite \u00bb<\/a><\/p>","protected":false},"author":5,"featured_media":39009,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1224],"tags":[],"class_list":["post-38991","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Hotwire and Turbo in Rails: Complete Guide 2025 - RailsCarma<\/title>\n<meta name=\"description\" content=\"Master Hotwire and Turbo in Rails! A complete guide to building fast, modern web apps with seamless updates and minimal JavaScript.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.railscarma.com\/fr\/blog\/guide-complet-de-hotwire-et-turbo-in-rails\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Hotwire and Turbo in Rails: Complete Guide 2025 - RailsCarma\" \/>\n<meta property=\"og:description\" content=\"Master Hotwire and Turbo in Rails! A complete guide to building fast, modern web apps with seamless updates and minimal JavaScript.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.railscarma.com\/fr\/blog\/guide-complet-de-hotwire-et-turbo-in-rails\/\" \/>\n<meta property=\"og:site_name\" content=\"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/RailsCarma\/\" \/>\n<meta property=\"article:published_time\" content=\"2025-02-27T10:47:57+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-02-27T11:21:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Nikhil\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@railscarma\" \/>\n<meta name=\"twitter:site\" content=\"@railscarma\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nikhil\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/\"},\"author\":{\"name\":\"Nikhil\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/1aa0357392b349082303e8222c35c30c\"},\"headline\":\"Hotwire and Turbo in Rails: Complete Guide\",\"datePublished\":\"2025-02-27T10:47:57+00:00\",\"dateModified\":\"2025-02-27T11:21:55+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/\"},\"wordCount\":417,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.railscarma.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png\",\"articleSection\":[\"Blogs\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/\",\"url\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/\",\"name\":\"Hotwire and Turbo in Rails: Complete Guide 2025 - RailsCarma\",\"isPartOf\":{\"@id\":\"https:\/\/www.railscarma.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png\",\"datePublished\":\"2025-02-27T10:47:57+00:00\",\"dateModified\":\"2025-02-27T11:21:55+00:00\",\"description\":\"Master Hotwire and Turbo in Rails! A complete guide to building fast, modern web apps with seamless updates and minimal JavaScript.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage\",\"url\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png\",\"contentUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png\",\"width\":800,\"height\":300,\"caption\":\"Hotwire & Turbo in Rails Complete Guide\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.railscarma.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Hotwire and Turbo in Rails: Complete Guide\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.railscarma.com\/#website\",\"url\":\"https:\/\/www.railscarma.com\/\",\"name\":\"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development\",\"description\":\"RailsCarma is a Ruby on Rails Development Company in Bangalore. We specialize in Offshore Ruby on Rails Development based out in USA and India. Hire experienced Ruby on Rails developers for the ultimate Web Experience.\",\"publisher\":{\"@id\":\"https:\/\/www.railscarma.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.railscarma.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.railscarma.com\/#organization\",\"name\":\"RailsCarma\",\"url\":\"https:\/\/www.railscarma.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png\",\"contentUrl\":\"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png\",\"width\":200,\"height\":46,\"caption\":\"RailsCarma\"},\"image\":{\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/RailsCarma\/\",\"https:\/\/x.com\/railscarma\",\"https:\/\/www.linkedin.com\/company\/railscarma\/\",\"https:\/\/myspace.com\/railscarma\",\"https:\/\/in.pinterest.com\/railscarma\/\",\"https:\/\/www.youtube.com\/channel\/UCx3Wil-aAnDARuatTEyMdpg\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/1aa0357392b349082303e8222c35c30c\",\"name\":\"Nikhil\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.railscarma.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/054f31ff35e9917aaf631b8025ef679d42dd21792012d451763138d66d02a4c0?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/054f31ff35e9917aaf631b8025ef679d42dd21792012d451763138d66d02a4c0?s=96&d=mm&r=g\",\"caption\":\"Nikhil\"},\"sameAs\":[\"https:\/\/www.railscarma.com\/hire-ruby-on-rails-developer\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Hotwire et Turbo dans Rails : Guide complet 2025 - RailsCarma","description":"Ma\u00eetrisez Hotwire et Turbo dans Rails ! Un guide complet pour construire des applications web rapides et modernes avec des mises \u00e0 jour transparentes et un minimum de JavaScript.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.railscarma.com\/fr\/blog\/guide-complet-de-hotwire-et-turbo-in-rails\/","og_locale":"fr_FR","og_type":"article","og_title":"Hotwire and Turbo in Rails: Complete Guide 2025 - RailsCarma","og_description":"Master Hotwire and Turbo in Rails! A complete guide to building fast, modern web apps with seamless updates and minimal JavaScript.","og_url":"https:\/\/www.railscarma.com\/fr\/blog\/guide-complet-de-hotwire-et-turbo-in-rails\/","og_site_name":"RailsCarma - Ruby on Rails Development Company specializing in Offshore Development","article_publisher":"https:\/\/www.facebook.com\/RailsCarma\/","article_published_time":"2025-02-27T10:47:57+00:00","article_modified_time":"2025-02-27T11:21:55+00:00","og_image":[{"width":800,"height":300,"url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png","type":"image\/png"}],"author":"Nikhil","twitter_card":"summary_large_image","twitter_creator":"@railscarma","twitter_site":"@railscarma","twitter_misc":{"\u00c9crit par":"Nikhil","Dur\u00e9e de lecture estim\u00e9e":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#article","isPartOf":{"@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/"},"author":{"name":"Nikhil","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/1aa0357392b349082303e8222c35c30c"},"headline":"Hotwire and Turbo in Rails: Complete Guide","datePublished":"2025-02-27T10:47:57+00:00","dateModified":"2025-02-27T11:21:55+00:00","mainEntityOfPage":{"@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/"},"wordCount":417,"commentCount":0,"publisher":{"@id":"https:\/\/www.railscarma.com\/#organization"},"image":{"@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png","articleSection":["Blogs"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/","url":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/","name":"Hotwire et Turbo dans Rails : Guide complet 2025 - RailsCarma","isPartOf":{"@id":"https:\/\/www.railscarma.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage"},"image":{"@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png","datePublished":"2025-02-27T10:47:57+00:00","dateModified":"2025-02-27T11:21:55+00:00","description":"Ma\u00eetrisez Hotwire et Turbo dans Rails ! Un guide complet pour construire des applications web rapides et modernes avec des mises \u00e0 jour transparentes et un minimum de JavaScript.","breadcrumb":{"@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#primaryimage","url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png","contentUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2025\/02\/Hotwire-Turbo-in-Rails-Complete-Guide.png","width":800,"height":300,"caption":"Hotwire & Turbo in Rails Complete Guide"},{"@type":"BreadcrumbList","@id":"https:\/\/www.railscarma.com\/blog\/hotwire-and-turbo-in-rails-complete-guide\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.railscarma.com\/"},{"@type":"ListItem","position":2,"name":"Hotwire and Turbo in Rails: Complete Guide"}]},{"@type":"WebSite","@id":"https:\/\/www.railscarma.com\/#website","url":"https:\/\/www.railscarma.com\/","name":"RailsCarma - Soci\u00e9t\u00e9 de d\u00e9veloppement Ruby on Rails sp\u00e9cialis\u00e9e dans le d\u00e9veloppement offshore","description":"RailsCarma est une soci\u00e9t\u00e9 de d\u00e9veloppement Ruby on Rails \u00e0 Bangalore. Nous sommes sp\u00e9cialis\u00e9s dans le d\u00e9veloppement offshore Ruby on Rails, bas\u00e9s aux \u00c9tats-Unis et en Inde. Embauchez des d\u00e9veloppeurs Ruby on Rails exp\u00e9riment\u00e9s pour une exp\u00e9rience Web ultime.","publisher":{"@id":"https:\/\/www.railscarma.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.railscarma.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/www.railscarma.com\/#organization","name":"RailsCarma","url":"https:\/\/www.railscarma.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png","contentUrl":"https:\/\/www.railscarma.com\/wp-content\/uploads\/2020\/08\/railscarma_logo.png","width":200,"height":46,"caption":"RailsCarma"},"image":{"@id":"https:\/\/www.railscarma.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/RailsCarma\/","https:\/\/x.com\/railscarma","https:\/\/www.linkedin.com\/company\/railscarma\/","https:\/\/myspace.com\/railscarma","https:\/\/in.pinterest.com\/railscarma\/","https:\/\/www.youtube.com\/channel\/UCx3Wil-aAnDARuatTEyMdpg"]},{"@type":"Person","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/1aa0357392b349082303e8222c35c30c","name":"Nikhil","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.railscarma.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/054f31ff35e9917aaf631b8025ef679d42dd21792012d451763138d66d02a4c0?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/054f31ff35e9917aaf631b8025ef679d42dd21792012d451763138d66d02a4c0?s=96&d=mm&r=g","caption":"Nikhil"},"sameAs":["https:\/\/www.railscarma.com\/hire-ruby-on-rails-developer\/"]}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/posts\/38991","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/comments?post=38991"}],"version-history":[{"count":0,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/posts\/38991\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/media\/39009"}],"wp:attachment":[{"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/media?parent=38991"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/categories?post=38991"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.railscarma.com\/fr\/wp-json\/wp\/v2\/tags?post=38991"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}