Skip to content

marana08/fluffy_team

Repository files navigation

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

📝 Про проєкт

"Хатинка лапок" — односторінковий сайт притулку для тварин, реалізований студентами GoIT у рамках навчального курсу Full Stuck development.

📝 Функціональність

  • 🐶 Секція «Наші хвостики» — користувачі мають змогу переглянути всіх тварин, доступних для адопції, відфільтрувати їх картки за обраною категорією
  • 🐶 Модальне вікно «Деталі про тваринку» - перегляд додаткової інформації про тварину
  • 📩 Модальне вікно заявки - проста форма для заявки на адопцію обраної тварини
  • 💬 Відгуки - історії тих, хто вже став власником тварини з нашого притулку
  • FAQ — відповіді на поширені запитання про процес адопції
  • 🏠 Про нас інформація про притулок та його команду
  • 🔍 Хедер та футер - зручна навігація на сайті

🛠️ Технології та інструменти

  • 🌐 HTML — семантична розмітка сторінки.
  • 🎨 CSS — стилізація та адаптивний дизайн.
  • JavaScript — інтерактивність та логіка роботи сайту.
  • 🚀 Vite — швидкий збірник та середовище розробки.
  • 🔧 Git — контроль версій та командна робота.
  • ⚙️ Backend — REST API та пагінація

📚 Бібліотеки:

  • 📸 Swiper.js — слайдер для галерей та каруселей.
  • 🌐 Axios — робота з HTTP-запитами.
  • 🔔 iziToast та sweetalert2 — стильні повідомлення та нотифікації.
  • 🎨 Modern Normalize — вирівнювання стилів у різних браузерах.
  • 📂 Accordion — інтерактивні блоки для FAQ та секцій.
  • Raty-js - вивід рейтингу у отриманому з бекенду відгуку у вигляді відображається у вигляді зірочок

📱 Адаптивність та доступність

📐 Адаптивність

Верстка адаптована екрани різного розміру, а також під екрани різної щільності

  • 📏 Mobile: верстка гумова від 320px, стає адаптивною з 375px.
  • 📏 Tablet: адаптивна верстка з 768px.
  • 📏 Desktop: адаптивна верстка з 1440px.

♿ Доступність

Сайт адаптований для пристроїв зчитування екранів, використано семантичну HTML-структуру та ARIA-атрибути 🏷️

👩‍💻 Над проєктом працювали

Команда Fluffy team, студенти GoIT:


🚀 Як запустити/розгорнути проєкт

  1. Переконайтесь, що на комп'ютері встановлено LTS-версію Node.js
  2. Встановіть базові залежності проекту в терміналі командою npm install
  3. Запустіть режим розробки, виконавши в терміналі команду npm run dev
  4. Перейдіть у браузері за адресою http://localhost:5173. Ця сторінка буде автоматично перезавантажуватись після збереження змін у файли проекту.

🔗 Вихідні матеріали


📄 Ліцензія

MIT - вільне використання зі збереженням авторського права

About

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors