README

Description

These are the local files I created while following the Web Dev Simplified tutorial How To Build A Weather App In JavaScript Without Needing A Server.

• Project repository

I didn't clone or fork the project repo because I wanted to create everything from scratch. This was a good experience and I learned how to create a non-trivial JavaScript app without a framework.

Technologies used

• HTML/CSS/JavaScript
• Vite
• Axios
• Open Meteo's Free Weather API

To install and run from repo

npm install
npm run dev

Notes about tutorial

Install create-vite, run initializer, and create package.json: npm create vite@latest

• Project name: . (current directory)
• Framework: Vanilla
• Variant: JavaScript

Add axios to project: npm install axios

API URL with selected parameters: api.open-meteo.com

Remove the latitude, longitude, and timeZone parameters before passing that URL to axios.get() in ./src/weather.js

Some of Open Meteo's API parameters have changed since Kyle created the project. His code still works as-is so it must still support the older parameters.

• current_weather is now current
  • temperature is now temperature_2m
  • windspeed is now wind_speed_10m
• weathercode is now an array in daily called weather_code
• apparent_temperature_2m_max is now apparent_temperature_max
• apparent_temperature_2m_min is now apparent_temperature_min

I made some minor changes to use CSS variables for the colors.

Screenshot