Николай Ланец
16 апр. 2019 г., 5:11

Встраиваем prisma-cms в tilda.cc

Сегодня предпринял довольно интересный эксперимент: встроить prisma-cms в конструктор сайтов tilda.cc. Вот посмотрите что получилось: http://prisma-cms.tilda.ws/

Зачем это надо было?

Все мои начинания традиционно очень плохо выглядят внешне:) Чукча не дизайнер, чукча программист:)
А тут для одного проекта понадобилось хоть какое-то нормальное оформление. В поисках вдохновения посмотрел wix (пока не очень пристально, но посмотрю внимательней позже) и тильду. Тильда приглянулась больше, поэтому и времени ей уделил побольше. Все там вроде не плохо (много предзаготовленных блоков, довольно удобный редактор и т.п.), да вот только не хватает возможности работать со своими источниками данных. Даже личный кабинет и пользователи пока что еще в стадии beta у них, а большинство динамических функций реализуется через интеграции со сторонними сервисами (bitrix12, amoCRM и т.д. и т.п.). А вот хотелось бы иметь возможность сделать так, чтобы сайт был оформлен на тильде, а регистрация и т.п. - это все своя база и API. И как оказалось, это вполне можно сделать:) Тильда позволяет встраивать свои блоки HTML, при чем не фреймами какими-нибудь, а непосредственно тегами любыми HTML-тегами, включая link и script. При чем можно размещать отдельные блоки на отдельных страницах (при чем в разных местах), а можно создать общий header и footer для всего сайта. А prisma-cms, использующая react-scripts, позволяет билдить скрипты с указанием PUBLIC_URL, в результате чего подключенные скрипты всю остальную статику тянут по указанному базовому УРЛу (то есть со стороннего сайта, а не тильды), и API-запросы бегут по указанному API-адресу, то есть тоже на сторонний адрес идут, а не на тильду. Таким образом мы имеет полную интеграцию своего программного кода в сайт тильды. И ведь это еще не все!

В react 16 появилась такая крутая штука как порталы. Как известно, реакт при рендеринге имеет какую-либо единую точку входа (HTML-ноду, в которую он рендерится, root). А там он уже рендерит все свои внутренние компоненты. Но что делать, когда надо вывести дочерние компоненты не внутри текущего реакт-инстанса, а где-то за пределами его? В какую-то произвольную часть или части страницы? Вот в этом как раз и помогают порталы. Условно говоря, на тильда-сайте можно встроить свое реакт-приложение в одном месте, но из него уже оживить другие части тильда-сайта, как то кнопка регистрации/авторизации, навесив свои формы и взаимодействуя со своей базой данных пользователей, собственный каталог товаров и т.д. и т.п. Но и это еще не все!:)

У тильды заявлено свое API, которое призвано помощь в интеграции со своим собственным сайтом. Я еще его не изучил пока (на это нужно время), но наверняка там можно будет много чего интересного придумать :)

Ну и плюс к этому у тильды есть еще и собственный редактор блоков, по их заявлениям позволяющий создавать любые пользовательские дизайн-решения. Называют они это Zero-Block.

В общем, все это выглядит очень перспективно:) Буду изучать дальше.

UPD: Кстати, прикольно, что при изменении шаблонов во фронте здесь (да и вообще любых данных), они автоматически меняются и на тильда-сайте:) То есть при интеграции туда не теряются имеющиеся здесь фишки, касаемые автоматической перерисовки компонентов и т.п.

UPD2: Забыл сказать, картинки и аватарки там сейчас не подтягиваются, но это лечится в одном месте, позже поправлю. Сейчас это пока просто эксперимент.

Добавить комментарий