-
-
This is the home page for our website
-
This is the dummy sign in page that does not have functionality
-
This is the closet page in which you can enter options for new clothes and view your current clothes
-
This is the fit creator page in which you can create an outfit based on event formality, temperature, and precipitation
-
This is basic HTML code from the home page
Inspiration
After being trapped in hot weather with long sleeved clothes, one of our team members wanted a simple way to plan their outfit according to the weather. While brainstorming project ideas with the team, they brought it up and we all thought it was an interesting idea.
What it does
WeatherFit is a website that allows users to input the clothes they have in real life into a "closet". All clothes are then displayed on the closet webpage for simple viewing. After getting the users zip code, the website tells them what the weather is looking like and suggests an outfit to wear based on their current closet through our advanced filtering process.
How we built it
Our team coded the website on React.js, using elements from different programming languages such as JavaScript and HTML. We also implemented a Weather API to track the current weather and get updated data for instant fit creation. Secondly, we implemented a firebase realtime database to store clothing in a cloud storage to have permanent pieces of clothing on the website.
Challenges we ran into
As a mostly beginner team, we had to do a lot of research on how to use React.js and how to manage the data from an API. We also had issues with understanding the scope of our project as we were unable to complete the sign up/log in page within the 36 hours due to the complex intricacies of firebase. We simply planned to create too much and we did not have enough time to flesh out all the features and accomplish all our tasks.
Accomplishments that we're proud of
We were really proud with the overall outcome. As a team, we worked really hard and spent around 50 hours combined with all teammates on the project. We were especially proud of the functionality of our "closet" and "fit" pages, as they were the most difficult and time consuming parts of our project.
What we learned
Overall, we all learned the fundamentals of React.js and other coding principals such as using an API and firebase. For some of us, it was our first time working with others on a programming project, leading us to learn about the basics of being on a programming team. We also learned that it was really fun to work on a project with your friends!
What's next for WeatherFit
We had so much extra content we wanted to add but for the 36 hours we had, it would have been too big of a bite for us to chew. Firstly, we would like to get the sign up / log in page set up properly. We would also like to add other features such as naming the imported clothing items, allowing users to upload pictures, adding a "laundry" section, and an outfit planner for the entire week. We want to keep expanding on WeatherFit until it has reached its full potential!
Log in or sign up for Devpost to join the conversation.