День 1. Введение в HTML-over-the-Wire. Turbo Drive и Turbo Frame
На старте обсудим, почему и откуда появился подход HTML-over-the-Wire и какие проблемы он призван решить. Сделаем краткий экскурс в историю и вспомним, каким образом данный подход был реализован в Rails в прошлом, почему он уступил JS-приложениям, и как теперь Hotwire помогает Rails вернуть былую славу.
Затем, мы приступим к практической части и начнём с внедрения первых элементов Hotwire в приложения — Turbo Drive и Turbo Frame.
В результате вы:
Рассмотрим ситуации, когда сервера недостаточно для построения интерактивного UI, и познакомимся со вторым компонентом Hotwire — Stimulus:
В результате вы:
Делаем последний шаг на пути к интерактивному и реактивному приложения силами Hotwire — добавляем функционал реального времени через Turbo Streams:
В результате вы:
На старте обсудим, почему и откуда появился подход HTML-over-the-Wire и какие проблемы он призван решить. Сделаем краткий экскурс в историю и вспомним, каким образом данный подход был реализован в Rails в прошлом, почему он уступил JS-приложениям, и как теперь Hotwire помогает Rails вернуть былую славу.
Затем, мы приступим к практической части и начнём с внедрения первых элементов Hotwire в приложения — Turbo Drive и Turbo Frame.
В результате вы:
- научитесь подключать и настраивать Turbo Drive в проекте;
- узнаете о подводных камнях при использовании Turbo Drive;
- узнаете о возможных преимуществах разбиения HTML-страниц на кадры с Turbo Frame и рассмотрите популярные примеры использования;
- узнаете о том, какие новые возможности ждут нас в будущих версиях Turbo.
Рассмотрим ситуации, когда сервера недостаточно для построения интерактивного UI, и познакомимся со вторым компонентом Hotwire — Stimulus:
- научимся писать Stimulus-контроллеры и разберём их жизненный цикл;
- познакомимся с Values и Outlets API;
- рассмотрим разные подходы к проектированию Stimulus-контроллеров (контроллеры-компоненты и контроллеры-поведение);
- познакомимся с полезными библиотеками для работы со Stimulus.
В результате вы:
- получите необходимый опыт и знания для начала использования Stimulus.
Делаем последний шаг на пути к интерактивному и реактивному приложения силами Hotwire — добавляем функционал реального времени через Turbo Streams:
- рассмотрим базовый принцип работы Turbo Streams (HTML компоненты, действия, расширения);
- узнаем, как Turbo Streams использует Action Cable для обновлений в реальном времени.
В результате вы:
- попробуете на практике инструменты из экосистемы Hotwire и смежных технологий (например, TailwindCSS).
- узнаете о возможностях, ограничениях и подводных камнях при работе с Hotwire.
Для просмотра скрытого содержимого необходимо Войти или Зарегистрироваться.