Ось як може виглядати тиждень роботи над проєктом Weather App. Натисни на день:
День 1 — Понеділок
💡 Ідея + Планування
Вирішуєш що робити, малюєш wireframe на папері
Визначаєш функціонал: поле вводу міста, кнопка пошуку, відображення температури, іконка погоди, вологість та вітер. Малюєш каркас на аркуші — де що буде.
День 2 — Вівторок
🏗️ HTML структура
Створюєш всі елементи сторінки
Header, форма пошуку, секція з погодою, footer. Все семантично: <header>, <main>, <section>. Поки без стилів — просто структура.
День 3 — Середа
🎨 CSS стилізація
Робиш красивий дизайн, адаптив
Кольори, шрифти, Flexbox для лейауту. Media queries для мобільних. Плавні анімації. Перевіряєш на телефоні!
Дні 4-5 — Чт/Пт
⚡ JavaScript + API
Підключаєш OpenWeather API, пишеш логіку
fetch() запит до API, парсинг JSON, відображення даних на сторінці. Обробка помилок (місто не знайдено). Якщо не знаєш як — стаття про API допоможе!
День 6 — Субота
🧪 Тестування + Фікси
Тестуєш на різних пристроях, фіксиш баги
Перевіряєш Chrome, Safari, мобільний. Оптимізуєш картинки. Пишеш README.md для GitHub. Робиш скріншот для портфоліо.
День 7 — Неділя
🚀 Деплой + Показати світу!
Публікуєш на Vercel, додаєш до портфоліо
git push → Vercel → живий сайт! Додаєш проєкт до портфоліо. Ділишся посиланням в LinkedIn. Деталі деплою — у статті про хостинг.
✅ Трекер прогресу
Клікай на етапи, коли закінчиш їх для свого проєкту:
