Компоненты и layout в TGX — структура проекта без дублирования

Компоненты и layout в TGX#

Как разделять каркас страницы, компоненты и контентные блоки, чтобы шаблоны оставались поддерживаемыми.

Синтаксис#

<tgx tgx:component="@global/header"></tgx>

Пример 1: минимум (копипаст для старта)#

<tgx tgx:component="@global/header"></tgx>

Пример 2: реальный сценарий#

<tgx tgx:component="@global/header"></tgx>
<main>
  <tgx tgx:component="#hero"></tgx>
  <section tgx:repeat="/blog/*?filter[status]=active&limit=3 -> post"></section>
</main>
<tgx tgx:component="@global/footer"></tgx>

Пример 3: комбинированный сценарий#

<tgx tgx:set="showPromo"></tgx>
<tgx tgx:component="#owner-promo" tgx:if="showPromo"></tgx>

Разбор#

Каркас страницы храните в /page-templates/*, повторяемые части выносите в компоненты, а бизнес-данные подмешивайте в конкретных страницах.

Когда использовать#

Когда нужно управлять поведением блока прямо в шаблоне, не дублируя логику в нескольких местах.
Когда важно сделать поведение страницы предсказуемым для пользователя в реальных сценариях.

Частые ошибки#

Дублировать один и тот же header/footer в десятках страниц вместо компонента
Смешивать данные страницы и layout без четких границ ответственности

Проверка перед публикацией#

Повторяющиеся блоки вынесены в компоненты
Компоненты не содержат лишней бизнес-логики страницы

См. также#

Связанные статьи

tgx-component tgx-repeat tgx-set

← Назад в FAQ