Menu Close

react-weather-app

React Weather App

react weather app

About The Project

This project was developed using React and involved creating a weather app from scratch. One of the main challenges I faced was figuring out how to create different components for different sections of the page and make them work together seamlessly.

The first task was to implement the search functionality, which involved learning how to retrieve the user’s current geolocation and using it to find the weather data for their location through an API call.

Next, I added a forecast component to the app. Initially, this was quite daunting, but I discovered how to reuse components and utilized this knowledge to map the daily forecast and display the weather data for 6 days. To achieve this, I used a different API call than the one used for the current forecast, which only provided data for one day.

Overall, the project was a great opportunity to deepen my understanding of React and develop my skills in component creation and API integration. In the future, I plan to improve the app further by adding more features, such as automatic dark mode toggling and spell-checking for the search bar.

Built With

  • React
  • HTML
  • CSS
  • API intergration
  • Bootstrap

Roadmap

  1. I would really like to remove the dark mode toggle and have it automatically change when the sun sets and rises in the default or current location.
  2. I would add an alert if you’ve made a spelling mistake, not entered a location or it’s unknown in the search bar.
  3. Celcius to Fahrenheit conversion. As part of the course I did learn to do this and it was implemented in the current weather. I removed the functionality as I hadn’t given this ability to the forecast or the wind speed. In the future I would like to add this functionality back fully.

Contact

Contact link: Likedin
Project link: React weather app

View Source Code
Posted in Development