From <img> to image_tag
A line from Links and images
Lesson 4 of Links and images, on the anatomy of <img>, covered src, alt, width, height and loading, then showed this line near the end without stopping on it:
<%= image_tag "blue-tshirt.jpg", alt: "..." %>
That lesson said image_tag "resolves the path through the asset pipeline", the same benefit stylesheet_link_tag gave CSS in Metadata tags. It didn't explain either claim, on purpose: its job was the attributes, not the helper that writes the tag.
image_tag is to what link_to is to
Rails helpers: link_to took an <a> tag whose attributes were already explained and showed link_to generating it from Ruby. image_tag does the same for <img>. Every attribute here, src, alt, width, height and loading, was covered in Links and images. Their meaning doesn't change; only who writes them does.
This course's shape
Lesson 2 opens image_tag, generating an <img src="..."> tag from one filename. Lesson 3 explains "resolves through the asset pipeline": the fingerprinted filename this project's Propshaft setup produces. Lesson 4 passes alt, width, height and loading through the options hash, as link_to's class: did. Lesson 5 glances at where this project's images go further, Active Storage variants, without teaching that system. Lesson 6 checks it all live. Lesson 7 shows image_tag's full shape and looks ahead to form_with.
Keep going with lesson 2
image_tag's one required argument
Passes one filename to image_tag and gets a complete self-closing <img> tag with a fingerprinted src.
A free account also gives you the quizzes, your progress and notes, and the discussion.