Empowering Developers with HTML-Aware ERB Tooling @ Latvian Ruby Community Meetup May 2025, Riga Latvia

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, transforming how we build and ship HTML in our Ruby applications.

Transcript

1. Marco Roth • Empowering Developers with HTML-Aware ERB Tooling May 15, 2025 - Latvian Ruby Community Meetup
2. Marco Roth !  @marcoroth_  @marcoroth@ruby.social 🌐 marcoroth.dev  @marcoroth Full-Stack Developer & Open Source Contributor  @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. ↓
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?
74. HTML-aware ERB Parser Hand-written HTML-aware ERB parser
75. HTML-aware ERB Parser Written in C99 and no additional dependency (besides Prism)
76. HTML-aware ERB Parser Built on Prism for the Ruby parsing
77. HTML-aware ERB Parser Follows Prism's Design Goals
78. HTML-aware ERB Parser portable error tolerant maintainable
79. HTML-aware ERB Parser Custom HTML lexer and parser
80. HTML-aware ERB Parser Designed for tooling, not browsers
81. HTML-aware ERB Parser Exposes a clean syntax tree of interleaved HTML and ERB
83. gem "herb"
85. @herb-tools/node @herb-tools/browser
87. - How Herb Works
88. Empty Document
89. @ DocumentNode (location: (1:0)-(1:0)) ├── errors: [] └── children: []
90. Text Content
91. Text @ DocumentNode (location: (1:0)-(1:4)) ├── errors: [] └── children: (1 item) └── @ HTMLTextNode (location: (1:0)-(1:4)) ├── errors: [] └── content: "Text"
92. Partial HTML Elements
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. <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 ^^^^^
95. <h1>Title
96. irb(main):001> Nokogiri::HTML5.fragment(html).to_html <h1>Title
97. irb(main):001> Nokogiri::HTML5.fragment(html).to_html <h1>Title => "<h1>Title</h1>"
98. irb(main):001> Nokogiri::HTML5.fragment(html).to_html => "<h1>Title</h1>" <h1>Title
99. Complete HTML Elements
100. <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
101. <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
102. Nested HTML Elements
103. <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"
104. <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"
105. ERB Content
106. <%= @variable %> @ DocumentNode ├── errors: [] └── children: (1 item) └── @ ERBContentNode ├── errors: [] ├── tag_opening: "<%=" ├── content: " @variable " ├── tag_closing: "%>" ├── parsed: true └── valid: true
107. ERB Control Flow Strcutures
108. <% 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"
109. Parsing with Prism + Analysis
110. <% 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)
111. <% 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: "%>"
112. HTML Elements nested inside ERB Tags
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. <% 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: "%>"
117. <% 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: "%>"
118. <% 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: "%>"
119. This opens a lot of doors for understanding, analyzing, working with HTML+ERB documents.
120. HTML Attributes HTML Doctypes HTML Comments ...
121. if/elsif/else case/when/else begin/rescue/ensure do/end while for until unless yield
122. First Release Herb Parser Public Release
124. Now the fun can begin to build use tools on top of it.
125. I invite you to give it a shot to see what you can build with it.
126. Try it Interactive browser-based parser playground
128. herb-tools.dev/playground
129. . Looking Ahead
132. Coming Soon HTML+ERB Auto-Formatter
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>
134. <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
135. <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]
136. <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>
139. Coming Soon Herb Linter
140. Check for valid HTML5 Missing alt attributes on <img> No unsafe interpolation Only one element with the same ID invalid syntax ...
141. Vision ERB Rendering Engine
144. <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
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
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
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
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> </ul> State View Template Rendered View Log Initial view rendered @items state changed re-rendering view tracing dependencies render delta for item `4`
149. <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>
150. <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>
151. <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>
152. <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
153. Vision HTML Templating Syntax Tree
154. Improve Developer Tooling for HTML in the view layer
155. This includes other templating languages
156. 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
157. <%= 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
158. %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: ∅ Haml
159. 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: ∅ Slim
160. As long as we can transform the template syntax into the same syntax tree
161. We can combine our efforts to build tooling on top of this shared syntax tree
162. Vision What's next
163. Herb Formatter Herb Linter
165. Including LSP Diagnostics and Code Actions for Refactoring
166. Support for parsing ActionView helpers
167. <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 %>
168. Multi-file view files diagnostic and analysis
169. <!-- index.html.erb --> <div data-controller="hello"> <%= render partial: "input" %> </div> <!-- _partial.html.erb --> <input data-hello-target="name" type="text">
170. html_press gem phlexing gem deface gem better_html gem erb_lint gem Probably even more
171. Conclusion
172. Prism had a big effect on Ruby internals and the tooling landscape
173. Herb could have a similar effect for HTML Template Tooling
174. The community has built incredible tooling for Ruby itself.
175. Now it's time to bring that same care to the view layer.
176. With Herb, I believe we have a path to level up the view layer tooling
178. I want to keep Ruby as attractive and easy to get started as possible
182. ruby/prism rake-compiler/rake-compiler rake-compiler/rake-compiler-dock flavorjones/ruby-c-extensions-explained Thanks to all contributors /
183. herb-tools.dev
184. Come find my after the talk, I'd love to hear your ideas, questions and opinions.
185. One more thing
190. rubyevents.org/events/latviarb-meetup
192. Thank you /  @marcoroth_  @marcoroth@ruby.social 🌐 marcoroth.dev  @marcoroth  @marcoroth.dev  /in/marco-roth