Tp2 asp - asp.net - dotnet - télécharger pdf

Ce document présente la deuxième série de travaux pratiques (TP2) du module ASP.NET, destinée aux étudiants de deuxième année de Génie Informatique de l'Université Sidi Mohamed Ben Abdellah. Son objectif est de renforcer les compétences en développement web ASP.NET MVC.

Il couvre les notions suivantes :

Affichage et gestion des données (ViewBag, ViewData, Models)
Authentification, sessions et gestion des cookies
Interaction avec les bases de données via Entity Framework (CRUD)
Développement de formulaires, validation et interfaces utilisateur dynamiques
Mises en page, vues partielles et internationalisation.

Télécharger PDF

Travaux Pratiques ASP.NET - TP2

Ces travaux pratiques pour le module ASP.NET s'adressent aux étudiants de 2ème année en Génie Informatique et couvrent divers aspects fondamentaux du développement web avec ASP.NET MVC, de la gestion des données aux contrôles d'accès.

Exercice 1 : Introduction aux Vues et Modèles

1. Écrire une page web affichant un message de bienvenue personnalisé (Bonjour + nom) en transmettant le nom depuis le contrôleur :

a. Via ViewBag
b. Via ViewData

2. Créer une classe User en tant que modèle (Model) :

a. Remplir cette classe avec un seul enregistrement dans le contrôleur et afficher ses données dans la vue.
b. Remplir la classe avec un ensemble d'enregistrements (liste d'utilisateurs) et les afficher dans un tableau HTML.

3. Écrire une page web affichant un message de bienvenue personnalisé (Bonjour + nom) en récupérant le nom directement depuis l'URL (paramètre de route).

Exercice 2 : Gestion des Cookies pour l'Identification

Cet exercice porte sur la mise en œuvre des cookies pour la gestion de session utilisateur.

