Сториблок

Вступление

Storyblok - это сервис, который позволяет вам добавлять возможности редактирования внешнего интерфейса к любому шаблонизатору, фреймворку или системе по вашему выбору. Мы создали Storyblok, чтобы повысить производительность и продвигать компоненты многократного использования.

Как работает Сториблок

Ключевые концепции Storyblok во многом основаны на методологии БЭМ. Автор истории может создать вложенное дерево компонентов и входного контента в удобном и быстро реагирующем интерфейсе.

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

Эта страница, например, использует следующий JSON для отображения содержимого:

{
    "body": [
        {
            "text": "Storyblok is a service that...",
            "component": "markdown"
        },
        {
            "text": "The key concepts ....",
            "title": "How Storyblok works",
            "component": "markdown"
        },
        {
            "code": "",
            "component": "codeblock"
        }
    ]
}

Для визуализации дерева JSON мы рекомендуем язык шаблонов, поддерживающий динамические партиалы. В нашем примере мы используем Twig для перебора тела и рендеринга содержимого:

{{blok._editable}}

<div>
{% for blok in blok.body %}
  {% include 'bloks/' ~ blok.component ~ '.html'
  with {blok: blok} only %}
{% endfor %}
</div>

Вот пример компонента уценки:

{{blok._editable}}

<div>
  <h2>{{blok.title}}</h2>
  <div class="markdown">
    {{blok.text|markdown}}
  </div>
</div>

Следующие шаги и дальнейшее чтение

Чтобы узнать больше о Storyblok и о том, как создать свою собственную тему или собственные компоненты, вы можете прочитать документацию разработчика. Если у вас есть какие - либо другие вопросы, слева, не стесняйтесь обратиться к нам с помощью чата на нашем сайте, Github.