Scribd Logo
Importer

Bienvenue sur Scribd !

  • 47 vues

    TP 1 - Daaw

    Transféré par

    houcinefarming2002
    Ce TP vise à créer les pages web d'une application e-learning avec trois types d'utilisateurs (administrateur, enseignant et étudiant) en utilisant HTML, CSS et JavaScript. Il s'agit de créer les pages d'accueil et de gestion pour chaque type d'utilisateur avec des fonctionnalités comme l'affichage et la modification des listes d'utilisateurs et des modules.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd

    TP 1 - Daaw

    Transféré par

    houcinefarming2002
    47 vues3 pages
    Ce TP vise à créer les pages web d'une application e-learning avec trois types d'utilisateurs (administrateur, enseignant et étudiant) en utilisant HTML, CSS et JavaScript. Il s'agit de créer les pages d'accueil et de gestion pour chaque type d'utilisateur avec des fonctionnalités comme l'affichage et la modification des listes d'utilisateurs et des modules.

    Titre original

    TP 1 - DAAW

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Ce TP vise à créer les pages web d'une application e-learning avec trois types d'utilisateurs (administrateur, enseignant et étudiant) en utilisant HTML, CSS et JavaScript. Il s'agit de créer les pages d'accueil et de gestion pour chaque type d'utilisateur avec des fonctionnalités comme l'affichage et la modification des listes d'utilisateurs et des modules.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Télécharger au format pdf ou txt
    47 vues3 pages

    TP 1 - Daaw

    Transféré par

    houcinefarming2002
    Ce TP vise à créer les pages web d'une application e-learning avec trois types d'utilisateurs (administrateur, enseignant et étudiant) en utilisant HTML, CSS et JavaScript. Il s'agit de créer les pages d'accueil et de gestion pour chaque type d'utilisateur avec des fonctionnalités comme l'affichage et la modification des listes d'utilisateurs et des modules.

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Télécharger au format pdf ou txt
    sur 3

    Université́ Constantine 2-Abdelhamid Mehri Année 2022/2023

    Faculté́ des NTIC


    Département TLSI
    UE : Développement Avancé d’Applications Web

    TP 1 : HTML , CSS et JavaScript

    Objectif :

    Ce TP vise à rappeler les concepts du développement des pages web en utilisant HTML, les
    feuilles de style CSS et JavaScript.
    Il s’agit de créer la partie Vue (pages web) d’une application web E-learning. Cette
    application a trois utilisateurs :
    • Administrateur
    • Enseignant
    • Étudiant

    Question 1 :

    Créer une page index.html ayant un titre « E-learning ». Cette page permet d’effectuer
    l’opération suivante :
    - L’authentification : qui permet à chaque type d’utilisateur de se connecter sur
    l’application web et de passer à la page d’accueil correspondante.
    o accueilAdmin.html
    o accueilEnseignat.html
    o accueilEtudiant.html
    Question 2 :

    Créer la page accueilAdmin.html. Cette page est composée de 4 sections.


    1. Entête de la page : qui affiche une image de la faculté et les informations de
    l’utilisateur (Nom, Prénom, photo de profil, etc).
    2. Menu vertical : à gauche de la page. Il contient les liens suivants :
    2.1 Liste des utilisateurs : qui permet d’afficher la liste des utilisateurs
    (enseignants et étudiants). La liste affichée permet d’effectuer les opérations
    suivantes :
    • Filtrer la liste : selon des critères tels que le type d’utilisateur, sexe,
    etc.
    • Modifier utilisateur : qui permet d’afficher un formulaire pour la
    modification des informations d’un utilisateur (mot de passe, email,
    téléphone, adresse, etc).
    • Supprimer utilisateur : qui permet de supprimer un utilisateur.
    2.2 Ajouter utilisateur : qui permet d’afficher un formulaire pour ajouter un
    utilisateur (enseignant et étudiant).
    3. Corps de la page : affiche la liste des utilisateurs, le formulaire d’ajout ou le
    formulaire de modification.
    4. Bas de page : affiche des informations telles que : copyright, l’adresse de la
    faculté, numéro de téléphone et email
    Question 3 :

    Créer la page accueilEnseignant.html. Cette page est composée de 4 sections.


    1. Entête de la page qui affiche une image de la faculté et les informations de
    l’utilisateur (Nom, Prénom, photo de profil, etc).
    2. Menu vertical à gauche de la page. Le menu contient les liens suivants :
    2.1 Liste des étudiants : qui permet d’afficher la liste des étudiants concernée
    par les modules de cet enseignant. La liste affichée permet d’effectuer les
    opérations suivantes :
    • Filtrer la liste : selon des critères tels que la section, le groupe, etc.
    • Supprimer étudiant : qui permet de supprimer un étudiant d’un
    module.
    3. Corps de la page : affiche par défaut la liste des modules enseignés par cet
    enseignant. En cliquant sur un module, il affiche une page qui permet de gérer les
    semaines d’enseignement de ce module (Ajouter, modifier, supprimer).
    4. Bas de page : affiche des informations telles que : copyright, l’adresse de la
    faculté, numéro de téléphone et email.

    Question 4 :

    Créer la page accueilEtudiant.html. Cette page est composée de 4 sections.


    1. Entête de la page : qui affiche une image de la faculté et les informations de
    l’utilisateur (Nom, Prénom, photo de profil, etc).
    2. Corps de la page : affiche par défaut la liste des modules dont l’étudiant est
    concerné. En cliquant sur un module, une page qui contient les semaines
    d’enseignement de ce module, s’affiche. Elle permet à l’étudiant de consulter les
    supports (cours, TD, TP) publiés par l’enseignant dans chaque semaine.
    3. Bas de page : affiche des informations telles que : copyright, l’adresse de la
    faculté, numéro de téléphone et email

    Question 5 :

    - En utilisant CSS créez un style uniforme pour toutes les pages et les différents
    composants (texte, bouton, zone de texte, etc).
    - Utilisez JavaScript pour rendre les pages réactives (Validation des formulaires, etc).

    Remarque :

    - L’objectif du TP est de créer les pages web seulement (frontend). Donc, aucun
    traitement ou programmation (backend) n’est demandé.
    - Les informations affichées sur les pages peuvent être injectées directement dans le
    code HTML. Par exemple, la liste des utilisateurs, les informations de l’utilisateur
    dans la page d’accueil, etc.

    Vous aimerez peut-être aussi