REST Countries

Introduction

A simple website which shows the information about a specific country in the form of cards. The information includes the Name of the country, the capital of the country, the continent in which it is located, the population and its area.
Technologies Used : React JS, Node JS, Chakra UI, React Icons and Axios.
API Used : REST Countries API.

Fetching the data

Copy./src/CountryData.js: copy code to clipboard
1const CountryData = () => {
2  const [countryName, setCountryName] = useState('');
3  const [countryData, setCountryData] = useState([]);
4
5  async function getData() {
6    try {
7      const response = await axios.get(
8        `https://restcountries.com/v3.1/name/${countryName}`
9      );
10      setCountryData((countryData) => [response.data, ...countryData]);
11      console.log(countryData);
12    } catch (error) {
13      console.error(error);
14    }
15  }

Here data is being fetched from REST Api with the help of Axios using the get method. countryName is the name of the variable in which the input (name of the country) given by the user is stored. countryData is the array in which all the data is stored.

To visit the site click here
To checkout the full source code click here