An open API service indexing awesome lists of open source software.

https://github.com/bocaletto-luca/country-explorer

Country Explorer is an interactive web application that empowers you to discover countries from around the world using free public APIs. With advanced filtering options by continent, the app displays each nation's name, flag, detailed information—including population statistics—and offers interactive charts to visualize population data. Whether ...
https://github.com/bocaletto-luca/country-explorer

api application bocaletto-luca countries countries-api country css3 database free-api html5 javascript opensource responsive webapp

Last synced: about 1 month ago
JSON representation

Country Explorer is an interactive web application that empowers you to discover countries from around the world using free public APIs. With advanced filtering options by continent, the app displays each nation's name, flag, detailed information—including population statistics—and offers interactive charts to visualize population data. Whether ...

Awesome Lists containing this project

README

          

# Country Explorer | API Free | Database | WEBAPP
#### Author: Bocaletto Luca

[![HTML5](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white)](https://developer.mozilla.org/en-US/docs/Web/HTML) [![CSS3](https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white)](https://developer.mozilla.org/en-US/docs/Web/CSS) [![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)](https://developer.mozilla.org/en-US/docs/Web/JavaScript) [![Bootstrap](https://img.shields.io/badge/Bootstrap-7952B3?style=for-the-badge&logo=bootstrap&logoColor=white)](https://getbootstrap.com/) [![Chart.js](https://img.shields.io/badge/Chart.js-FF6384?style=for-the-badge)](https://www.chartjs.org/)

Country Explorer is an interactive web application that empowers you to discover countries from around the world using free public APIs. With advanced filtering options by continent, the app displays each nation's name, flag, detailed information—including population statistics—and offers interactive charts to visualize population data. Whether you're a geography enthusiast or a data lover, Country Explorer provides a comprehensive view of global demographics in a sleek, responsive interface.

## Features

- **Responsive Design:** Enjoy a seamless experience across desktops, tablets, and mobile devices.
- **Free API Integration:** Fetch real-time country data using public APIs (e.g., the REST Countries API).
- **Continent Filtering:** Sort and filter countries by continent for targeted exploration.
- **Country Details:** View essential information such as the country's name, flag, capital, region, population, and more.
- **Interactive Population Charts:** Visualize population data with dynamic charts powered by Chart.js.
- **User-Friendly Interface:** An intuitive layout makes it easy to navigate and explore global nations.

## Technologies Used

- **HTML5**
- **CSS3**
- **JavaScript**
- **Bootstrap 5**
- **Chart.js**

## Getting Started

### Prerequisites

Country Explorer runs in modern web browsers and does not require additional dependencies. For development purposes, it is recommended to use a code editor with live reload functionality (such as Visual Studio Code with the Live Server extension).

### Installation

1. **Clone the Repository**
git clone https://github.com/bocaletto-luca/country-explorer.git cd country-explorer

2. **Launch the Application**

- Open the `index.html` file in your preferred web browser.
- Alternatively, use a live reload server via your code editor to preview changes in real time.

## How It Works

- **Data Fetching:** The application uses JavaScript's Fetch API to retrieve country data from free public APIs (like the REST Countries API). The JSON response is parsed to create dynamic and informative country cards.
- **Filtering by Continent:** Users can sort and filter countries by selecting a specific continent, which updates the displayed results accordingly.
- **Country Details Display:** Each country card shows key details including the country's name, flag, capital city, region, and population.
- **Interactive Population Charts:** Leveraging Chart.js, the app renders interactive charts that visually represent population data, helping users gain insights into demographic trends.
- **Responsive UI:** With Bootstrap 5 and custom CSS, Country Explorer adapts seamlessly to any device, ensuring a smooth and engaging experience.

## Contributing

Contributions are welcome! If you'd like to suggest improvements or add new features, please follow these steps:

1. Fork the repository.
2. Create a new branch for your feature or fix:
3. Open a Pull Request against the main branch of the original repository.

## License

This project is licensed under the **GNU General Public License v3.0 (GPLv3)**. See the [LICENSE](LICENSE) file for additional details.

## Contact

For questions, suggestions, or feedback, please open an issue in this repository or contact the maintainer via GitHub.

#### Enjoy WEBAPP - By Bocaletto Luca