🐾 Хатинка Лапок

Хатинка Лапок — це сучасний веб-портал притулку для тварин, створений для того, щоб допомогти кожному пухнастику знайти свою люблячу родину.

📖 Зміст

• Про проект
• Функціонал
• Технологічний стек
• Встановлення та запуск

🧐 Про проект

Цей веб-сайт вирішує важливу соціальну проблему — спрощує процес адопції (усиновлення) тварин. Ми створили зручний інтерфейс, де користувачі можуть познайомитися з мешканцями притулку онлайн, дізнатися про їхні особливості та характер, і зробити перший крок до того, щоб забрати тварину додому.

Мета проекту — зробити пошук нового друга максимально простим, прозорим та емоційно приємним.

✨ Функціонал

• Інтерактивна галерея: Перегляд усіх тварин, що зараз знаходяться в притулку.
• Детальні профілі: Кожна тварина має власну картку з фотографіями, детальним описом, історією та важливими характеристиками.
• Історія притулку: Історія притулку доповнена фотографіями та короткими історіями. Використовується Swiper для перегляду.
• Відгуки та довіра: Реалізована система відгуків від попередніх клієнтів та щасливих власників тварин. Використовується raty-js для візуалізації рейтингу (зірочки), що підвищує довіру до притулку.
• Онлайн-адопція: Інтегрована форма зворотного зв'язку, яка дозволяє майбутнім власникам подати заявку на "усиновлення" прямо на сайті.
• Зручний UI/UX: Використання акордеонів для компактного подання інформації та модальних вікон (SweetAlert2) для взаємодії з користувачем.

🛠 Технологічний стек

Проект розроблено з використанням сучасних веб-технологій та бібліотек:

• Core: HTML5, CSS3, JavaScript (ES6+)
• Bundler: Vite — для швидкої збірки та оптимізації проекту.
• Бібліотеки:
  • Axios — для виконання HTTP-запитів та взаємодії з сервером.
  • Swiper — для реалізації сучасних слайдерів та каруселей.
  • Accordion-js — для створення розгортанних блоків з інформацією.
  • Raty-js — для реалізації системи рейтингів у відгуках.
  • SweetAlert2 — для красивих та функціональних спливаючих вікон (повідомлень).
  • Swagger — для документації API.

🚀 Встановлення та запуск

Щоб запустити проект локально на вашому комп'ютері, виконайте наступні кроки:

Передумови

Вам знадобиться встановлений Node.js (версія 14 або вище).

Кроки

1. Клонуйте репозиторій: git clone
2. Встановіть залежності (NPM): npm install
3. Запустіть проект у режимі розробки: npm run dev
4. Відкрийте посилання, яке з'явиться у терміналі (зазвичай http://localhost:5173/).