https://github.com/gigacore/react-weather-forecast
A simple 5-day weather forecast application using React & Redux
https://github.com/gigacore/react-weather-forecast
es6 forecast reactjs redux weather webpack
Last synced: 8 months ago
JSON representation
A simple 5-day weather forecast application using React & Redux
- Host: GitHub
- URL: https://github.com/gigacore/react-weather-forecast
- Owner: Gigacore
- License: mit
- Created: 2018-02-08T04:50:13.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2022-02-24T15:46:23.000Z (over 4 years ago)
- Last Synced: 2024-01-29T03:41:54.527Z (over 2 years ago)
- Topics: es6, forecast, reactjs, redux, weather, webpack
- Language: JavaScript
- Homepage: https://gigacore.in/demos/react-weather-forecast/
- Size: 312 KB
- Stars: 41
- Watchers: 6
- Forks: 25
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README

# 5-Day Weather Forecast
A simple application to display 5-day weather forecast using the OpenWeatherMap API. Built on top of my recently created [React-Redux-Sass Starter Kit](https://github.com/Gigacore/React-Redux-Sass-Starter).
### Demo
https://www.gigacore.in/demos/react-weather-forecast/
## Pre-requisites
* Node.js 9.8.0 and above
## Run
```
git clone
cd react-weather-forecast
npm i
```
## Start the dev server
```
npm run start:dev
```
## Build
```
npm run build
```
#### Notes:
* Running the build bundles all your updates to ```bundle.js``` and ```bundle.css``` in dist folder.
* If you insist to automate the build upon appending changes to files, use ```webpack --watch```
## Test
```
npm run test
```
#### Notes:
* Unit testing can be done manually by executing the above command.
* It will be done automatically prior committing the updates to the repo as a pre-commit hook.
### TODOs
- [x] Provide an option for user to choose location of their choice by Name, Lat/Long etc
- [x] Unit testing
- [x] Identify and address edgecases.
- [x] Revisit the code to improve performance. Such as sorting, looping, searching etc.
- [x] Use a proper loading spinner icon on page load
- [x] Detect location automatically
- [x] Display hourly forecasts.
- [ ] Add an option to choose Units in either Metric or Imperial.
- [ ] Display higher-level of weather information such as Wind Speed, Precipitation etc
- [ ] Fix lint issues and config the eslintrc to support "no-vars-used" for Imports
- [ ] Better and more functional UI
- [ ] Prevent fetching new data on every refresh by caching the data for a set duration of session.
### Tech Stack
* React.js
* Redux
* JavaScript (ES6)
* HTML5
* SASS
* Jest + Enzyme
#### The MIT License (MIT)
MIT © 2018 Santhosh Sundar