In this project I have used the API https://openweathermap.org/ for weather data. The current weather information is displayed for any city that we enter. Along with weather information, I'm fetching the air pollution data as well and displaying the quality of air from 1 to 5, Where 1 = Good, 2 = Fair, 3 = Moderate, 4 = Poor, 5 = Very Poor.
- I have used default Stockholm as a default city for the first load.
- I have used Axios to work with asynchronous data.
- I have used momentjs for a date, time, and timezone conversion
- Enter the city name to get the weather information.
- Weather icons are also changing as per the condition of the weather and as per the day or night.
- Temperature can be changed with the click of 'C' and 'F' to display in Celcius or Fahrenheit.
- App background is dynamic, as image will change as per the weather condition in the city.
- I will add loader functionality in future updates.
Main Page
- Javascript
- openweathermap API
- Axios
- Jquery
- Webpack
- ESLint
- Stylelint
Node
Setup
-
Clone this repository with: "git clone git@github.com:Amita-Roy/Weather-App.git" using your terminal or command line.
-
Change to the project directory by entering cd "weather-app" in the terminal
-
Next run npm install to install the necessary dependencies
-
Finally run the 'npm run build' and 'npm start' to start the application
-
'npm run dev' is for building the project in development mode
-
'npm run build' is for building the project in production mode
-
'npm start' is for starting the server in development mode
Start server with:
npm start
👤 Amita Roy
-
Stock images from unsplash
- Photo by Dawid Zawiła
- Photo by Luca Huter
- Photo by Gabriele Diwald
- Photo by Noah Silliman
- Photo by Adam Edgerton
- Photo by Tim Rüßmann
- Photo by Quinton Coetzee
- Photo by Dimitris Pallas
- Photo by Chandler Cruttenden
- Photo by Paul Gilmore
Contributions, issues and feature requests are welcome!
Feel free to check the issues page.
Give a ⭐️ if you like this project!