A demo project built while learning React and Redux.
Key Features • Technical notes • Credits • License
- Auto-suggest location while typing
- Weather forecast for current position
- Forecast not fetched on every load, persisted to local storage for an hour
- See 5-day forecast for 5 most recently visited locations on the homepage
- Add (and remove) location to favorites for a quick access from the homepage
- Switch units between metric and imperial
- Visualize weather data using graphs and map
- Bootstrapped using create-react-app
- React 16.4 SPA
- Routing done using React Router
- State management done using Redux (following duck / module system), Redux Thunk for middleware, React Redux to connect React with Redux, Reselect to select specific parts of the state
- Redux persist used to persist data to Local Storage (visited locations, favorite locations, units preference, etc.)
- Location searching and geocoding is done using Google Places API; React Geosuggest library is used for auto-suggestions
- Data visualization is accomplished using vx, React wrapper for d3
- Forecast data and map embed are from Dark Sky
- All icons are
svg
(sprites) - ESLint is used as a source code styling guide
- Site deployed on Netlify
This software uses / was inspired by:
- yr.no - some design features
- Dark Sky - forecast data, map, and some design features
- Adam Whitcroft's Climacons - weather icons
- Flaticon, Freepik - other icons
- Jack Rugile's amazing rainbow loader
MIT