Weather Web - Forecast for your location

Weather Web is a single page built using Vue. The page displays forecast of the day for your location, the current weather and a chart that shows data of the weather for the next 7 days. A component shows a selection of movies about weather and a quote about climate.

Concept

This project was created as a demo to practice Vue 3 fundamentals

Features

• Today weather forecast for your current location (12 weather data points).
• Weekly weather data for your current location (Temperature and wind data graph for 7 days).
• Weather movies, a selection of disaster movies about weather events (10 movies).
• Weather quotes, a quote about weather will be shown every day (10 quotes).

Dependencies

• Vue
• Bootstrap
• Bootstrap Icons
• Vue Chart js
• Google Fonts Lato

API

• Open Meteo - Open Meteo API is free with rate limits, no api key required.

Concepts applied in the project

• Option API
• Component Events
• Async / await
• Fetch data from api
• Basic Chart use
• Basic geolocation use

Customize configuration

See Vite Configuration Reference.

Project Setup

• Download or clone files in your local environment.

npm install

Compile and Hot-Reload for Development

npm run dev

Compile and Minify for Production

npm run build