OpenWeatherMap API
First, we will make a React app that shows the current weather in London. This weather data will be fetched from OpenWeatherMap (https://openweathermap.org/). You need to register with OpenWeatherMap to get an API key. We will use a free account as that is sufficient for our needs. Once you have registered, navigate to your account information to find the API keys tab. There, you'll see the API key that you need for your React weather app:
Figure 8.1 – The OpenWeatherMap API key
Let's create a new React app with create-react-app:
- Open a terminal in Windows or Terminal in macOS/Linux, and type the following command:
npx create-react-app weatherapp
- Navigate to the
weatherAppfolder:cd weatherapp
- Start your app with the following command:
npm start
- Open your project folder with VS Code and open the
App.jsfile in the editor view. Remove all the code inside the<div className="App"></div>...