Contexte

La circonscription de Beauvais Nord qui regroupe plusieurs écoles souhaite mettre à disposition des enseignants une application ludique et pédagogique pour les défis sportifs.
Ces défis sportifs ont lieu tous les ans à une période précise. Chaque classe doit définir un objectif à atteindre. En fonction de cet objectif, les élèves courent et l’enseignant comptabilise la distance totale parcourue (la somme de chaque parcours d’élèves) pendant une séance. L’enseignant peut réaliser autant de séances qu’il le souhaite pour réaliser l’objectif pendant la période définie.

Le code sera accessible depuis un dépôt Git, l’application sera déployée sur le serveur correspondant au domaine *sio.eu*.

Front office

Les affichages et formulaires seront réalisés en HTML5, CSS et JQ avec Bootstrap. Les fichiers principaux auront donc une extension HTML. On pourra utiliser les Regex en HTML5 et la validation des formulaires grâce à Bootsrap et JQ. Les animations pourront être réalisées en JQ et JQ UI. Les autres bibliothèques ne sont pas tolérées.

Affichage des réalisations

On souhaite visualiser le cumul des scores déjà réalisés et le nouveau score de façon distinct pour la classe, l’école et la circonscription.
On pourra afficher un compteur et des barres dynamiques pour le nouveau score. La conversion en Kilomètre sera affichée à la fin du compteur.

Dans un second temps, on pourra afficher le total des scores par rapport aux objectifs sur la même page grâce à une animation.

Sélection de la classe

On pourra choisir l’école puis la classe. L’application sera sécurisée par un mot de passe. Il n’y a pas de règle particulière pour le mot de passe, vous pouvez choisir votre stratégie de sécurité.

Enregistrement de l’objectif et du score

On pourra ensuite selon la classe, afficher son objectif, le modifier et ajouter un nouveau score. Si l’utilisateur saisie 0 pour le score, il visualisera les barres sans sauvegarde de nouveaux scores.

Back office

Création de la base de données

Réaliser le MCD puis la base de données répondants aux besoins. On prendra soins de vérifier l’implémentation des clefs étrangères dans le SGBDR. L’application n’archivera pas les scores d’une année à l’autre. (Note : le professeur pourra vous corriger votre MCD).

Insérer un jeu de données.

Définition des services back office

Réaliser une liste des services auxquelles le serveur doit répondre. On respectera l’architecture REST pour le format des URLS et des paramètres.

Installation des Framework

Selon le langage utilisé de votre serveur, respectivement PHP, JAVA, PYTHON, JAVASCRIPT, installer le Framework SLIM, JEE, FALCON ou NODEJS correspondant avec un gestionnaire de dépendances Composer, Pip, Maven ou Npm.

Implémenter les services

Réaliser le code permettant de répondre aux services précédemments définies selon le Framework choisi. (Note : le professeur pourra vous indiquer la liste des services).
On pourra tester ses requêtes avec Adminer et tester ses URI avec RestEasy ; module à ajouter au navigateur.

Communication entre l’interface client et le serveur

Désactiver l’envoie des formulaires avec JQ en les validant avec la technologie Ajax. On enregistrera coté client les variables de session grâce à sessionStorage.
Modifier les barres pour que les valeurs correspondent aux données de la base.

Déploiement

Réaliser un fichier de configuration conf.php coté serveur et conf.json coté client pour permettre un déploiement simplifié.
Déployer le front office sur *sio.eu* et le back office sur Bluemix.

Documentation

Réaliser une documentation au format JSON des URI de votre serveur. On pourra éditer cette documentation avec l’éditeur Swagger via https://sio.eu/swagger

Stratégie de sécurité

Ajouter la date et l’heure lors d’un enregistrement d’un score.

Utiliser JWT pour mettre en place un système de jeton. Les requêtes POST et PUT seront sécurisées par cette méthode.
Il faudra gérer les erreurs grâce à l’ajout de header HTTP différents de 200 lors de certaines réponses et les récupérer en AJAX.

Amélioration de l’application

Front Office

Ajouter un bouton pour pouvoir saisir un nouveau score sur la page des barres.

• On vérifiera que l’objectif est supérieur à 0 et que la distance parcourue est inférieure à l’objectif. On acceptera toutefois l’insertion d’un score supérieur à l’objectif. On utilisera la validation des formulaires via JQ, HTML5 et Boostrap.
• Ajuster la date automatiquement.
• Séparer en JS les nombres par un espace tous les 3 chiffres : 235 000
• Afficher une virgule au lieu d’un point pour les décimales à l’affichage des scores.
• Utiliser un gestionnaire de dépendance pour votre Front Office
• Ajouter un paramètre à vos inclusions pour éviter les problèmes de cache de la forme barre.css?v=1

 Back Office

Eviter l’ajout de deux scores lors d’un double click sur le bouton valider.

Le CPC EPS souhaite visualiser rapidement les informations enregistrées dans l’application. Permettre grâce à une vue, l’affichage des scores, du libellé de la classe, de son objectif, du code RNE et de la date. Ces données seront triées par RNE et date.

Statistiques

L’inspection académique souhaite avoir les statistiques du défi sous forme de diagrammes pour la circonscription et chaque école.