Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hajnaloltyan/weather-data
The App has the functionality to fetch location results based on the typed in search word, and after location selection to provide statistical information of the weather from the previous 30 days. The App comes with 14 preselected popular locations to choose from.
https://github.com/hajnaloltyan/weather-data
css3 react react-router redux redux-toolkit weather-app
Last synced: 24 days ago
JSON representation
The App has the functionality to fetch location results based on the typed in search word, and after location selection to provide statistical information of the weather from the previous 30 days. The App comes with 14 preselected popular locations to choose from.
- Host: GitHub
- URL: https://github.com/hajnaloltyan/weather-data
- Owner: hajnaloltyan
- License: mit
- Created: 2023-08-06T20:35:47.000Z (over 1 year ago)
- Default Branch: develop
- Last Pushed: 2023-09-06T23:19:17.000Z (over 1 year ago)
- Last Synced: 2023-09-07T01:13:14.063Z (over 1 year ago)
- Topics: css3, react, react-router, redux, redux-toolkit, weather-app
- Language: JavaScript
- Homepage: https://hajnaloltyan.github.io/weather-data/
- Size: 972 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 📗 Table of Contents
- [📗 Table of Contents](#-table-of-contents)
- [📖 Weather Data ](#-weather-data-)
- [🛠 Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [Key Features ](#key-features-)
- [🚀 Live Demo ](#-live-demo-)
- [💻 Getting Started ](#-getting-started-)
- [Prerequisites](#prerequisites)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [Deployment](#deployment)
- [👥 Authors ](#-authors-)
- [🔭 Future Features ](#-future-features-)
- [🤝 Contributing ](#-contributing-)
- [⭐️ Show your support ](#️-show-your-support-)
- [🙏 Acknowledgments ](#-acknowledgments-)
- [📝 License ](#-license-)
This is my Microverse React/Redux Capstone **Weather Data** site, created with React + Vite, React Router, Redux and CSS.
The App has the functionality to fetch location results based on the typed in search word, and after location selection to provide statistical information of the weather from the previous 14 days.
The App comes with 14 preselected popular locations to choose from.
It uses 2 different APIs, for the location results it uses: [Geocoding API](https://openweathermap.org/api/geocoding-api)
And for the historical data: [Visual Crossing Weather API](https://www.visualcrossing.com/resources/documentation/weather-api/timeline-weather-api/)
Both sites require registration to acquire the API key.
React + Vite
React Router
Redux
Redux Toolkit
CSS
GitFlow
- **React + Vite**
- **React Router**
- **Redux Toolkit**
- **GitFlow**
- [Live Demo Link](https://hajnaloltyan.github.io/weather-data)
- [Video](https://www.loom.com/share/ffb7e160240c4a7db9e4b7aeb6796bf9?sid=1f27d319-b9df-4540-9d15-0f275e3b6558)
To get a local copy up and running, follow these steps.
### Prerequisites
In order to run this project you need:
- Code editor
- Node
- To register for both API providers to get the personal API Key
- Store the keys in the root folder of the project inside the .env files using this exact format:
```sh
VITE_API_KEY_GEO='Your [Geocoding API](https://openweathermap.org/api/geocoding-api) API'
VITE_API_KEY_WEATHER='Your [Visual Crossing Weather API](https://www.visualcrossing.com/resources/documentation/weather-api/timeline-weather-api/) API'
```
### Setup
Clone this repository to your desired folder by opening the terminal and running the following command:
```sh
git clone [email protected]:hajnaloltyan/weather-data.git
```
### Install
Install this project with:
```sh
npm install
```
### Usage
To run the project use the following command:
```sh
npm run dev
```
### Run tests
To run tests, run the following commands:
For CSS linter errors:
```sh
npx stylelint "**/*.{css,scss}"
```
For ESLint linter errors:
```sh
npx eslint "**/*.{js,jsx}"
```
### Deployment
Deployed by GitHub Pages with command:
```sh
npx run deploy
```
👤 **Hajnalka Oltyan**
- GitHub: [@hajnaloltyan](https://github.com/hajnaloltyan)
- LinkedIn: [Hajnal Oltyan](https://www.linkedin.com/in/hajnalka-oltyan/)
- To offer options for setting the dates
- Add more charts and data
Contributions, issues, and feature requests are welcome!
If you like this project please leave a star and a comment.
Original design idea by [Nelson Sakwa on Behance](https://www.behance.net/sakwadesignstudio).
I would like to thank Microverse to have this opportunity.
This project is [MIT](./LICENSE) licensed.