weather-app

Retro Weather Digest

A retro newspaper-inspired weather application built for DTC 477: Advanced Web Design. This project uses the OpenWeather API to fetch and display current, 5-day, and hourly weather forecasts. The design is fully responsive and features interactive elements with nostalgic styling.

🔗 Live Demo

Check it out here:
🔗 Repo: https://zt-devlog.github.io/weather-app/

---

💡 Project Statement

This Weather Application project demonstrates a comprehensive implementation of API integration with a creative user interface. The development process followed these phases:

1. API Research – Explored the OpenWeather API documentation to understand endpoints and data structure
2. UI Design – Created a retro newspaper layout for displaying weather data
3. HTML/CSS Development – Built structure and responsive styling by hand
4. JavaScript Integration – Used fetch() to retrieve weather data and display it in real time
5. Feature Enhancements – Included geolocation, animated loading states, error handling, and ASCII-style graphs

---

🤖 AI & Tool Support

I used Claude.AI to help debug tricky API issues, refine the UI animations, and improve error handling. The assistant also helped enhance responsiveness and ensure clarity of code structure and purpose.

---

💻 Technologies Used

• HTML5
• CSS3
• JavaScript (vanilla)
• OpenWeather API
• LocalStorage
• Geolocation API

---

🧩 Features

• 🔍 Weather by City & State
• 📍 Geolocation-based forecast
• 📅 5-day forecast view with weather icons
• ⏰ ASCII-style hourly temperature chart
• 🎨 Retro-themed responsive design
• 🛑 Error messaging and loading indicators

---

📝 Credit

Created by Zoe Thompson for DTC 477 — Advanced Web Design
Washington State University Vancouver, 2025