Countries Details is a React web application that displays information on nearly 250 countries using data fetched from an external API. The app features a two-page structure: a homepage showcasing a list of country cards and a detailed page for viewing additional information about each country. The app is fully responsive, ensuring optimal viewing across devices.
Website Link : https://countries-detailss.netlify.app/
- Home Page: Displays cards for almost 250 countries, each card showing essential information like the country’s name, flag, region, and population.
- Country Details Page: Provides a detailed view of each country, including data such as capital, languages, currency, and borders.
- Fetch API Integration: Data is retrieved in real-time from an external server using the Fetch API.
- Responsive Design: Optimized for desktop, tablet, and mobile views.
- Day/Night Theme : Implemented dark night Theme for the website.
- React: For building the UI components.
- Fetch API: For fetching real-time data from an API endpoint.
- React Router: For navigation between the home page and the details page.
- CSS: For styling and responsive design.
- Home Page: Browse through the list of countries, each displayed in a card format. Click on a country card to view more details.
- Country Detail Page: View comprehensive details about the selected country, including its languages, currency, neighboring countries, and more.
The app fetches data from an external countries API. The API provides a wealth of data, which is filtered and presented on the app’s interface.