Créez une page permettant l'identification d'un utilisateur (en utilisant le modèle User de l'exercice 1) par son nom et prénom :

Si l'identification est correcte, créer un cookie et rediriger l'utilisateur vers une page d'accueil personnalisée.
Observer le contenu du cookie créé dans le navigateur.
Lors des appels ultérieurs, tester la présence du cookie. S'il est présent et valide, rediriger l'utilisateur directement vers son accueil personnalisé.
Si l'utilisateur tente d'accéder directement à la page d'accueil personnalisée sans avoir de cookie d'identification valide, le rediriger vers la page d'identification.

Illustrez le fonctionnement entre la page d'identification et la page d'accueil.

Exercice 3 : Gestion des Sessions

Refaire l'exercice précédent (Exercice 2) en remplaçant l'utilisation des cookies par des variables de session pour la gestion de l'identification et de la personnalisation de l'accueil utilisateur. Cela permettra de comparer les deux approches.

Exercice 4 : Introduction à Entity Framework Code First

Étant donnée la classe User (avec les propriétés Id, Nom, Prénom) :

Générer la table correspondante dans une base de données SQL Server en utilisant l'approche Entity Framework Code First.
Générer automatiquement les opérations CRUD (Create, Read, Update, Delete) sur cette table à l'aide de l'outillage de Scaffolding d'ASP.NET MVC.

Exercice 5 : Entity Framework et HTML Helpers

On suppose l'existence d'une base de données contenant la table Etudiant (avec les colonnes CNE, Nom, Prénom, Age) :

Générer la classe C# correspondante à cette table en utilisant Entity Framework (approche Database First ou Code First si la table est déjà existante).
En utilisant les HTML Helpers d'ASP.NET MVC, créer un formulaire web permettant d'ajouter un nouvel étudiant dans la base de données.

Exercice 6 : Création et Validation de Formulaires

Créer un formulaire web complexe et implémenter la validation côté serveur et/ou côté client pour ses champs, selon les conditions suivantes :

Tous les champs doivent être remplis (obligatoires).
Le champ "Nom" doit avoir une longueur comprise entre 5 et 12 caractères.
Le champ "Email" doit être au format valide.
Une confirmation de mot de passe doit correspondre au mot de passe initial.
Le champ "Âge" doit être compris entre 16 et 40 ans.

Exercice 7 : DropDownList Dynamique et Redirection

Écrire un programme web qui réalise les actions suivantes :

Afficher, dans un contrôle DropDownList, la liste des noms des étudiants enregistrés dans la base de données.
Lors du clic sur le bouton "Submit", rediriger l'utilisateur vers une "Page2".
Ensuite, ajouter une logique pour une "Page1" (qui contiendrait probablement le DropDownList et le bouton) : si la sélection et d'autres conditions sont "OK", le clic sur le bouton "Envoyer" permet de passer à une page d'accueil personnalisée. (Note : les règles de validation de champs sont traitées dans l'exercice 6).

Exercice 8 : Affichage de Données en Grille MVC

Réaliser un programme web affichant la liste des étudiants, récupérée depuis la base de données via Entity Framework, dans un composant de type "Grid MVC" pour une présentation tabulaire structurée.

Exercice 9 : Visualisation de Données (Graphiques)

Réaliser une visualisation graphique (par exemple, un diagramme à barres ou circulaire) qui représente le nombre d'étudiants par filière d'études, en utilisant des données provenant de la base de données.

Exercice 10 : Gestion des Droits et Authentification

Créer une application web pour gérer la liste des étudiants enregistrés dans la base de données, en implémentant les spécifications de sécurité suivantes :

**Contrôle d'accès :** Le lien menant à la section de gestion des étudiants ("Étudiants") doit nécessiter une authentification préalable de l'utilisateur.
**Visibilité conditionnelle :** Le lien de gestion des étudiants ne doit apparaître dans la navigation qu'après que l'utilisateur s'est authentifié avec succès.
**Autorisation basée sur les rôles :** L'action de suppression (Delete) des étudiants ne doit être accessible qu'aux utilisateurs ayant le rôle "Admin".
**Visibilité conditionnelle des actions :** Le lien ou le bouton "Supprimer" (Delete) ne doit être affiché dans l'interface utilisateur que pour les administrateurs.

Exercice 11 : Formulaire d'Ajout et Navigation

Créer un formulaire web simple contenant deux boutons :

Le premier bouton permet d'ajouter un étudiant dans la base de données.
Le deuxième bouton assure un retour à la page d'accueil de l'application.

Exercice 12 : DropDownList en Cascade avec jQuery (AJAX)

Écrire un programme qui met en œuvre deux DropDownList en cascade, où la sélection dans le premier contrôle met à jour le contenu du second sans rafraîchissement complet de la page, grâce à l'utilisation de jQuery (techniques AJAX) :

**DropDownList1 :** Une liste de 3 pays (par exemple).
**DropDownList2 :** Une liste des villes (par exemple, 5 villes) appartenant au pays sélectionné dans le premier DropDownList.

Exercice 13 : Internationalisation (I18N) et Validation Multilingue

Créer un formulaire permettant d'ajouter les détails d'un objet de votre choix (par exemple, une Voiture, un Livre, un Produit, un Film...). Ce formulaire doit s'afficher dans la langue sélectionnée par l'utilisateur.

De plus, implémenter la validation des champs en veillant à ce que les messages d'erreur soient également affichés dans la langue correspondante (internationalisation de la validation).

Exercice 14 : Pages de Mise en Page (Layouts) et Partials

Cet exercice explore l'utilisation des pages de mise en page (Layouts) et des vues partielles (Partial Views) dans ASP.NET MVC.

**Création d'un Layout :** Créer une page de mise en page (_Layout.cshtml) et définir sa structure. Ensuite, créer plusieurs pages de contenu qui utilisent ce layout pour assurer une cohérence visuelle.
**Sections rendables (RenderSection) :** Intégrer dans le layout une ou plusieurs sections qui pourront être définies ou modifiées de manière dynamique par les vues de contenu.
**Vues partielles :** Créer une vue partielle (Partial View) contenant un petit formulaire ou un élément réutilisable, puis l'appeler et l'intégrer dans différentes autres vues.

Foire Aux Questions (FAQ)

Qu'est-ce qu'ASP.NET MVC ?

ASP.NET MVC est un framework de développement web de Microsoft qui implémente le modèle d'architecture Model-View-Controller (MVC). Il permet de séparer la logique de l'application en trois composants interconnectés : le Modèle (données et logique métier), la Vue (interface utilisateur) et le Contrôleur (gestion des interactions utilisateur et coordination). Cette séparation favorise une meilleure organisation du code, une plus grande testabilité et une facilité de maintenance.

Quelle est la différence entre ViewBag, ViewData et les modèles fortement typés dans ASP.NET MVC ?

ViewBag et ViewData sont des mécanismes permettant de passer des données du contrôleur à la vue. ViewData est un dictionnaire de type ViewDataDictionary, tandis que ViewBag est un wrapper dynamique autour de ViewData. Les deux ont des limitations de vérification de type à la compilation. En revanche, l'utilisation de modèles fortement typés (passer un objet Model directement à la vue) est la méthode recommandée car elle offre une vérification de type à la compilation, une meilleure IntelliSense et une plus grande clarté du code, réduisant ainsi les erreurs potentielles.

Pourquoi utiliser Entity Framework ?

Entity Framework (EF) est un O/RM (Object-Relational Mapper) pour .NET. Il permet aux développeurs de travailler avec des données de base de données en utilisant des objets C# ou VB.NET, sans avoir à écrire la plupart des codes d'accès aux données habituels. EF simplifie le développement en gérant la persistance des objets et la traduction entre les objets du domaine et les enregistrements de la base de données, ce qui rend le code plus propre, plus maintenable et réduit le temps de développement.