Skip to content

Repository files navigation

Project 10: WTWR (What to Wear)

Overview

  • Intro
  • Figma
  • Images
  • Page
  • Improvements
  • Video

Intro

WTWR is a weather tracking web app that will suggest what should be worn depending on the current tempature. The call to the https://openweathermap.org/ API using (currently hard coded) longitude and laditude. The app then gathers needed information from the API (location, tempature, condition) and displays the city, tempature, and shows a banner with the current condition (right now limited to clear, raining, snowing, cloudy, and lightning (thunderstorm)). Using the tempature, the app then displays clothing approperate for outdoor use.

If the user clicks on the clothing a popup showing an enlarged image of the clothing along with a brief description. Here the user can also choose to delete the item, with a verification modal. The 'Add Clothes' button opens a popup where the user can add clothing.

New users can create an account with a unique email address. And provide an avatar, if no avatar, 'avatar image' is the user's first initial of their first name. This is also, only when they user can add clothing items.

The user can also log out.

If a non-registered 'user' attempts to view a profile page, or clothing items, will direct them to create an account.

Figma

Images

This project was created with HTML, CSS, JS, and React. With the visual being from Figma.

GitHub

Improvements

I want to add geolocation to this project, so that any user, regardless of their location, can use this. Also, adding functionality to, when a modal pops up have the cursor in the first text field, and when the user hits 'tab' goes to the next field. Then have the user be able to upload an image from their computer, instead of a web address, for their profile picture.

Video

Will be created later

About

React front-end application WTWR

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages