From 1e07a489e841945b6f20e6df66cce6eeef5cfd3a Mon Sep 17 00:00:00 2001 From: dsh Date: Thu, 17 Oct 2024 11:29:22 +0100 Subject: [PATCH] add weather app project --- src/data/projects/weather-app.md | 38 ++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 src/data/projects/weather-app.md diff --git a/src/data/projects/weather-app.md b/src/data/projects/weather-app.md new file mode 100644 index 000000000..3aee00a59 --- /dev/null +++ b/src/data/projects/weather-app.md @@ -0,0 +1,38 @@ +--- +title: 'Weather Web App' +description: 'Build a weather app that fetches and displays weather for a given location.' +isNew: false +sort: 1 +difficulty: 'intermediate' +nature: 'API' +skills: + - 'Programming Language' + - '3rd Party APIs' + - 'JavaScript' + - 'HMTL' + - 'CSS' +seo: + title: 'Weather App Project Idea' + description: 'Build a web-based weather app that fetches and displays weather data.' + keywords: + - 'weather api' + - 'frontend project idea' +roadmapIds: + - 'frontend' +--- + +In this project you are required to build a weather app that displays the current weather details based on the location entered by the user. We will be leveraging a common weather API to achieve this. + +You can use the 100% Visual Crossing Weather API - [here](https://www.visualcrossing.com/weather-api) + +## Requirements + +- The User should be able to enter a location into an input field +- The User will be presented with temperature, wind speed, likelihood of rain, and general weather i.e. Sunny, Raining, Cloudy etc. +- The User will be shown the previous and future 24 hour periods. +- The weather outlook can be refreshed by the user. + +## Stretch Goals + +- Animation libraries such as framer can used to make the loading of weather more visually appealing +- The default weather view is the Users current location. \ No newline at end of file