🖼️

Layouts & yield

페이지의 공통 골격을 레이아웃으로 관리

Layout은 모든 페이지에 공통으로 적용되는 HTML 골격입니다.

<%# app/views/layouts/application.html.erb %>
<!DOCTYPE html>
<html>
<head>
  <%= csrf_meta_tags %>
  <%= stylesheet_link_tag 'application' %>
</head>
<body>
  <nav>공통 네비게이션</nav>

  <% if content_for?(:sidebar) %>
    <aside><%= yield :sidebar %></aside>
  <% end %>

  <main><%= yield %></main>  <%# 각 페이지 내용이 여기에 삽입 %>

  <footer>공통 푸터</footer>
</body>
</html>

content_for:

<%# app/views/posts/show.html.erb %>
<% content_for :sidebar do %>
  <nav>사이드바 내용</nav>
<% end %>

<h1>본문 내용</h1>  <%# 이 부분이 yield에 삽입 %>

레이아웃 지정:

  • layout 'admin' — 컨트롤러 단위

  • render layout: 'special' — 액션 단위

  • layout false — 레이아웃 없이 렌더

핵심 포인트

1

app/views/layouts/application.html.erb — 기본 레이아웃

2

yield — 각 액션의 뷰 내용이 삽입되는 위치

3

content_for :name — 특정 영역에 내용 삽입 (사이드바, 헤드 등)

4

yield :name — content_for로 삽입된 내용을 출력

5

layout "admin" — 컨트롤러에서 다른 레이아웃 지정

6

content_for?(:name) — 해당 영역에 내용이 있는지 확인

장점

  • 공통 HTML 구조를 한 곳에서 관리
  • content_for로 유연한 영역별 내용 삽입
  • 레이아웃 교체가 간단
  • DRY — 모든 페이지에 동일한 nav/footer

단점

  • content_for 남발 시 흐름 파악 어려움
  • 중첩 레이아웃은 지원하지 않음 (gem 필요)
  • JavaScript/CSS를 content_for로 삽입하면 관리 어려움

사용 사례

사이트 전체 공통 레이아웃 관리자/사용자 별도 레이아웃 페이지별 사이드바/메타태그 삽입 이메일 템플릿 레이아웃