Контентный стартер с интеграцией Strapi

DTC furniture eCommerce starter

Solace это аккуратный современный DTC-стартер для магазина мебели на Medusa 2.0 и Next.js 14. Он даёт всё для запуска интернет-магазина: сетку товаров с фильтрами, профили пользователей, историю заказов, пошаговое оформление заказа с оплатой через Stripe, поиск по товарам и настраиваемые страницы товаров. Вместе с Strapi CMS поставляются готовые модели контента, поэтому сайт легко редактировать.

Содержание

• Требования
• Обзор
  • Возможности
  • Демо
• Быстрый старт
• Материалы
• Участники

Требования

• Бэкенд MedusaJS 2.0. Если он ещё не развёрнут, воспользуйтесь одним из вариантов:
  • Наш готовый репозиторий: Medusa 2.0 API
  • Документация Medusa 2.0

    Важно: если вы берёте не наш готовый репозиторий API, не забудьте:

    • Скопировать папку из репозитория в свой проект API
    • Скопировать файл Middlewares из репозитория в свой проект API

    Без этих файлов не работают поисковый движок и логика фильтров, то есть поиск и фильтрация будут недоступны.

• Система управления контентом, например Strapi. Если она ещё не развёрнута, воспользуйтесь одним из вариантов:
  • Наш готовый репозиторий: Strapi
  • Документация Strapi

    Важно: после развёртывания Strapi настройте вебхук перепроверки:

    1. Задайте STRAPI_WEBHOOK_REVALIDATION_SECRET в .env вашего Next.js (надёжное значение можно сгенерировать командой node -e "console.log(require('crypto').randomBytes(32).toString('hex'))")
    2. В панели администратора Strapi: Settings → Webhooks → Create new webhook
    3. Настройте вебхук:
       • URL: {your-frontend-url}/api/strapi-revalidate?secret={YOUR-STRAPI_WEBHOOK_REVALIDATION_SECRET}
         Пример: http://localhost:8000/api/strapi-revalidate?secret=30747ea915627411fa275b9e3e6cafd199f9c5b221696b644509c02510ebe979
       • Дополнительные заголовки не нужны
       • Включите события Entry и Media (Create, Update, Delete)

Обзор

Возможности

Витрина закрывает всё, что требуется современному интернет-магазину.

• Полноценный профиль пользователя
  • История заказов
  • Настройки профиля
  • Данные доставки
  • Сброс пароля
• Корзина
  • Добавление и удаление товаров
  • Применение промокодов
• Оформление заказа
  • Полный процесс из трёх шагов
  • Оплата через Stripe
  • Письма-уведомления после оформления
• Страницы «О нас», блога, политики конфиденциальности и условий использования
  • Полностью настраиваются через CMS.
• Поиск по товарам по ключевым словам.
• Страницы товаров
• Коллекции и категории
• Поддержка двух тем
  • Тёмная
  • Светлая
• Поддержка Next.js 14

Демо

Профиль пользователя

Корзина

Оформление заказа

Поиск

Страница товара

Быстрый старт

Клонируйте репозиторий

git clone https://github.com/rigby-sh/solace-medusa-starter.git

Установите пакеты

npm install

Переменные окружения

Создайте файл .env и добавьте в него переменные, перечисленные ниже.

Разработка

Запустите приложение с включённым autoReload

npm run dev

Сборка

Соберите проект, чтобы получить превью продакшен-версии

npm run build

Запуск

Запустите превью-версию проекта

npm run start

Развёртывание проекта в Vercel

Развернуть приложение в Vercel быстро и просто, а управлять проектом и масштабировать его потом легко. Нажмите кнопку ниже, чтобы начать: Vercel проведёт вас по шагам настройки и подключится к вашему репозиторию.

Материалы

Подробнее о Medusa

• Сайт
• GitHub
• Документация Medusa 2.0

Подробнее о Next.js

• Сайт
• GitHub
• Документация

Подробнее о Strapi

• Сайт
• GitHub
• Документация

[!IMPORTANT] > Об использовании изображений: изображения в этом стартере предназначены только для предварительного просмотра. Лицензия распространяется исключительно на это демо, использовать их в коммерческих проектах или распространять нельзя. Если вы берёте стартер для своего магазина, замените все изображения на те, права на которые получены для вашего проекта.

Участники