Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/rkbeatss/weather-app


https://github.com/rkbeatss/weather-app

geocoding-api nasa-apod openweathermap-api react-components reactjs

Last synced: 1 day ago
JSON representation

Awesome Lists containing this project

README

        

# ReactJS Weather App

## Description

This is a simple ReactJS project that invokes the OpenWeatherMap API in order to get a 7-day forecast. It also leverages Google's Geocode module to transform a location into coordinates. The background image is set through the Nasa Photo of the Day API.

## The main goals of this project are:
1. Understand and create React Components
2. Understand the communication between parent and child components through props
3. Make use of HTTP calls and implement an API service
4. Understand and use state object

## OpenWeatherMap API

In order to use this service, you must obtain an API key from [their website](https://openweathermap.org/price) and include it in a config file.

## Geocoding API

In order to use this service, you must obtain an API key from [their website](https://developers.google.com/maps/documentation/geocoding/start) and include it in a config file.

## Nasa Photo of the day API

In order to use this service, you must obtain an API key from [their website](https://api.nasa.gov/index.html#apply-for-an-api-key) and include it in a config file.

## Run project

Make sure to clone the project and install all npm packages

```
npm install
```

To start the app:

```
npm start
```

![A screenshot of the app UI](public/app-UI.png)