Transcription
Разработка бэкенда занимает много времени. В большинстве случаев вам потребуется создать базовые операции CRUD, подготовить системы ролей и разрешений, а также подготовить панель администратора, чтобы команда могла управлять контентом. Вам также нужно подготовить некоторую документацию API для фронтенда. Но это было до появления headless CMS. И сегодня мы откроем для себя один из самых перспективных — Strapi.
Strapi "из коробки" избавляет от всех утомительных задач, предоставляя вам полную и интуитивно понятную платформу для создания структуры данных, автоматической генерации документированного REST или GraphQL API, а также представлений для администратора, чтобы заполнять и обновлять контент. Прежде чем мы углубимся в обзор платформы, давайте посмотрим на различные варианты использования Strapi. Вы можете использовать облачную версию, начиная с 99 долларов в месяц, или, поскольку это программное обеспечение с открытым исходным кодом, использовать версию, размещенную самостоятельно. Тем не менее, некоторые функции требуют лицензии Enterprise. Вместе мы будем использовать бесплатную версию с открытым исходным кодом через нашу платформу Elestio для простой настройки.
Чтобы создать наш экземпляр Strapi, перейдите на Elestio, нажмите "Войти", а затем "Развернуть мой первый сервис". Найдите Strapi, нажмите "Выбрать", затем выберите вашего облачного провайдера. Я выберу Scaleway. Выберите регион, выберите план вашей ВМ и нажмите "Далее". Затем выберите уровень поддержки и "Создать сервис".
Я получил электронное письмо с уведомлением о готовности моего экземпляра. Я могу нажать на ссылку здесь, чтобы получить к нему доступ. При первом открытии нам нужно создать нашего первого администратора. Давайте заполним нашу информацию, и мы подключены. И мы попадаем в процесс онбординга. Мы можем создать наш первый тип контента, прочитать документацию или посмотреть примеры кода. Давайте прочитаем документацию.
Мы попадаем в руководство по быстрому старту. Нам нужно прочитать его, чтобы узнать, как им пользоваться и что мы можем делать с помощью Strapi. Как и с любым другим программным обеспечением с открытым исходным кодом, мы посмотрим вместе. Я рекомендую вам ознакомиться с документацией, чтобы увидеть, на что вы способны, и понять, является ли это серьезным проектом. Вот оно.
Давайте создадим нашу первую коллекцию. Создайте свой первый тип контента. Отображаемое имя будет "Properties" (Свойства) и нажмите "Продолжить". Мы можем выбрать между множеством типов для создания наших коллекций. Давайте начнем с текста. Назовем его "Title" (Заголовок). Это короткий текст. Я могу выбрать, короткий он или длинный, и у меня есть расширенные настройки, такие как значение по умолчанию, шаблон проверки регулярного выражения, определение, является ли он обязательным, максимальная длина, является ли он частным, уникальным. Но нам ничего из этого не нужно, поэтому "Завершить".
Добавьте еще одно поле. Добавьте текстовое описание, и на этот раз длинный текст. Затем мы можем добавить, возможно, цену свойства. Нам нужен числовой тип "Price" (Цена). И тогда у вас есть формат числа. Поскольку это цена, нам нужно будет отображать центы, поэтому десятичное число будет хорошим. "Завершить".
Добавьте еще одно поле. Скажем, мы хотим отобразить площадь. Это будет число, тоже, возможно, десятичное. "Завершить". Или, может быть, мне следует использовать "Добавить еще одно поле" вместо "Завершить" каждый раз? О, давайте скажем, мы хотим добавить изображения. Это будет медиа. Назовем его "Thumbnail" (Миниатюра). У нас есть выбор между несколькими изображениями или одним медиа. Поскольку это миниатюра, здесь мы можем использовать одно медиа.
И добавьте еще одно поле. Мы можем добавить булево значение. Продано ли оно или нет. Расширенные настройки: значение по умолчанию будет "false" (ложь), оно не продано по умолчанию. И "ОК". Добавьте еще одно поле. И мы хотим добавить адрес этой собственности. Мы можем добавить, создать новый тип, который будет адресом, но мне не нужно хранить адрес независимо. Я мог бы использовать "Address 1", "Street", "City" в нескольких столбцах, но это не очень эффективно. Вместо этого мы будем использовать то, что называется "компонент". Нам нужно добавить категорию, скажем, "Address" (Адрес), и значок, может быть, этот. И настроить компонент. Вы можете видеть, что это либо повторяющийся компонент, но нам также нужен один адрес на свойство. Поэтому здесь одиночный компонент. Это для группировки полей, таких как полный адрес и информация. Так что это именно то, что мы хотим сделать. И нажмите "Завершить".
Итак, у нас определен тип "Properties" (Свойства), различные поля, которые содержит свойство. Нажмите "Сохранить".
Теперь давайте создадим новый тип коллекции, чтобы определить тип нашего свойства, например, квартиру или дом. Мы можем создать новый тип коллекции, назвать его "Property Types" (Типы свойств) и нажать "Продолжить". У него будет только тип "Type" (Тип). "Завершить". И мы нажимаем "Сохранить".
Теперь давайте выйдем из редактирования коллекции и перейдем непосредственно в коллекцию. Добавьте новый тип свойства. Скажем, "Apartment" (Квартира). Давайте добавим еще один, который мы назовем... О, сначала нам нужно его опубликовать. Это то же самое, но вам нужно опубликовать, потому что по умолчанию это черновик. Это отличная функция "из коробки" от Strapi: вам не нужно добавлять дату последнего обновления или создания, она уже есть в каждой записи коллекции, которую вы создаете.
Хорошо, вернемся к нашим типам свойств. Добавьте новый. Мы назовем его "House" (Дом). Сохранить, опубликовать и вернуться. Добавьте новый тип свойства. Скажем, "Condo" (Кондоминиум). Сохранить и опубликовать. Вы поняли. Итак, у вас есть все типы свойств. Вы можете видеть ID, тип, а также когда он был создан, когда обновлен и текущее состояние, опубликован ли он или это черновик. Вы можете дублировать, редактировать или удалять его. У вас также есть доступные фильтры, но этот не очень интересен. Мы добавим больше к свойствам позже.
Итак, давайте начнем... О нет, давайте пока не добавлять свойства. Теперь у нас есть типы свойств. Давайте посмотрим, как мы можем добавить их к нашим свойствам. Добавьте еще одно поле. Мы хотим создать связь между свойством, это будет его тип, и типом свойства. Итак, мы хотим, чтобы одно свойство имело одно... Итак, у вас есть связь здесь: "Property Type" (Тип свойства) и "Завершить". Не забудьте сохранить.
Теперь мы можем перейти к свойствам и добавить наши свойства. Итак, вы можете видеть, что он автоматически создает представление для редактирования. "Title" (Заголовок). Я спросил "Judgibility" (Субъективность). Он дал мне некоторые имена. "Siren Heaven" (Рай Сирены) — отличная собственность. Цена, скажем, 1 миллион. Я не знаю, достаточно ли я посчитал. Хорошо, 200 квадратных метров. Не продано. И мы можем добавить миниатюру. Это не просто файловый ввод, это менеджер ресурсов. Вы можете добавлять свои файлы и повторно использовать их в других коллекциях. Давайте добавим это изображение сюда. Загрузить один ресурс в библиотеку. "Завершить". И у нас здесь миниатюра. Адрес. У меня нет разрешения видеть эти поля, потому что я совершил ошибку. Я забыл добавить другие свойства внутрь адреса. Итак, нажмите "Сохранить" на данный момент. Перейдите к редактированию полей. И внутри адреса нам нужно сказать, что он содержит. Итак, адрес. У нас есть город, может быть, почтовый индекс. Скажем, это число. Я не уверен, что это работает везде. И "Завершить". Вы должны добавить больше, но мы будем придерживаться этого.
Хорошо, вернемся к нашим свойствам. Это одно. И теперь внутри адреса мы можем добавить наш адрес. Итак, 32 улицы чего-то там, Колорадо. Я поставил это. У меня здесь есть тип свойства, которое является полем связи. И у нас есть разные доступные типы. Итак, это будет квартира. И сохраните.
Что касается типов свойств, нам нужно опубликовать его. Вернитесь к нашим свойствам. И добавьте еще один. Назовем его "Luxury Retreats" (Роскошные ретриты). Пожалуйста. Давайте установим цену, площадь. Также добавьте изображение. Загрузить и "Завершить". Нам нужно добавить адрес. Я могу повторно использовать его. Это тип свойства. Этот. Это дом. И нажмите "Опубликовать".
Теперь, если мы перейдем к нашим свойствам, мы можем добавить некоторые фильтры. Мы можем перейти к цене. Не является. Ниже. Ну, вы можете добавить множество фильтров. И если вы перейдете к типу свойства, вы можете написать значение типа свойства. Итак, это квартира. И вы найдете эту. Он ищет значение связи для применения фильтра, что очень мощно. Теперь мы можем удалить его.
Мы также можем настроить представление. По умолчанию он выбрал первые столбцы нашей коллекции. Но мы можем перейти сюда, включить "Solve" (Решить) миниатюру. И мы можем даже изменить их порядок и сохранить надолго. Итак, давайте добавим миниатюру. Поставим ее первой. Сохранить. Да. Подтвердить.
Мы возвращаемся к нашим коллекциям. И теперь у нас есть миниатюра. У них есть этот приятный эффект при наведении курсора, вы видите изображение в увеличенном виде. Это доступно вам и вашей команде "из коробки". И из этих данных, которые вы создали без кода, вы можете сгенерировать REST API или GraphQL API.
Перейдем на рынок. Вы можете видеть, что у вас есть включенные плагины. Итак, у вас есть GraphQL, документация, конструктор типов контента. И некоторые уже установлены, например, электронная почта. Давайте добавим документацию, которая автоматически генерирует Swagger UI. API уже доступен, но нам нужен UI, чтобы передать его команде. Скачайте сейчас. Наш плагин документации установлен. Мы можем видеть его слева. И перейдем к документации. У нас есть JWT-токен, если доступ к документации ограничен или нет. И мы можем открыть документацию. Если вы знаете Swagger, вы должны быть знакомы с этим интерфейсом. Вы можете видеть, что мы сами создали свойства. И он автоматически сгенерировал конечные точки для GET, POST и других. Метод GET для получения количества свойств. У нас есть GET для получения одного конкретного свойства. И, например, на GET есть несколько параметров, которые вы можете использовать для выполнения запросов.
Если мы попробуем "из коробки", URL-адрес — это Strapi, а затем нам нужно добавить свойства. Мы получим сообщение "Forbidden" (Запрещено), потому что наш API не является публичным. Если мы хотим сделать их публичными, нам нужно перейти в наши настройки, в "Roles" (Роли) и в "Public" (Публичный) здесь. Итак, это роль, которую имеет любой. Вы можете добавить для каждого поля, что вы можете делать. Итак, для свойств мы хотим, чтобы люди могли их подсчитывать, находить их, но мы не хотим, чтобы люди могли создавать или удалять свойства. Найти одно — это нормально. И никакого обновления. То же самое для типов свойств. Найти одно — это нормально. Теперь нажмите "Сохранить". И вы можете видеть справа, что он говорит "Bound root to" (Привязанный корень к) и объясняет, какой маршрут вы обновляете, предоставляя или не предоставляя к нему доступ.
Теперь, если мы вернемся к нашей вкладке, перезагрузим, и у нас есть JSON с нашими данными. Это не очень читабельно. Давайте посмотрим в JsonLint. И теперь у нас есть массив объектов. Может быть, я могу немного увеличить масштаб. У нас есть ID, заголовок или информация, которую мы установили. И, как мы обсуждали ранее, мы не создавали "Published At", "Created At" и "Updated At", но это по умолчанию для всего, что вы делаете. У нас есть адрес. Поскольку это компонент, это вложенный объект. То же самое относится и к изображению "Thumbnail". Он дает много информации, поэтому вы можете использовать и оптимизировать в формате.
И если мы посмотрим дальше в документацию, у них есть некоторые параметры здесь, которые мы можем использовать для наших запросов. Нам не нужно, чтобы наша команда делала это за нас. Мы можем сказать: я хочу, чтобы заголовок содержал, может быть, "Lux", потому что у нас есть "Luxury Retreats". Фильтры. О, здесь заголовок. Хорошо. Теперь, если мы посмотрим, у нас есть только одно значение, и это "Luxury Retreats", потому что мы отфильтровали наш поиск.
Мы обновили нашу публичную роль, но, конечно, вы можете создать свою роль и своего пользователя для своей команды. Так что любой имеет правильный доступ к правильным данным. Если вам нужны дополнительные функции, которые Strapi не предоставляет "из коробки", вы можете перейти к веб-хукам и подключить свой бэкенд и выполнять дополнительную логику для этих данных внутри своего собственного бэкенда. И вы можете использовать их CLI для обновления данных и выполнения необходимых вам процессов.
Спасибо за просмотр. Мы надеемся, вам понравилось это видео. Дайте нам знать, есть ли какое-либо программное обеспечение с открытым исходным кодом, которое вы хотели бы, чтобы мы осветили, или если вы ищете конкретное программное решение и не можете его найти. Не забудьте подписаться, чтобы не пропустить наши предстоящие обзоры платформ. Чтобы продолжить ваше путешествие по программному обеспечению с открытым исходным кодом, я рекомендую вам посмотреть это видео здесь. [Музыка]