Skip to content

Dashboard that shows current weather, temperature, humidity, and wind speed.

License

Notifications You must be signed in to change notification settings

rbilag/weather-dashboard

Repository files navigation

Weather Dashboard

Dashboard that shows current weather, temperature, humidity, and wind speed.

Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. License
  5. Contact

About The Project

[Weather Dashboard Screenshot]

Dashboard that shows current weather, temperature, humidity, and wind speed of your current location. To see weather at other cities, append /?city=cityName to url(e.g. /?city=Paris). You can also query for multiple cities (/?city=Paris,Barcelona,Toronto). Dashboard will then cycle between each city for 5 seconds each.

Current location data was fetched using IP API while weather data was fetched from Open Weather Map API.

(back to top)

Technologies Used

(back to top)

Getting Started

To get a local copy up and running follow these simple steps.

Prerequisites

This is an example of how to list things you need to use the software and how to install them.

  • npm
    npm install npm@latest -g

Installation

  1. Get a free Open Weather Map API Key at https://openweathermap.org/api
  2. Clone the repo
    git clone https://github.com/crookedfingerworks/weather-dashboard.git
  3. Install NPM packages
    npm install
  4. Create .env file and add API key
    REACT_APP_WEATHER_API_KEY=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  5. Start the application
    npm start

(back to top)

Usage

Get Current Location's Weather

Simply open the application normally (without any additional url query parameters). The user's location is captured by default.

Get A Specific City's Weather

Append /?city=cityName to url(e.g. /?city=Paris). Please note that the parameter has to be a city name. If the name entered isn't found, the weather from the user's current location is displayed instead.

Get Multiple City's Weather

Append /?city=cityName,cityName,cityName,... to url(/?city=Paris,Barcelona,Toronto). Please note that the parameters have to be valid city names. If a specific city name isn't found, it won't be added to the weather cycle that will be displayed. If none of the inputted cities were found, the weather from the user's current location is displayed instead.

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

crooked.finger.works@gmail.com

Project Link: https://github.com/crookedfingerworks/weather-dashboard

(back to top)