Вигляд:
Aura — це сучасний адаптивний погодний додаток на базі Vite + React, що показує актуальні погодні умови для обраних міст. Підтримує багатомістовий режим, теми оформлення та анімований інтерфейс.
Можливості
✔Автоматичне визначення місцезнаходження
✔Пошук погоди за локацією
✔Перемикач теми (світла/темна)
✔Можливість додати кілька локацій одночасно
✔Закріплення улюблених локацій (через localStorage)
✔Анімація інтерфейсу (Framer Motion)
✔Автооновлення кожні 2 години
Використані технології
React
Motion
SCSS (BEM)
Структура проєкту
├── 📁 public/ # Папка з публічними ресурсами (наприклад, статичні файли)
└── 📁 src/
├── 📁 assets/
│ └── 📁 styles/ # Стилі застосунку (SCSS-модулі)
│ ├── 🎨 App.scss # Глобальні стилі та базове оформлення
│ ├── 🎨 Card.scss # Стилі картки з інформацією про погоду
│ ├── 🎨 Details.scss # Оформлення блоку деталей погоди
│ ├── 🎨 Form.scss # Стилі пошукової форми
│ ├── 🎨 RotatingText.scss # Анімації/стилі обертового тексту
│ ├── 🎨 SplashScreen.scss # Стилі екрану-заставки
│ └── 🎨 ThemeToggle.scss # Стилі перемикача теми (світла/темна)
├── 📁 components/ # Компоненти React
│ ├── 📄 AppParticlesBackground.jsx # Фон з анімацією частинок
│ ├── 📄 Loader.jsx # Індикатор завантаження
│ ├── 📄 RotatingText.jsx # Обертовий/анімаційний текст
│ ├── 📄 SplashScreen.jsx # Стартовий екран-заставка
│ ├── 📄 WeatherCard.jsx # Картка з короткою інформацією про погоду
│ ├── 📄 WeatherDetails.jsx # Детальна інформація про погоду (вітер, вологість тощо)
│ └── 📄 WeatherForm.jsx # Форма пошуку для введення міста/локації
├── 📁 services/
│ └── 📄 WeatherService.js # Сервіс для роботи з API погоди
├── 📄 App.jsx # Головний компонент застосунку
└── 📄 main.jsx # Точка входу, рендерить React у DOM