Due to the server running on a free tier of Heroku, please allow roughly 60 seconds for the website to display properly. After about a minute, refresh the page and the navbar should be displayed at the top of the page.
View Demo
·
Report Bug
·
Request Feature
A simple weather application using the MERN stack and OpenWeatherMap API. Makes use of React Context, Fetch, Axios, and JWT to create a functional user registration and log in system that will immediately display the weather for your city upon logging in.
Learning my way around React and React Hooks was the most challenging part of this project. The file structure is a bit messy since I kept implementing new concepts I've learned. I couldn't decide between using a custom React hook for fetch or to use Axios, so I used both for different reasons, though in the future Axios seems to be the way to go for the time being.
Another issue was having the user's city show up after logging in, through I solved this with React Context and a simple page refresh. Although simple, countless hours were spent trying to understand what React has to offer.
To get a local copy up and running follow these simple steps.
-
Get a free API Key at Current Weather Data
-
Clone the repo
git clone https://github.com/PhilipBDev/MERN-Weather-App-CLIENT.git
-
Install NPM packages
npm install
-
Create an ENV file with the following attributes using your own Open Weather API key:
REACT_APP_WEATHER_URL='http://api.openweathermap.org/data/2.5' REACT_APP_WEATHER_API= NODE_ENV='development'
See the open issues for a list of proposed features (and known issues).
Distributed under the MIT License. See LICENSE for more information.
Your Name - @PhilipBDev - PhilipBDev@gmail.com
Project Link: https://github.com/PhilipBDev/MERN-Weather-App-CLIENT