https://github.com/frnt-end/weather-app-react

:atom_symbol: React project - Fetch and Toggle display of current weather in Berlin, Paris, New York & London (tabs) - using axios for API fetch. Watch DEMO 🌞 https://Frnt-End.github.io/Weather-App-React 👈
https://github.com/frnt-end/weather-app-react

api axios axios-react background card current-weather data fetch gh-pages react reactjs tabs toggle ui usestate usestate-hook weather weather-app weather-information weatherapp

Last synced: 2 months ago
JSON representation

:atom_symbol: React project - Fetch and Toggle display of current weather in Berlin, Paris, New York & London (tabs) - using axios for API fetch. Watch DEMO 🌞 https://Frnt-End.github.io/Weather-App-React 👈

• Host: GitHub
• URL: https://github.com/frnt-end/weather-app-react
• Owner: Frnt-End
• Created: 2021-06-14T21:50:01.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2025-03-27T14:02:46.000Z (6 months ago)
• Last Synced: 2025-06-11T13:59:08.060Z (4 months ago)
• Topics: api, axios, axios-react, background, card, current-weather, data, fetch, gh-pages, react, reactjs, tabs, toggle, ui, usestate, usestate-hook, weather, weather-app, weather-information, weatherapp
• Language: JavaScript
• Homepage: https://Frnt-End.github.io/Weather-App-React
• Size: 5.23 MB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Current Weather App

![Weather Indicator](src/img/preview.jpg "Weather Indicator")

Toggle between **Berlin, Paris, New York & London** tabs to display updated current weather and background.

👉 [Watch DEMO](https://Frnt-End.github.io/Weather-App-React)

## 📁 Project Structure

- **index.js** is the main component.

- **style.css** is the main style file.

- Dedicated **img** folder.

## ✏️ Notes

- Using **axios** to handle the requested data.

- Using the **state** hook.

- Setting **Berlin** as a default value to be displayed.

## 🌈 Local View

To view in localhost: in the terminal, navigate to the main folder and type:

##### `npm start` or `yarn start`

👉 [Watch DEMO](https://Frnt-End.github.io/Weather-App-React)

---

Enjoy the code exploring 😉

---

### License

Copyright © 2019 @frnt-end

[Portfolio](https://frnt-end.github.io/portfolio/)

[![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0)