logo Luckylo

Описание кейса:

В 2026 году был разработан и запущен Zerde-Baisat - оптовый интернет-магазин детских игрушек, ориентированный на рынок Казахстана. Проект решает реальную задачу: дать оптовым покупателям удобный инструмент для заказа товаров онлайн без лишних звонков и ручного согласования.

Технический стек

В основе проекта — Next.js 16 с App Router, React 19 и TypeScript. Для стилизации использован Tailwind CSS v4, база данных - Neon Postgres с доступом через Prisma ORM. Авторизация построена на Auth.js v5 (next-auth beta) с поддержкой двух методов входа: Google OAuth и классический логин/пароль. Изображения товаров хранятся в Cloudflare R2 — загрузка происходит напрямую из браузера через presigned URL, что снижает нагрузку на сервер.

Функциональность для покупателей

Покупатель попадает на главную страницу, где автоматически определяется его город по геолокации. При первом визите система запрашивает согласие на cookies и аналитику. Каталог организован по категориям, каждый товар имеет детальную карточку с фото, описанием, вкладками доставки и оплаты, а также отзывами - оставить отзыв может только тот, кто реально купил товар.

Корзина доступна без регистрации, однако для оформления заказа необходим вход. При оформлении поддерживаются купоны и подарочные сертификаты — скидка пересчитывает итоговую сумму в реальном времени. Оплата — через QR Kaspi или банковский перевод. Доставка — самовывоз или межгород.

В личном кабинете пользователь видит историю заказов с детализацией и отслеживает статусы: от «Заказан» через «Сборку» и «Отправлен» до «Исполнен». После успешного оформления на email приходит подтверждение через Resend.

Административная панель

Администраторы управляют товарами, остатками и заказами через встроенную панель. Каждое действие фиксируется в аудит-логе: система записывает кто, когда и что изменил - создание товара, корректировка остатков, изменение статуса заказа. Это обеспечивает прозрачность и контроль над операциями.

Детали UX и SEO

Проект уделяет внимание деталям: корректная работа автозаполнения форм в тёмной теме, Open Graph и Twitter Card метаданные для красивого превью при репосте в соцсети, веб-манифест для установки на мобильный экран, карта сайта для поисковых систем.

Zerde Baisat — это законченный продукт, покрывающий весь путь покупателя: от первого визита на сайт до получения товара и написания отзыва.

Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat
Интернет-магазин Zerde-baisat