Labo 12
Interface graphique – Partie VI – Initiation à l’utilisation d’API REST en C#
📘 Séance 12 : Initiation à l'utilisation d'API REST en C# (WPF & MVVM)
📖 Description
Cette série d'exercices pratiques vise à maîtriser les appels HTTP, la gestion du JSON et l'intégration d'API REST dans une application WPF structurée selon le pattern MVVM. Chaque exercice introduit progressivement des concepts clés : requêtes GET, POST, DELETE, gestion des paramètres, clés d'authentification, et mise à jour dynamique de l'interface.
🛠️ Technologies & Concepts Clés
- Framework : WPF (Windows Presentation Foundation)
- Architecture : MVVM (Model-View-ViewModel)
- Réseau :
HttpClientpour les requêtes HTTP asynchrones - Données : Sérialisation/Désérialisation JSON (
Newtonsoft.JsonouSystem.Text.Json) - Binding :
ObservableCollection<T>,ICommand, DataBinding
Solution - GitHub
📝 Exercices
🔹 Exercice 01 : Faits intéressants sur les chats
Objectif : Comprendre les appels GET et afficher une donnée dans une interface WPF avec MVVM.
Consignes :
- Créer un projet WPF MVVM.
- Concevoir l'interface avec :
- Un bouton « Nouveau fait ».
- Une
TextBlockpour afficher le fait récupéré.
- Utiliser l'API :
https://catfact.ninja/fact - Créer un service dédié pour consommer l'API via
HttpClient. - Lier les données à l'interface via un ViewModel.
🔹 Exercice 02 : Recherche de livres
Objectif : Mettre en œuvre une recherche avec paramètres, traitement JSON et affichage en liste. Consignes :
- Interface WPF avec :
- Une
TextBoxpour la saisie du mot-clé. - Un bouton « Rechercher ».
- Une
ListViewpour afficher les résultats (titre, auteur, description).
- Une
- Utiliser l'API :
https://openlibrary.org/ - Implémenter un service réseau avec
HttpClient. - Afficher les résultats via DataBinding (pattern MVVM).
🔹 Exercice 03 : Explorer les pays
Objectif : Gérer des collections complexes, implémenter du tri et de la recherche dynamique. Consignes :
- Interface WPF avec :
- Une
TextBoxde recherche. - Une
ComboBoxpour trier par nom ou population. - Une
ListViewaffichant : nom, capitale, population.
- Une
- Appel API :
https://restcountries.com/v3.1/all - Désérialiser le JSON dans une
ObservableCollection<T>. - Intégration complète MVVM + filtrage/tri dynamique via le ViewModel.
🔹 Exercice 04 : Météo d’une ville
Objectif : Appeler une API avec clé d'authentification, transmettre des paramètres et afficher un résultat formaté. Consignes :
- Interface WPF avec :
- Une
TextBoxpour saisir une ville. - Un bouton « Obtenir la météo ».
- Un
StackPanelaffichant température, description météo et icône.
- Une
- Appel API :
https://api.openweathermap.org/(nécessite une clé API gratuite) - Utiliser
HttpClient, inclure la clé API dans les paramètres, et parcourir la réponse JSON. - Utiliser le DataBinding et les
ICommandpour actualiser l’interface de manière réactive.
🔹 Exercice 05 : Ajouter une tâche (POST)
Objectif : Comprendre la sérialisation JSON et les requêtes POST avec interface utilisateur.
Consignes :
- Interface WPF avec :
- Des
TextBoxpour le titre,userIdet statut. - Un bouton « Ajouter ».
- Une
TextBlockpour afficher l’ID retourné par l'API.
- Des
- Utiliser l'API :
https://jsonplaceholder.typicode.com/todos - Sérialiser le modèle en JSON avec
Newtonsoft.Json. - Envoyer les données via
HttpClient.PostAsync. - Gérer la réponse et les erreurs dans le ViewModel.
🔹 Exercice 06 : Supprimer une tâche (DELETE)
Objectif : Envoyer des requêtes DELETE et synchroniser l'interface avec les données.
Consignes :
- Interface WPF avec :
- Une
ListViewaffichant des tâches (simulées ou récupérées via JSONPlaceholder). - Un bouton « Supprimer » associé à chaque tâche.
- Une
- Utiliser l'API :
https://jsonplaceholder.typicode.com/todos/{id} - Déclencher
HttpClient.DeleteAsyncau clic sur supprimer. - Retirer l'élément de la
ObservableCollection<T>pour mise à jour automatique de l'UI. - Afficher un message de confirmation (succès/erreur).
🔗 Ressources Utiles
- 🌐 Répertoire d'APIs publiques gratuites : public-apis/public-apis