Module : Java et Technologies Web

Université Sidi Mohamed Ben Abdellah

Niveau : 2ème année Génie Réseaux et
Ecole Nationale des Sciences Appliquées de Fès
Télécommunications
A.U : 2020-2021
Professeur : Hiba Chougrad

Projet Technologies Web

- La date de présentation est le 16/01/2021

- Création de groupes de 4 étudiants

- Rapport + Présentation (ppt) de 20 min (5 min pour chaque étudiant)

Description du Projet : Le but de ce projet est de réaliser un espace pédagogique pour une
école, cet espace sert à fournir un ensemble de cours et TPs postés par les professeurs et doit être
accessible au moyen d’une interface web. Ce mini projet est vu de trois manières différentes
(trois Menus) selon le type du visiteur du site (Etudiant, Professeur ou Administrateur).

1. La présentation générale de l’interface est laissée à votre convenance. Soignez le style et

mise en forme des pages avec le langage CSS. Il est conseillé d’utiliser un fichier CSS
externe, appelé depuis l’entête des fichiers, vous le nommerez style.css

2. Ci-dessous vous trouverez les principales fonctionnalités du site :

Partie I : Espace Etudiant
Un étudiant peut :
 Créer un compte pour accéder au menu étudiant.
 Afficher la liste des cours et des TPs postés par les professeurs.
 Effectuer son inscription en ligne si c’est un nouvel étudiant.
 Afficher la liste des lauréats.
 S’inscrire dans la liste des lauréats.

Partie II : Espace Professeur

Un professeur peut :
 Créer un compte pour accéder au menu Professeur.
 Voir la liste des cours et TPs qu’il a posté.
 Afficher la liste des lauréats.
 Ajouter ou supprimer un cours ou un TP.

Partie III : Espace Administrateur

Un administrateur peut :
 Se connecter à son espace.
 Gère les comptes des étudiants et des professeurs (l’administrateur a accès à deux listes,
une des étudiants et une des professeurs).
 Il peut ajouter ou supprimer des étudiants et des professeurs de l’espace.
 Il peut ajouter ou supprimer des étudiants de la liste des lauréats.

3. Voici quelques interfaces que vous devrez reproduire de votre propre manière et ajoutez
les autres interfaces comme bon vous semble :
a. Interface d’authentification professeurs / étudiants

b. Interface d’inscription en ligne

2
c. Interface pour s’inscrire dans la liste des lauréats

d. Interface pour l’inscription d’un professeur

3
 e. Interface pour ajouter un cours ou TP

4. Créer un fichier code.js qui contiendra le script JavaScript qui permet de vérifier la
cohérence des champs des formulaires des pages créées, il contiendra :
- Des fonctions de validation pour chaque formulaire Form1Validation(this) ,
Form2Validation(this) …etc permettant de faire une vérification de tous les
champs avant l’envoie du formulaire, si l’utilisateur se trompe, ces fonctions
renvoient un message d’erreur.
o Elles vérifient les champs obligatoires marqués avec * qui doivent être
présents.
o Elles vérifient que les emails saisies sont valide (tester la présence du @ et
du point '.' après.
o Elles vérifient que les champs CNE et Tél sont composés de 10 caractères
exactement ni plus ni moins.
o Elles vérifient que les dates sont écrites correctement.