Empowering Developers with HTML-Aware ERB Tooling @ RubyKaigi 2025, Matsuyama, Ehime

ERB tooling has lagged behind modern web development needs, especially with the rise of Hotwire and HTML-over-the-wire. Discover a new HTML-aware ERB parser that unlocks advanced developer tools like formatters, linters, and LSP integrations, enhancing how we build and ship HTML in our Ruby applications.

Transcript

1. Empowering Developers with HTML-Aware ERB Tooling Marco Roth April 16, RubyKaigi 2025
2. Marco Roth 👋 t @marcoroth_ M @marcoroth@ruby.social g marcoroth.dev g @marcoroth Full-Stack Developer & Open Source Contributor b @marcoroth.dev
3. I ❤ Open Source
4. CableReady Core Team Maintainer
6. HTML+ERB Tooling
7. But first...
8. 🕰 A Brief History of Ruby Developer Tooling
9. Ruby didn't have smart editor tooling for most of it's existence
10. Most editors just had basic Ruby support
11. RubyMine 2008
12. Source: https://code.visualstudio.com/api/language-extensions/language-server-extension-guide
13. For almost a decade this has been the situation
14. Language Server Protocol 2016
15. Source: https://code.visualstudio.com/api/language-extensions/language-server-extension-guide
17. 💡 The Rise of LSPs
18. 2022 Ruby LSP
19. The JavaScript tooling and DX is awesome
20. 2023 Stimulus LSP
22. 2024 Turbo LSP
23. 💡 LSPs are the Future of Dev Tooling
24. 🌿 Something is missing
25. HTML-only
26. <div data-controller="hello"> <input data-hello-target="name" type="text"> <button data-action="click->hello#greet"> Greet </button> <span data-hello-target="output"></span> </div>
27. <div data-controller="hello"> <input data-hello-target="name" type="text"> <button data-action="click->hello#greet"> Greet </button> <span data-hello-target="output"></span> </div>
28. No ERB support
29. For Rails apps it's quite common to use ActionView ERB helpers
30. <%= tag.div( data: { controller: "filter", filter_open_class: "border-white", filter_close_class: "border-gray-300" } ) %> Missing full support for HTML+ERB and Rails-specific helpers
31. Errors Diagnostics Best Practices Recommendations
32. We have to understand ERB
33. The fact is that we never really had HTML+ERB specific tooling in the Ruby world
34. 🧠 Why HTML+ERB tooling matters more than ever?
36. https://railsdeveloper.com/survey/2024/
37. https://railsdeveloper.com/survey/2024/
38. https://2024.stateofjs.com/en-US/libraries/front-end-frameworks/
39. https://2024.stateofjs.com/en-US/libraries/front-end-frameworks/
40. https://2024.stateofjs.com/en-US/libraries/front-end-frameworks/
41. Advanced HTML tooling is only getting more important
42. 🎯 My goal was to add ERB support
45. RubyConf 2023 Hack Day
46. ERB support in Ruby LSP
48. We quickly realized that we need something more powerful to make things work beyond the basics
49. ERB is versatile
50. a
51. HTML+ERB
52. 🛠 Why not use Nokogiri + Prism?
53. <div> <span><%= @user.firstname %></span> <b><%= @user.lastname %></b> </div> <div> <span><%= @user.firstname %></span> <b><%= @user.lastname %></b> </div>
54. Ruby HTML <div> <span><%= @user.firstname %></span> <b><%= @user.lastname %></b> </div> <div> <span><%= @user.firstname %></span> <b><%= @user.lastname %></b> </div>
55. Ruby HTML <div> <span><%= @user.firstname %></span> <b><%= @user.lastname %></b> </div> <div> <span><%= @user.firstname %></span> <b><%= @user.lastname %></b> </div>
56. Ruby HTML @user.firstname @user.lastname <div> <span> </span> <b> </b> </div>
57. Ruby HTML @user.firstname @user.lastname <div> <span> </span> <b> </b> </div> t require "prism" Prism.parse("...") require "nokogiri" Nokogiri::HTML5.fragment("...")
58. Ruby HTML @user.firstname @user.lastname <div> <span> </span> <b> </b> </div> t
59. We lost the HTML-context in the process
60. We would need to piece the two parse results together
61. Which doesn't allow for much control with edge cases
62. <%= "Hello World" %> <div <%= attributes %>></div> <div id="<%= dom_id(post) %>"></div>
63. So I knew I had to build my own parser.
64. 🌱 The idea of a new HTML- aware ERB parser
65. 🧪 Early Experiments and Language Choice
66. 💪 Learning C and Getting to Work
69. 🌿 Introducing: Herb
70. 🔍 What is Herb?
73. HTML-aware ERB Parser Hand-written HTML-aware ERB parser
74. HTML-aware ERB Parser Written in C99 and no additional dependency (besides Prism)
75. HTML-aware ERB Parser Built on Prism for the Ruby parsing
76. HTML-aware ERB Parser Follows Prism's Design Goals
77. HTML-aware ERB Parser portable error tolerant maintainable
78. HTML-aware ERB Parser Custom HTML lexer and parser
79. HTML-aware ERB Parser Designed for tooling, not browsers
80. HTML-aware ERB Parser Exposes a clean syntax tree of interleaved HTML and ERB
82. gem "herb"
84. @herb-tools/node @herb-tools/browser
86. 🧩 How Herb Works
87. Empty Document
88. @ DocumentNode (location: (1:0)-(1:0)) ├── errors: [] └── children: []
89. Text Content
90. Text @ DocumentNode (location: (1:0)-(1:4)) ├── errors: [] └── children: (1 item) └── @ HTMLTextNode (location: (1:0)-(1:4)) ├── errors: [] └── content: "Text"
91. Partial HTML Elements
92. <h1 > Title @ HTMLElementNode ├── errors: (1 item) │ └── @ MissingClosingTagError │ ├── message: " │ │ Opening tag `<h1>` at (1:1) │ │ doesn't have a matching │ │ closing tag `</h1>`. │ │ " │ └── opening_tag: "h1" │ ├── open_tag: │ └── @ HTMLOpenTagNode │ ├── tag_opening: "<" │ ├── tag_name: "h1" │ ├── tag_closing: ">" │ ├── children: [] │ └── is_void: false │ ├── tag_name: "h1" ├── body: (1 item) │ └── @ HTMLTextNode │ └── content: "Title" │ ├── close_tag: ∅ └── is_void: false ^^^^^
93. <h1 > Title @ HTMLElementNode │── errors: (1 item) │ └── @ MissingClosingTagError │ ├── message: " │ │ Opening tag `<h1>` at (1:1) │ │ doesn't have a matching │ │ closing tag `</h1>`. │ │ " │ └── opening_tag: "h1" │ ├── open_tag: │ └── @ HTMLOpenTagNode │ ├── tag_opening: "<" │ ├── tag_name: "h1" │ ├── tag_closing: ">" │ ├── children: [] │ └── is_void: false │ │── tag_name: "h1" │── body: (1 item) │ └── @ HTMLTextNode │ └── content: "Title" │ └── close_tag: ∅ └── is_void: false ^^^^^
94. irb(main):001> Nokogiri::HTML5.fragment(html).to_html <h1 > Title => "<h1>Title</h1>"
95. irb(main):001> Nokogiri::HTML5.fragment(html).to_html => "<h1>Title</h1>" <h1 > Title
96. Complete HTML Elements
97. <h1 > Title</h1> @ HTMLElementNode ├── errors: [] ├── open_tag: │ └── @ HTMLOpenTagNode │ ├── errors: [] │ ├── tag_opening: "<" │ ├── tag_name: "h1" │ ├── tag_closing: ">" │ ├── children: [] │ └── is_void: false │ ├── tag_name: "h1" ├── body: (1 item) │ └── @ HTMLTextNode │ ├── errors: [] │ └── content: "Title" │ ├── close_tag: │ └── @ HTMLCloseTagNode │ ├── errors: [] │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ └── is_void: false
98. <h1 > Title</h1> @ HTMLElementNode │── errors: [] ├── open_tag: │ └── @ HTMLOpenTagNode │ ├── errors: [] │ ├── tag_opening: "<" │ ├── tag_name: "h1" │ ├── tag_closing: ">" │ ├── children: [] │ └── is_void: false │ ├── tag_name: "h1" ├── body: (1 item) │ └── @ HTMLTextNode │ │── errors: [] │ └── content: "Title" │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── errors: [] │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ └── is_void: false
99. Nested HTML Elements
100. <h1><i>Title</i></h1> @ HTMLElementNode ├── open_tag: │ └── @ HTMLOpenTagNode │ └── tag_name: "h1" │ ├── tag_name: "h1" ├── body: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ └── tag_name: "i" │ │ │ ├── tag_name: "i" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ └── tag_name: "i" │ └── close_tag: └── @ HTMLCloseTagNode └── tag_name: "h1"
101. <h1><i>Title</i></h1> @ HTMLElementNode │── open_tag: │ └── @ HTMLOpenTagNode │ └── tag_name: "h1" │ ├── tag_name: "h1" └── body: │ └── @ HTMLElementNode │ │── open_tag: │ │ └── @ HTMLOpenTagNode │ │ └── tag_name: "i" │ │ │ ├── tag_name: "i" │ └── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ └── tag_name: "i" │ └── close_tag: └── @ HTMLCloseTagNode └── tag_name: "h1"
102. ERB Content
103. <%= @variable %> @ DocumentNode ├── errors: [] └── children: (1 item) └── @ ERBContentNode ├── errors: [] ├── tag_opening: "<%=" ├── content: " @variable " ├── tag_closing: "%>" ├── parsed: true └── valid: true
104. ERB Control Flow Strcutures
105. <% if valid? %> <% end %> children: (3 items) ├── @ ERBContentNode │ ├── errors: [] │ ├── tag_opening: "<%" │ ├── content: " if valid? " │ ├── tag_closing: "%>" │ ├── parsed: false │ └── valid: false │ │ └── @ ERBContentNode ├── errors: [] ├── tag_opening: "<%" ├── content: " end " ├── tag_closing: "%>" ├── parsed: false └── valid: false ├── @ HTMLTextNode │ ├── errors: [] │ └── content: "\n\n"
106. Parsing with Prism + Analysis
107. <% if valid? %> <% end %> ├── @ ERBContentNode │ ├── errors: [] │ ├── tag_opening: "<%" │ ├── content: " if valid? " │ ├── tag_closing: "%>" │ ├── parsed: false │ └── valid: false │ │ └── @ ERBContentNode ├── errors: [] ├── tag_opening: "<%" ├── content: " end " ├── tag_closing: "%>" ├── parsed: false └── valid: false ├── @ HTMLTextNode │ ├── errors: [] │ └── content: "\n\n" children: (3 items)
108. <% if valid? %> <% end %> children: (1 item) └── @ ERBIfNode ├── errors: [] ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: (1 item) │ └── @ HTMLTextNode │ ├── errors: [] │ └── content: "\n\n" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── errors: [] ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
109. HTML Elements nested inside ERB Tags
110. <% if valid? %> <h1 > Title</h1> <% end %> @ ERBIfNode ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ ├── tag_opening: "<" │ │ ├── tag_name: "h1" │ │ ├── tag_closing: ">" │ │ ├── children: [] │ │ └── is_void: false │ │ │ ├── tag_name: "h1" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
111. <% if valid? %> <h1 > Title</h1> <% end %> @ ERBIfNode ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ ├── tag_opening: "<" │ │ ├── tag_name: "h1" │ │ ├── tag_closing: ">" │ │ ├── children: [] │ │ └── is_void: false │ │ │ ├── tag_name: "h1" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
112. <% if valid? %> <h1 > Title</h1> <% end %> @ ERBIfNode ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ ├── tag_opening: "<" │ │ ├── tag_name: "h1" │ │ ├── tag_closing: ">" │ │ ├── children: [] │ │ └── is_void: false │ │ │ ├── tag_name: "h1" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
113. <% if valid? %> <h1 > Title</h1> <% end %> @ ERBIfNode ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ ├── tag_opening: "<" │ │ ├── tag_name: "h1" │ │ ├── tag_closing: ">" │ │ ├── children: [] │ │ └── is_void: false │ │ │ ├── tag_name: "h1" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
114. <% if valid? %> <h1 > Title</h1> <% end %> @ ERBIfNode ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ ├── tag_opening: "<" │ │ ├── tag_name: "h1" │ │ ├── tag_closing: ">" │ │ ├── children: [] │ │ └── is_void: false │ │ │ ├── tag_name: "h1" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
115. <% if valid? %> <h1 > Title</h1> <% end %> @ ERBIfNode ├── tag_opening: "<%" ├── content: " if valid? " ├── tag_closing: "%>" ├── statements: │ └── @ HTMLElementNode │ ├── open_tag: │ │ └── @ HTMLOpenTagNode │ │ ├── tag_opening: "<" │ │ ├── tag_name: "h1" │ │ ├── tag_closing: ">" │ │ ├── children: [] │ │ └── is_void: false │ │ │ ├── tag_name: "h1" │ ├── body: │ │ └── @ HTMLTextNode │ │ └── content: "Title" │ │ │ └── close_tag: │ └── @ HTMLCloseTagNode │ ├── tag_opening: "</" │ ├── tag_name: "h1" │ └── tag_closing: ">" │ ├── subsequent: ∅ └── end_node: └── @ ERBEndNode ├── tag_opening: "<%" ├── content: " end " └── tag_closing: "%>"
116. This opens a lot of doors for understanding, analyzing, working with HTML+ERB documents.
117. HTML Attributes HTML Doctypes HTML Comments ...
118. if/elsif/else case/when/else begin/rescue/ensure do/end while for until unless
119. First Release Herb Parser Public Release
121. Now the fun can begin to build use tools on top of it.
122. I invite you to give it a shot to see what you can build with it.
123. Try it Interactive browser-based parser playground
125. herb-tools.dev/playground
126. 🔮 Looking Ahead
129. Coming Soon HTML+ERB Auto-Formatter
130. <div><h1><%=@title%></h1><%if user_signed_in?%> <p>Welcome,<%= current_user.name%>!</p><%else%> <p>Please<%= link_to"sign in",login_path%>.</ p><%end%></div>
131. <div><h1><%=@title%></h1><%if user_signed_in?%> <p>Welcome,<%= current_user.name%>!</p><%else%> <p>Please<%= link_to"sign in",login_path%>.</ p><%end%></div> S cmd
132. <div><h1><%=@title%></h1><%if user_signed_in?%> <p>Welcome,<%= current_user.name%>!</p><%else%> <p>Please<%= link_to"sign in",login_path%>.</ p><%end%></div> bundle exec herb format [file]
133. <div> <h1><%= @title %></h1> <% if user_signed_in? %> <p>Welcome, <%= current_user.name %>!</p> <% else %> <p>Please <%= link_to "sign in", login_path %></p> <% end %> </div>
136. Coming Soon Herb Linter
137. Check for valid HTML5 Missing alt attributes on <img> No unsafe interpolation Only one element with the same ID invalid syntax ...
138. Vision ERB Rendering Engine
141. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered
142. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed
143. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view
144. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view tracing dependencies
145. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view tracing dependencies render delta for item `4`
146. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view tracing dependencies render delta for item `4` <li>4</li>
147. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view tracing dependencies render delta for item `4` apply delta to view <li>4</li>
148. <ul> <% @items do |item| %> <li><%= item %></li> <% end %> </ul> @items = [1, 2, 3, 4] <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view tracing dependencies render delta for item `4` apply delta to view
149. Vision HTML Templating Syntax Tree
150. Improve Developer Tooling for HTML in the view layer
151. This includes other templating languages
152. tHTML+ERB <p id="name"> Hello <%= name %> </p> @ HTMLElementNode ├── tag_name: "p" ├── attributes: (1 item) │ └── @ HTMLAttributeNode │ ├── name: │ │ └── @ HTMLAttributeNameNode │ │ └── name: "id" │ │ │ ├── equals: "=" │ └── value: │ └── @ HTMLAttributeValueNode │ └── children: │ └── @ LiteralNode │ └── content: "name" ├── body: (3 items) │ └── @ DynamicContentNode │ ├── tag_opening: "<%=" │ ├── content: " name " │ └── tag_closing: "%>" │ └── close_tag: └── @ HTMLCloseTagNode ├── tag_opening: "</" ├── tag_name: "p" └── tag_closing: ">" HTML+ERB
153. <%= tag.p(id: "name") do %> Hello <%= name %> <% end %> @ HTMLElementNode ├── tag_name: "p" ├── attributes: (1 item) │ └── @ HTMLAttributeNode │ ├── name: │ │ └── @ HTMLAttributeNameNode │ │ └── name: "id" │ │ │ ├── equals: "=" │ └── value: │ └── @ HTMLAttributeValueNode │ └── children: │ └── @ LiteralNode │ └── content: "name" ├── body: (3 items) │ └── @ DynamicContentNode │ ├── tag_opening: "<%=" │ ├── content: " name " │ └── tag_closing: "%>" │ └── close_tag: └── @ HTMLCloseTagNode ├── tag_opening: "</" ├── tag_name: "p" └── tag_closing: ">" HTML+ERB + ActionView
154. %p#element Hello = name @ HTMLElementNode ├── tag_name: "p" ├── attributes: (1 item) │ └── @ HTMLAttributeNode │ ├── name: │ │ └── @ HTMLAttributeNameNode │ │ └── name: "id" │ │ │ ├── equals: "=" │ └── value: │ └── @ HTMLAttributeValueNode │ └── children: │ └── @ LiteralNode │ └── content: "name" ├── body: (3 items) │ └── @ DynamicContentNode │ ├── tag_opening: "=" │ ├── content: " name " │ └── tag_closing: ∅ │ └── close_tag: └── @ HTMLCloseTagNode ├── tag_opening: "</" ├── tag_name: "p" └── tag_closing: ">" Haml
155. p id="element" | Hello #{name} @ HTMLElementNode ├── tag_name: "p" ├── attributes: (1 item) │ └── @ HTMLAttributeNode │ ├── name: │ │ └── @ HTMLAttributeNameNode │ │ └── name: "id" │ │ │ ├── equals: "=" │ └── value: │ └── @ HTMLAttributeValueNode │ └── children: │ └── @ LiteralNode │ └── content: "name" ├── body: (3 items) │ └── @ DynamicContentNode │ ├── tag_opening: "| " │ ├── content: " name " │ └── tag_closing: ∅ │ └── close_tag: └── @ HTMLCloseTagNode ├── tag_opening: "</" ├── tag_name: "p" └── tag_closing: ">" Slim
156. As long as we can transform the template syntax into the same syntax tree
157. We can combine our efforts to build tooling on top of this shared syntax tree
158. Vision What's next
159. Herb Formatter Herb Linter
161. Including LSP Diagnostics and Code Actions for Refactoring
162. Support for parsing ActionView helpers
163. <article id="<%= dom_id(article) %>"></article> <input <% if true %> type="text" <% end %> /> <% @posts.each do |post| %> <h1><%= post.title %></h1> <% end %> <%= content_tag(:p, "Hello world!") %> <%= tag.div tag.p("Hello world!") %> <%= tag.p do %> Hello world! <% end %> <%= tag.div( data: { controller: "hello", action: "click->hello#greet" } ) %> <%= link_to "Home", root_path %>
164. Multi-file view files diagnostic and analysis
165. <!-- index.html.erb --> <div data-controller="hello"> <%= render partial: "input" %> </div> <!-- _partial.html.erb --> <input data-hello-target="name" type="text">
166. html_press gem phlexing gem deface gem better_html gem erb_lint gem Probably even more
167. Conclusion
168. Prism had a big effect on Ruby internals and the tooling landscape
169. Herb could have a similar effect for HTML Template Tooling
170. The community has built incredible tooling for Ruby itself.
171. Now it's time to bring that same care to the view layer.
172. With Herb, I believe we have a path to level up the view layer tooling
174. I want to keep Ruby as attractive and easy to get started as possible
177. ruby/prism rake-compiler/rake-compiler rake-compiler/rake-compiler-dock flavorjones/ruby-c-extensions-explained Thanks to all contributors 🙏
178. herb-tools.dev
179. Come find my after the talk, I'd love to hear your ideas, questions and opinions.
180. Thank you 🙏 t @marcoroth_ M @marcoroth@ruby.social g marcoroth.dev g @marcoroth b @marcoroth.dev l /in/marco-roth