A weather app done with React. Allows you to make a search for the current weather by simply typing "common knowledge" cities and save them to favourites on local storage.

Overview

Simpliest Weather React-App

Logo

A weather app done with React. Allows you to make a search for the current weather by simply typing "common knowledge" cities and save them to favourites on local storage.

Utilises OpenWeatherMap API for weather data and OpenWeatherMap Icons were replaced for Weather Icons pack from @erikflowers project.

For drawing UI Semantic UI React was also used in this project.

To run these project

You can run this project on your local machine. Just pull it down and do the following:

  1. Clone this repo:
git clone https://github.com/larry-noriega/simplest-weather-react-app.git
  1. Fill the config.js file with an auth API from Weather API oficial site. and... command line this mate:
  • cd weather-app-react
  • Install node packages npm install
  • Run it locally npm start
  1. Go live on http://localhost:3000

Features:

Running tests

There are couple of simple tests in App.test.js done with Jest + Enzyme. For testing command line again these pal:

  • npm run test

IMPORTANT: Bug Fixes

Disclaimer

Common issue:

Right clicking the file and opening in Chrome will not work 🙄 .

Logo

  • This project uses this template to bootstrap a react app.

    • Create React apps with no build configuration.

      • Creating an App – How to create a new app.
      • User Guide – How to develop apps bootstrapped with Create React App.

Learn More about React and its common issues

You can learn more in the Create React App documentation.

To learn React, check out the React documentation.

Code Splitting

This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting

Analyzing the Bundle Size

This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size

Making a Progressive Web App

This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app

Advanced Configuration

This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration

Deployment

This section has moved here: https://facebook.github.io/create-react-app/docs/deployment

npm run build fails to minify

This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify

You might also like...

IngredientRecipeFinder - Web app built with react using Edamam API to find any recipe for an ingredient search with nutrition filters (high protein, low carb,etc)

Ingredient Recipe Finder Web app This web app built with the use of Edamam API allows you to find any type of recipe for a specific ingredient you are

Jan 4, 2022

A simple Weather app Using NOdeJs and API'S

weather-app A simple Weather app Using NodeJs and API'S It uses GeoCode API to find Latitude and Longitude and passes it to the WeatherStack API to fe

Oct 5, 2022

A Google Clone which built with ReactJS. You can click the demo and search whatever you want!

Google Clone with ReactJS A small web app that imitate the desktop web version of google site, you can search whatever you want. Google Clone Demo Lin

Aug 14, 2022

Math Magicians! This is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make basic calculations and read a random math-related quote.

Math Magicians! This is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to make basic calculations and read a random math-related quote.

Math Magicians Math Magicians is the first React Project I'm building. The main objective of this is to understand React features with a project-based

Feb 26, 2022

A Single Page App (SPA) that allows users to: make simple calculations and read a random math-related quote

A Single Page App (SPA) that allows users to: make simple calculations and read a random math-related quote

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: make simple calculations and read a random math-related quote.

May 31, 2022

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations. Read a random math-related quote.

Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to:      Make simple calculations.     Read a random math-related quote.

Math Magicians Math magicians is a website for all fans of mathematics. It is a Single Page App (SPA) that allows users to: Make simple calculations.

Mar 23, 2022

Note Port is a frontend clone of Google Keep. It uses localstorage to save your notes!

Note Port is a frontend clone of Google Keep. It uses localstorage to save your notes!

Note Port About Note Port is a frontend clone of Google Keep. It uses localstorage to save your notes! Tech Stack React Screenshots Things I want to a

Sep 10, 2022

A bookstore app that allows a user add a book, displays added book with reviews and rating for each book and allows a user delete a book.

A bookstore app that allows a user add a book, displays added book with reviews and rating for each book and allows a user delete a book.

BOOKSTORE A bookstore app that allows a user add a book, displays added book with reviews and rating for each book and allows a user delete a book. Bu

Nov 1, 2022

Free React Native library to display local notifications.

Free React Native library to display local notifications.

React-Native NotiFREE âš› React Native library to display local notifications. A FREE alternative to React Native NotiFEE. Why? Nobody can remove the gr

Nov 10, 2022
React app that allows users to compare and analyze the cost of living between cities around the world.

✨ LivingApp is a react app that allows users to compare and analyze the cost of living between cities around the world. ✨ Features ?? Simple: Bootstra

Ivan Kuznietsov 3 Feb 5, 2022
A web application to search all the different countries in the world and get details about them which can include languages, currencies, population, domain e.t.c This application is built with CSS, React, Redux-Toolkit and React-Router.

A web application to search all the different countries in the world and get details about them which can include languages, currencies, population, domain e.t.c This application is built with CSS, React, Redux-Toolkit and React-Router. It also includes a theme switcher from light to dark mode.

Franklin Okolie 4 Jun 5, 2022
â›… Check the current weather in any city on the planet.

Weather App Check the current weather on any city on the planet. Switch between metric and imperial units. Features Search cities functionality Metric

Madza 86 Dec 22, 2022
To eleventy and beyond! The all-in-one tool for templates where you want them, component frameworks where you need them 🚀

Slinkity ?? This project is heavily under construction! ?? As excited as you may be, we don't recommend this early alpha for production use. Still, gi

Benjamin Holmes 398 Dec 27, 2022
A node script that lists the cities on Santa's route from santatracker.google.com

Google Santa Route A script that lists the cities on Santa's route from santatracker.google.com based on the JSON containing all Santa's destinations.

Emile Calixte 1 Dec 24, 2021
Internationalization for react done right. Using the i18next i18n ecosystem.

react-i18next IMPORTANT: Master Branch is the new v10 using hooks. $ v10.0.0 npm i react-i18next react-native: To use hooks within react-native, you m

i18next 7.9k Jan 9, 2023
Check EU Digitial Covid Certificates with ease and validate them against country and local rules.

Check EU Digitial Covid Certificates with ease and validate them against local or country rules. What is the purpose of CovidValidator? CovidValidator

Timo Koenig 10 Mar 14, 2022
🎉 toastify-react-native allows you to add notifications to your react-native app (ios, android) with ease. No more nonsense!

toastify-react-native ?? toastify-react-native allows you to add notifications to your react-native app (ios, android) with ease. No more nonsense! De

Zahid Ali 29 Oct 11, 2022
An eCommerce website that allows you to sign in and create an account and buy products and pay using PayPal and includes a dashboard that allows you to (add, update, and remove) a product...

An eCommerce website that allows you to sign in and create an account and buy products and pay using PayPal and includes a dashboard that allows you to (add, update, and remove) a product...

Mohamed Aachour 7 Oct 1, 2022
Hacker-news-with-react - 👾 Consuming the hacker news api, i created a more modern design for than the current site.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

João Thomaz 1 Jan 3, 2022