jtcaovan/WeatherApp

A simple weather application built with React and TailwindCSS

Breezy - A Weather App

Live Demo: https://jtcaovan.github.io/WeatherApp/

Description

A simple weather widget-style application that displays the current weather and hourly/daily forecast.

Learning Outcomes

This was a previous project rebuilt using React for additional practice.

• Learning outcomes include:
  • Asynchonous Javascript (Promises/async/await)
  • Built with React
    • React form handling (using react-form-hooks library)
    • Conditional rendering
    • Handling react events
  • Working with APIs
  • Styling with Tailwind CSS

Tools and Technologies

• JavaScript
• React.js
• Tailwind CSS
• OpenWeather API

Features

• Weather information from any city in the world
• Simple loading animation when fetching new location
• Convert between C°/F°
• Responsive web design

Challenges

• Project structure organization - splitting code into reusable React components
• Styling UI for responsive and clean design
• Accessing specific weather data from API calls - some OpenWeather calls didn't have all the weather information needed for this application
• Date and Time Unix conversions

Screenshots