Сайт тут: https://nylonorchid.pyeoptics.com/

Ребята, у нас в подписчиках есть человек, который примерил себе аватарку нашего канала и имя одного из директоров. Не знаем, что он задумал. Может быть собирается поздравить всех от лица Breadhead с наступающим Днем независимости Ямайки. Но на всякий случай предупреждаем, что он не имеет к нам никакого отношения.

Если вдруг напишет, сообщите пожалуйста. Нам пока не ответил.

Мы в реальности такие:
@addenny @thegamehasnoname

UPD: Оказалось, что человека зовут Денис и ему просто очень понравилась иллюстрация!

Пользуясь случаем, рекламирую Дашу. Все иллюстрации для нашего образа/сайта нарисовала она: https://dashasurma.com/.

Угадай, что?

В четверг гоняли в Москву и теперь официально: Breadhead переделывает сайты Даниловского. Будет классный сайт о рынке + удобный сервис доставки.

Внимательный читатель мог заметить, что мы несколько месяцев не писали ничего в канал. Сначала я отвлекся на политику: участвовал в муниципальных выборах в Питере. Параллельно расширяли команду: искали дизайнеров, разработчиков (и до сих пор ищем тимлида). Потом запускали важный проект, не без косяков. Потом 10 дней молчал и медитировал на Випассане.

После такого перерыва очень сложно сделать камбек и написать первый пост. Ведь он должен быть каким-то особенным: важным, полезным, интересным. Последние пару недель я думал с чего же начать и наконец понял: расскажу про штуку, которая поможет вам сэкономить кучу времени и денег при разработке проектов в вебе. Неважно, заказчик вы или разработчик, дизайнер, программист или менеджер – всем будет полезно.

Но, сперва небольшая предыстория. Много лет назад мы разрабатывали сайты на Битриксе. В один момент мы поняли, что с нашими нестандартными задачами разработка костылей к Битриксу занимаешь больше времени, чем разработка на фреймворках с нуля. А еще сайты на фрейворках работают быстрее, багов меньше, а писать код под нормальную архитектуру – приятнее. Так мы перешли на работу с фреймворками.

Все было классно, кроме одного: админки. У дизайнеров обычно не хватало времени её продумать, разработку админки с нуля мы обычно не закладывали в бюджет и поэтому делали ее по остаточному принципу. Все время пытались найти что-то подходящие: использовали bootstrap, чтобы были готовые сетки и компоненты, ставили разные темы для админок, интегрировались с trello и CRM для управления сайтом, иногда даже брали какой-нибудь wordpress.com и прикручивали наш фронт к нему по API.

Мы думали, что, вот-вот, когда-то, у нас накопятся наработки и мы будем собирать классные админки быстро и недорого (ха-ха-ха). Но на деле мы меняли подходы, технологии в стеке и каждый раз пилили свои велосипеды заново.

Пару лет назад начали активно развиваться headless cms. Это такие CMS которые не содержат шаблонов и просто отдают данные через API. Настраиваешь структуру данных, под нее автоматически создаются формы для редактирования. Есть облачные (Contentful, GraphCMS, Prismic), есть opensource (Strapi, Prisma). Часто их сайты выглядят круто и при первом подходе они выглядят как волшебная таблетка.

Мы все их пробовали, смотрели, но везде были какие-то проблемы. Где-то мы натыкались на ограничения в работе со сложными структурами данных (которые видишь, когда пробуешь создать что-то более сложное, чем блог). Где-то был некрасивый интерфейс. Где-то очень сложная кастомизация.

И вот сейчас можем сказать, что мы нашли что искали.
https://www.sanity.io/ – это микс облачной нереляционной базы данных с API (типа, как firebase) и опенсурсной Sanity Studio для редактирования контента. Расскажу тезисно:
– У нее есть полноценная бесплатная версия с ограничениями по количеству запросов и записей в базе данный. Но ограничения очень щедрые, их хватит для многих сайтов: https://www.sanity.io/pricing
– API предоставляет доступ по GraphQL и GROQ (это что-то ими придуманное, но неплохо сделано).
– В API встроены всякие штуки, типа CDN с возможность ресайза картинок. Это когда в админку ты загружаешь картинку 5000х5000 пикселей, а в нужный момент она отдаст тебе превью 120х80.
– Мультиязычность реализуется очень красиво: https://www.sanity.io/docs/localization
– Есть история изменений контента. Можно сохранять черновики и даже делать preview черновиков на своем сайте. Например, загрузили новую фотку для товара, посмотрели как выглядит на сайте и только потом опубликовали.
– Можно создавать поля типа array содержащие несколько разных типов данных внутри. Сложно объяснить, но это очень круто.
– С вложенными или связанными данными очень удобно работать и в админке и в API.
– Вы можете создавать свои типы данных любой сложности. Схема данных и структура админки описывается js-конфигами (возможно, разберется даже дизайнер). Удобно – можно переносить одинаковые сущности из проекта в проект.
– Sanity Studio написана на React, если чего-то не хватает, можно написать свои компоненты или использовать готовые. Посмотрите, какая штука есть для типа данных «видео»: https://www.sanity.io/blog/first-class-responsive-video-support-with-the-new-mux-plugin
– Редактор текста отдает текстовый контент в json, а не html. Это очень круто потому, что можно легко менять дизайн текстового контента без изменения данных.

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

Так выглядит Sanity Studio.