Каталог з категоріями
Кукурудзяні та соняшникові жниварки, адаптери, ріпакові столи, транспортувальні візки й запчастини, згруповані у вкладені категорії, із пошуком по всьому каталогу.
Кейс
ЖНИВ-АГРО
Інтернет-каталог сільгосптехніки ЖНИВ-АГРО
Каталог жниварок, адаптерів і запчастин перенесено зі старого сайту разом із фотографіями. Команда керує товарами самостійно, покупці переглядають каталог українською та англійською.
Про продукт
ЖНИВ-АГРО з Кременчука понад 15 років виробляє та постачає сільгосптехніку. У каталозі кукурудзяні (ЖКУ/ЖСУ) і соняшникові жниварки, адаптери, ріпакові столи, транспортувальні візки та запчастини, сумісні з жатками John Greaves серій ЖК-80, ЖК-82 і ЖНС. Окремо компанія надає послуги металообробки: токарні, фрезерні, зварювальні роботи та різку.
Старий сайт уже не відповідав обсягу каталогу та вимогам до швидкості. Artbrain переніс близько 219 товарів і 471 фото на новий сайт-вітрину. Додали українську та англійську версії, інтерактивну карту клієнтів по Україні й панель для самостійного керування вмістом.
Завдання
Каталог із сотень позицій техніки та запчастин жив на застарілому OpenCart. Сайт повільно вантажився, ним було незручно керувати, а будь-яка зміна загрожувала просіданням у пошуку. Потрібен був сучасний сайт-вітрина: швидкий, з простим наповненням і без втрати трафіку, який компанія напрацювала за роки.
Ключові вимоги: перенести весь каталог і фото без втрат, зберегти старі URL через 301-редіректи, додати двомовність UK/EN і зробити кастомну адмінку приблизно на 30 розділів. Дизайн та інтерактив (слайдери, карта клієнтів, галереї) мали лишитися такими ж, як узгодили з клієнтом. Кошик не потрібен: конверсія йде через заявку на дзвінок і форму зворотного зв'язку.
Перегляд на десктопі
Каталог, категорія запчастин і сторінка «Про нас» з картою клієнтів. Натисніть на плитку, щоб збільшити.
Перегляд на смартфоні
Ті самі сторінки на екрані 390 px: повністю адаптивна верстка, гамбургер-меню, оптимізовані зображення.
Архітектурне рішення
Узгоджений дизайн зібрано на готовому шаблоні з великою кількістю jQuery-коду: слайдери, карта клієнтів і галереї там вмикаються вже після завантаження сторінки. Стандартний для Next.js підхід, коли сторінку після завантаження додатково обробляє React, конфліктував із цим кодом і ламав верстку. Переписувати весь шаблон було довго й дорого, тому ми пішли іншим шляхом і розділили сайт на два контури.
Публічна частина сайту складається зі швидких сторінок-вітрин. Вони формуються одразу на сервері: дані беруться з бази й віддаються браузеру вже готовим HTML, без додаткової обробки в React. Завдяки цьому дизайн і всі плагіни працюють так, як замислено, а сторінки відкриваються миттєво. Адмінку зробили навпаки, повноцінним React-застосунком, бо там жива інтерактивність дійсно потрібна. Так кожна частина сайту працює тим способом, який їй підходить.
Технологічний стек
CMS
Кастомна Next.js-адмінка (React)
Backend
Next.js 16 (App Router), PostgreSQL 17, Prisma ORM
Frontend
React 19, TypeScript, Swiper, Leaflet
Інтеграції
Форма лідів, Viber/WhatsApp/Telegram, карта клієнтів, 301-редіректи
Що зроблено
Вітрина-каталог, який швидко працює, легко наповнюється через адмінку і зберігає весь накопичений SEO-трафік.
Каталог з категоріями
Кукурудзяні та соняшникові жниварки, адаптери, ріпакові столи, транспортувальні візки й запчастини, згруповані у вкладені категорії, із пошуком по всьому каталогу.
1 / 6Детальна картка товару
Фото-галерея з лайтбоксом, технічні характеристики, сумісність із жатками John Greaves (серії ЖК-80, ЖК-82, ЖНС), ціна та відео товару.
2 / 6Кастомна CMS (~30 розділів)
Повноцінна адмінка: товари, категорії, зображення, блог і сторінки (редактор TipTap), блоки головної, меню, футер, маркери карти, ліди зі статусами та користувачі з ролями.
3 / 6«Замовити дзвінок» + ліди
Вітрина-каталог без кошика: відвідувач залишає заявку на дзвінок або заповнює форму зворотного зв'язку. Кожне звернення стає лідом в адмінці зі своїм статусом.
4 / 6Двомовність UK/EN
Окрема таблиця перекладів (locale, model, field) із fallback на українську, hreflang-теги та повноцінне SEO-meta обома мовами.
5 / 6SEO-міграція з OpenCart
Близько 219 товарів і 471 фото перенесено парсингом зі старого сайту на OpenCart. Для старих адрес налаштували 301-перенаправлення на відповідні сторінки нового сайту.
6 / 6Детальна картка товару
Фото-галерея з лайтбоксом, технічні характеристики, сумісність із жатками John Greaves (серії ЖК-80, ЖК-82, ЖНС), ціна та відео товару.
Кастомна CMS (~30 розділів)
Повноцінна адмінка: товари, категорії, зображення, блог і сторінки (редактор TipTap), блоки головної, меню, футер, маркери карти, ліди зі статусами та користувачі з ролями.
«Замовити дзвінок» + ліди
Вітрина-каталог без кошика: відвідувач залишає заявку на дзвінок або заповнює форму зворотного зв'язку. Кожне звернення стає лідом в адмінці зі своїм статусом.
Двомовність UK/EN
Окрема таблиця перекладів (locale, model, field) із fallback на українську, hreflang-теги та повноцінне SEO-meta обома мовами.
SEO-міграція з OpenCart
Близько 219 товарів і 471 фото перенесено парсингом зі старого сайту на OpenCart. Для старих адрес налаштували 301-перенаправлення на відповідні сторінки нового сайту.
Підсумок
Новий сайт zhnivagro.com.ua працює на Next.js 16 і PostgreSQL замість старого OpenCart. Каталог із ~219 товарів і ~471 фото перенесено повністю, усі старі адреси закрито 301-редіректами, тож пошукова індексація й позиції збереглися. Сайт двомовний (UK/EN), має пошук по каталогу, картки товарів із характеристиками й сумісністю, блог, FAQ та інтерактивну карту клієнтів по Україні.
Команда ЖНИВ-АГРО самостійно керує каталогом, блогом, головною сторінкою та заявками через кастомну адмінку приблизно з 30 розділів. Заявки з форм «Замовити дзвінок» збираються як ліди зі статусами. Окремо попрацювали над швидкістю: стилі шаблону зменшили з 585 КБ до 64 КБ, а важку карту винесли в ліниве завантаження, тому сторінки відкриваються швидко навіть на телефоні.
Часті запитання
Сайт працює на Next.js 16 (App Router) з React 19 та TypeScript, базою даних PostgreSQL 17 і ORM Prisma. Публічні сторінки віддаються як серверний HTML для максимальної швидкості, а адмінку зроблено як повноцінний React-застосунок.
Близько 219 товарів і 471 фото перенесено парсингом зі старого zhnivagro.com.ua на OpenCart. Для старих адрес налаштували 301-перенаправлення на відповідні сторінки нового сайту.
Так. Це кастомна CMS приблизно з 30 розділів: товари, категорії, зображення, блог і статичні сторінки (редактор TipTap), блоки головної, навігація, футер, маркери карти клієнтів, ліди зі статусами та користувачі з ролями. Команда керує всім без розробника.
Дві: українська та англійська. Локалізація реалізована через окрему таблицю перекладів із fallback на українську та hreflang-теги для коректної індексації пошуковими системами.
Так, Artbrain розробляє сайти-каталоги та інтернет-магазини для виробників і постачальників на Next.js та Django, з кастомною адмінкою та SEO-міграцією зі старого сайту. Розкажіть про проект через форму або зв'яжіться напряму.
Почніть свій шлях до успіху
Маєте проект? Давайте реалізуємо його разом.
Потрібен схожий сайт-каталог на Next.js або Django, з кастомною адмінкою, локалізацією UK/EN та чистою SEO-міграцією зі старого сайту? Розкажіть про задачу, і ми відповімо протягом 15 хвилин у робочий час.
