Каталог оренди авто
Вебзастосунок для перегляду, фільтрації та бронювання авто на основі даних з API.
РольFrontend Developer
ТипВебзастосунок для оренди авто
ЛокаціяМіжнародний проєкт
ФокусРеалізація динамічного каталогу з фільтрацією, запитом на бронювання та інтеграцією API.
СтекNext.js, TypeScript, REST API
Тривалість1 тиж.
Коротко про проєкт
- Тип проєкту
- Каталоговий вебзастосунок
- Ціль
- Створити інтерфейс оренди авто, де користувач може швидко знайти потрібний варіант і надіслати запит.
- Ключові функції
- Каталог авто
- Фільтрація
- Обране
- Запит на бронювання
- Інтеграція API
- Моя роль
- Frontend-реалізація, UI-логіка, робота з API і адаптивний layout.
- Стек
- React
- TypeScript
- REST API
- CSS Modules
- Результат
- Каталоговий вебзастосунок із зручним переглядом, фільтрацією і чітким шляхом до запиту.
Проблема
Користувачам потрібен був швидкий і зрозумілий спосіб переглядати авто, застосовувати фільтри та надсилати запит на бронювання.
Рішення
Я реалізував frontend за готовим дизайном із фокусом на динамічну фільтрацію та інтеграцію API. Користувач може переглядати пропозиції, фільтрувати результати, відкривати деталі та надсилати запит із валідацією.
Ефект
У результаті вийшов робочий застосунок, який демонструє практичну роботу з API, логікою фільтрів і реальною взаємодією користувача.
Що я зробив
- Реалізував увесь frontend на основі макета з Figma
- Побудував динамічний каталог авто з даними з API
- Зробив систему фільтрації (бренд, ціна, пробіг)
- Додав функціонал обраного
- Підготував детальні сторінки авто
- Зібрав форму бронювання з валідацією та date picker
- Інтегрував API для завантаження і рендерингу даних
Hero
Вхідний екран із головним повідомленням застосунку.
Адаптивність
Десктопна та мобільна версії інтерфейсу.
Каталог і пошук
Огляд каталогу з пошуком і зручним переглядом пропозицій.
Фільтрація
Фільтри за брендом, ціною та пробігом.
Обране
Стан вибраних авто і робота зі списком обраного.
Деталі авто
Сторінка авто з характеристиками і ключовою інформацією.
Запит на бронювання
Надсилання запиту на оренду зі сторінки авто.
Потрібен сайт, який спрощує контакт із клієнтами?
Підготую зрозумілий сайт із простим шляхом до заявки, бронювання або розмови.