Про layout.erb в Sinatra

Sinatra
1

Файл layout.erb у Sinatra (і в інших Ruby-фреймворках, таких як Ruby on Rails ) є спеціальним шаблоном, який визначає загальну структуру сторінок вашого веб-додатка. Він використовується для того, щоб уникнути повторення коду HTML на кожній сторінці і створювати єдиний макет для всього вашого додатка.

Основна мета layout.erb - це визначити загальну структуру HTML-сторінки, таку як заголовок, навігаційне меню, футер і так далі. У цьому шаблоні ви також вказуєте місце, де будуть вставлені конкретні змістові частини кожної сторінки.

Наприклад, ось як може виглядати простий layout.erb:

<!DOCTYPE html>
<html>
<head>
  <title>Мій додаток</title>
</head>
<body>
  <header>
    <h1>Логотип</h1>
    <nav>
      <ul>
        <li><a href="/">Головна</a></li>
        <li><a href="/about">Про нас</a></li>
        <li><a href="/contact">Контакти</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <%= yield %>
  </main>

  <footer>
    &copy; 2024 Мій додаток
  </footer>
</body>
</html>

У цьому прикладі, <%= yield %> вказує на те місце, де будуть вставлені вмістові частини кожної сторінки (дещо про yield). Кожен шаблон сторінки (наприклад, index.erb, about.erb, contact.erb тощо) буде вставлений на місце цього <%= yield %>. Таким чином, всі сторінки вашого веб-додатка матимуть однаковий макет, але з різним вмістом.

Використання layout.erb спрощує управління загальною структурою вашого додатка та дозволяє легко внести зміни в макет всього додатка за одним разом.

1 Вподобання
2

А якщо потрібно на сторінці, наприклад, /contact розмістити іншу інформацію в ніж та що в layout.erb?

Якщо вам потрібно розмістити іншу інформацію в тезі <head></head> для конкретної сторінки, наприклад, сторінки contact, у вас є кілька способів це зробити в Sinatra.

Один з способів - це використовувати змінні локального контексту у вашому шаблоні layout.erb і передавати їх через параметри з маршруту. Ось як це може виглядати:

# app.rb
require 'sinatra'

get '/contact' do
  erb :contact, locals: { additional_head_content: "<meta name='description' content='Це контактна сторінка'>" }
end

У цьому прикладі ми передаємо змінну additional_head_content до шаблону contact.erb.

Тепер у вашому файлі layout.erb ви можете перевірити, чи існує ця змінна, і вставити її у тезі <head></head>:

<!DOCTYPE html>
<html>
<head>
  <title>Мій додаток</title>
  <%= additional_head_content if defined?(additional_head_content) %>
</head>
<body>
  <header>
    <h1>Логотип</h1>
    <nav>
      <ul>
        <li><a href="/">Головна</a></li>
        <li><a href="/about">Про нас</a></li>
        <li><a href="/contact">Контакти</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <%= yield %>
  </main>

  <footer>
    &copy; 2024 Мій додаток
  </footer>
</body>
</html>

Таким чином, якщо ви відкриєте сторінку contact , в тезі <head></head> буде вставлений вміст, який ви передаєте через параметри з маршруту.

3

Ще одним способом є використання умовного розміщення вмісту у секції <head></head> за допомогою змінної, яку ви встановлюєте в маршруті для сторінки contact.

Ось як це може виглядати:

# app.rb
require 'sinatra'

get '/contact' do
  @additional_head_content = "<meta name='description' content='Це контактна сторінка'>"
  erb :contact
end

У цьому прикладі ми встановлюємо змінну @additional_head_content в маршруті для сторінки contact.

Тепер у вашому файлі layout.erb ви можете вставити цю змінну у секцію <head></head> за допомогою умовного оператора:

<!DOCTYPE html>
<html>
<head>
  <title>Мій додаток</title>
  <%= @additional_head_content if @additional_head_content %>
</head>
<body>
  <header>
    <h1>Логотип</h1>
    <nav>
      <ul>
        <li><a href="/">Головна</a></li>
        <li><a href="/about">Про нас</a></li>
        <li><a href="/contact">Контакти</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <%= yield %>
  </main>

  <footer>
    &copy; 2024 Мій додаток
  </footer>
</body>
</html>

Це також дозволить вам вставити інший вміст у тезі <head></head> лише для сторінки contact, залишаючи загальний макет для інших сторінок незмінним.

1 Вподобання