Skip to content

IyadShobaki/se_project_react

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

86 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

WTWR (What to Wear?)

WTWR is a responsive, weather-based clothing recommendation web application built with React.js. The application calls a weather API to fetch current weather conditions and then displays suggested clothing items appropriate for the weather.

Features

  • Real-time weather data integration
  • Dynamic clothing recommendations based on temperature
  • Interactive UI with modals for viewing and managing clothing items
  • Temperature unit toggle (Fahrenheit / Celsius) using React Context
  • Profile page with full wardrobe view using React Router
  • Add and delete clothing items with form handling and confirmation modals
  • Fully responsive design following modern UI principles

Technology Stack

  • Frontend: React.js with Vite
  • Styling: CSS with BEM methodology and responsive media queries
  • API Integration: OpenWeather API
  • Mock Backend: json-server for CRUD operations
  • Deployment: GitHub Pages

Future Enhancements

  • User authentication and personalized wardrobes
  • Persistent backend with database integration
  • Smart outfit recommendations based on user preferences and history
  • Enhanced accessibility and theme customization

Links

Live Website

Visit the live application deployed with GitHub Pages: 👉 https://iyadshobaki.github.io/se_project_react

Visit the live application deployed with Google Cloud - Full stack version: 👉 https://www.wearright.jumpingcrab.com/

Project Pitch Videos

Check out these videos, where I describe my project and some challenges I faced while building it:

Backend API

https://github.com/IyadShobaki/se_project_express

Deployed project’s domain name

https://www.wearright.jumpingcrab.com/

About

React front-end application WTWR

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages