Weather App

Display a 5-day weather forecast, where each day shows the high and low temperatures, and an image for sunny/rainy/cloudy/snowy. Use fake, hard-coded data until you’ve got everything rendering correctly.

Technologies

1. ESLint + Prettier
2. React
3. Typescript
4. React Router
5. React Hooks
6. Axios
7. dayjs
8. Atomic Design Pattern (ask your mentor firstly)
9. SASS

Todo:

1. Add the ability to click on a day, and see its hourly forecast.
2. Add React Router to the project (yarn add react-router) and add routes, such that /shows-5-day-forecast, and /[name-of-day]-forecast shows the hourly forecast for a particular day.
3. Sign up for a free API key from Open Weather Map, fetch a real 5-day forecast, and feed that data into your app.

Design examples:

1. 5 day forecast
2. 1 day forecast

Source