https://github.com/valentinmadiot/country-filter_api
Application React permettant de filtrer les pays du monde par continent et population, avec un design responsive en dark mode et des données en temps réel via l'API REST Countries.
https://github.com/valentinmadiot/country-filter_api
api axios create-react-app dark-mode frontend html js react responsive responsive-design rest-api rest-countries-api scss vercel
Last synced: 9 months ago
JSON representation
Application React permettant de filtrer les pays du monde par continent et population, avec un design responsive en dark mode et des données en temps réel via l'API REST Countries.
- Host: GitHub
- URL: https://github.com/valentinmadiot/country-filter_api
- Owner: ValentinMadiot
- Created: 2025-06-02T09:50:11.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-07-02T12:18:05.000Z (12 months ago)
- Last Synced: 2025-07-02T13:29:59.422Z (12 months ago)
- Topics: api, axios, create-react-app, dark-mode, frontend, html, js, react, responsive, responsive-design, rest-api, rest-countries-api, scss, vercel
- Language: SCSS
- Homepage: https://country-filter-api.vercel.app/
- Size: 1.64 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
##
📌 Sommaire
🎨 [**Introduction**](#introduction)
🛠️ [**Technologies**](#technologies)
🎯 [**Fonctionnalités**](#fonctionnalités)
🚀 [**Installation**](#installation)
**Country Filter App** est une application React interactive qui permet de découvrir et filtrer les pays du monde en fonction de leur **continent** et de leur **population**.
Les données proviennent en temps réel de l’API publique **REST Countries v3.1**.
Elle propose une interface clair, fluide et responsive, avec un **design sobre en dark mode**.
- React (Create React App)
- React Router
- SCSS pour le style
- Axios pour les requêtes HTTP
- API [REST Countries v3.1](https://restcountries.com/v3.1/all)
- Déploiement sur [Vercel](https://country-filter-api.vercel.app/)
- Filtrer les pays par continent : Africa, America, Asia, Europe, Oceania
- Curseur de population minimale pour afficher les pays les plus peuplés
- Affichage du drapeau, de la capitale et de la population
- Animation au survol des cartes
- Interface responsive et en mode sombre
### ✅ Prérequis
- [Git](https://git-scm.com/) — Système de gestion de versions
- [Node.js](https://nodejs.org/fr) — Exécuteur local de scripts JavaScript
- [npm](https://www.npmjs.com/) — Gestionnaire de paquets JavaScript
- [Google Chrome](https://www.google.com/) — Navigateur moderne
- [Visual Studio Code](https://code.visualstudio.com/) — Éditeur de code
### 📥 Cloner le projet
```bash
git clone https://github.com/ValentinMadiot/country-filter_api.git
cd country-filter_api
```
### ▶️ Lancer le projet
#### Frontend
```bash
npm install
npm start
```
Frontend disponible sur : `http://localhost:3000`