электронная коммерция-admin-nextjs
Демонстрационный веб-сайт больше не работает из-за прекращения использования бесплатного плана PlanetScale.
Дата начала: 26 июля 2023 г.
Описание
Панель администратора электронной коммерции с интеграцией Stripe — это надежное веб-приложение, предназначенное для оптимизации и улучшения управления веб-сайтом электронной коммерции. Эта комплексная панель управления, разработанная с использованием передовых технологий, таких как Next JS, TypeScript, Tailwind CSS, Shadcn UI, Planet Scale, Prisma, zustand, clerk auth, Cloudinary и Stripe, предоставляет администраторам мощный набор инструментов для контроля и оптимизации различных аспектов интернет-магазин.
Ключевые особенности
- Панель администратора позволяет администраторам веб-сайта создавать, обновлять и удалять информацию о магазине.
- Администраторы могут эффективно управлять рекламными щитами или баннерами, которые появляются на главной странице веб-сайта. Они могут загружать, обновлять и удалять рекламные баннеры, чтобы привлечь клиентов и подчеркнуть текущие предложения или распродажи.
- С помощью панели администратора управление категориями, размерами и цветами продуктов становится проще простого. Администраторы могут добавлять, редактировать или удалять категории, размеры и цвета, что позволяет веб-сайту эффективно организовывать и отображать продукты.
- Чтобы обеспечить бесперебойную связь между интерфейсным веб-приложением и серверной частью, панель мониторинга включает маршруты API. Это гарантирует, что информация о продукте беспрепятственно извлекается и отображается на веб-сайте, ориентированном на клиента.
- Панель администратора использует аутентификацию Clerk для безопасной аутентификации, гарантируя, что только авторизованный персонал сможет получить доступ к конфиденциальной информации и управлять ею.
- Благодаря интеграции Planet Scale и Prisma приложение получает надежную и масштабируемую базу данных, способную обрабатывать растущие запасы продуктов и увеличивать посещаемость веб-сайта.
- Сердце любого веб-сайта электронной коммерции заключается в возможностях управления продуктами. Панель администратора позволяет администраторам добавлять новые продукты, обновлять существующие, архивировать отсутствующие на складе продукты, отмечать продукты как избранные и удалять продукты, которые больше не доступны. Они могут устанавливать такие сведения о продукте, как имя, категория, цена, изображения и другие атрибуты, специфичные для продукта.
- Эффективное управление заказами имеет решающее значение для любого веб-сайта электронной коммерции. Панель мониторинга предоставляет комплексные инструменты для просмотра, обработки и управления входящими заказами.
- Легко интегрируйте Stripe в качестве платежного шлюза, позволяя клиентам совершать безопасные и удобные онлайн-платежи. Администраторы могут просматривать историю транзакций и обеспечивать удобство оформления покупок для покупателей.
Тестирование проекта
Чтобы протестировать проект, скачайте zip-файл и откройте его в выбранном вами редакторе. Затем запустите npm install в терминале, чтобы установить зависимости.
После установки необходимых зависимостей вам нужно будет создать файл .env в корне папки вашего проекта. Обязательные переменные среды следующие.
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
DATABASE_URL=
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=
STRIPE_API_KEY=
FRONTEND_STORE_URL=
STRIPE_WEBHOOK_SECRET=
Следуйте инструкциям из официальной документации для Clerk, Planet Scale, Cloudinary и Stripe, чтобы получить значения переменной среды. После выполнения вышеуказанных шагов запустите npm run dev чтобы протестировать проект.
Если вы не хотите проходить через все хлопоты, вы всегда можете протестировать демо-сайт этого проекта.
