WeatherPredector banner

WeatherPredector

Created by: Sandy
8 devlogs
51h 21m

This application intelligently detects the user’s current geographic location and delivers accurate, real-time weather information for that area. By leveraging location-based services, it ensures that users receive precise and relevant weather updates without the need for manual input.

In addition to current conditions such as temperature, humidity, wind speed, and overall climate status, the application provides a detailed 7-day weather forecast. This weekly outlook helps users plan their activities in advance, whether for travel, work, or daily routines.

With a clean interface and reliable data presentation, the application is designed to offer a seamless and informative weather experience. It combines convenience, accuracy, and clarity to keep users informed about changing weather conditions anytime, anywhere.

Note:-
Enter your city clearly (e.g., “Los Angeles”) or this app will automatically detect your location for automatic weather updates.

This project uses AI

I used the AI tools to a minimal degree to debug some codes. I used the tools twice: to debug a JavaScript issue and to debug a CSS issue.

Demo Repository

README

Loading README...
Sandy
Sandy worked on WeatherPredector
about 23 hours ago
0h 20m logged

I update some components on it. Please enter the location correctly and clearly. For example, if your current location is in the USA, you can type in the name of the city, for instance, “Los Angeles.” Alternatively, you can allow the app to use your current location, and the app will automatically indicate the weather without requiring you to type anything.

0
Sandy
Sandy shipped WeatherPredector
about 23 hours ago

Shipped this project!

I created a weather app that displays live weather with sound effects, auto detects the user’s location, and switches between units. The hardest part was probably dealing with the bugs and syncing all the features together, but I was able to get it done. I’m super happy with the app itself.

Sandy
Sandy worked on WeatherPredector
about 23 hours ago
5h 39m logged

This is the final phase of the project, and it is amazing to say that all the work is complete. After extensive work and continuous testing and improvement, I was able to complete all the required features of the project. The most interesting feature I implemented in this project was the weather-based sound feature. With this feature, users can listen to different sounds based on the weather. The feature can be turned on or off based on user preference.

In addition, I implemented the feature of choosing the temperature scale between Fahrenheit and Celsius. This feature is important in making the project flexible and user-friendly. During this phase, I was able to resolve all the bugs I encountered in the project, including user input and user experience bugs. I mainly worked alone in this phase, except for some limited help from AI in fixing some CSS and JavaScript bugs when necessary.

In addition, I implemented all the cities in my region, enabling users to quickly check the weather in different cities. The project is complete, and I am really proud of how I was able to improve and learn throughout the entire process.

1

Comments

Sandy
Sandy about 23 hours ago

While searching your location, please make the API clear. Give some easy location like if you are in USA put something like this “Los Angeles”

Sandy
Sandy worked on WeatherPredector
1 day ago
7h 5m logged

In this application, I increased the available amount of weather information for users. I added various detailed information about the weather, including humidity, wind speed, visibility, time of sunrise, and sunset so that users can clearly and completely understand the weather. A good search feature has also been implemented to let the users look up current information about the weather of any city in the world.

In order for it to work smoothly, I have tested the application using valid and invalid inputs. While testing, I have fixed all issues regarding empty search, wrong city names, among other cases of unexpected input. This has made sure the application handles errors smoothly without confusing the user. The application was initially built using the weather data for my own city. However, users will be able to search for any city they want. By default, the app also automatically selects the user’s current location.

Attachment
Attachment
0
Sandy
Sandy worked on WeatherPredector
2 days ago
8h 21m logged

I enhanced the app to add a 7-day weather forecast feature and a “Today’s Highlights” feature. The structuring and looping through the data were challenging, and I had to fix some issues where some data was not being displayed. I also work on API integration, which helps to get data and updates.

Attachment
0
Sandy
Sandy worked on WeatherPredector
3 days ago
7h 30m logged

I also worked on the general behavior and look of the application. I added the feature of auto-detection of the location using JavaScript, so the app can detect the location of the user using the browser and fetch the correct information for the user. I also added the feature of changing the background based on the conditions and the time of day, which makes the application look dynamic. I also added the feature of handling different changes in the time and added error handling, so the application works fine even if the location access is denied, and the user can search manually without any issues.

Attachment
0
Sandy
Sandy worked on WeatherPredector
4 days ago
6h 16m logged

During this period, I mostly concentrated on correcting errors and making the project look better overall. This involved going through all the pages to identify errors that were causing things not to work properly, correcting these errors, and improving the design by making changes to the layouts and adding new parts to the design as needed. Finally, I made use of CSS to style the pages appropriately, ensuring they look better, cleaner, and organized.

Attachment
0
Sandy
Sandy worked on WeatherPredector
5 days ago
9h 38m logged

In this phase, I spent time improving the user interface and making the application visually clean and responsive. I adjusted spacing, colors, and fonts to make the layout easier to read. I also worked on making the design responsive so it works on both desktop and mobile screens. Some sections broke during resizing, so I fixed layout issues using media queries and flexible containers.

Attachment
0
Sandy
Sandy worked on WeatherPredector
6 days ago
6h 27m logged

During the first few hours, I focused on understanding the project requirements and planning the overall structure of WeatherPredector. I researched how weather applications work, explored beginner-friendly weather APIs, and decided on the main features such as current weather, weekly forecast, and location-based detection. I also created the basic project structure and started building a simple layout using HTML and I completed my full HTML code. At this stage, the app did not fetch real data, but it helped me visualize how different sections would look on the screen.

Attachment
0