Devoir-projet : mini-site

2019-2020

Licence Informatique, semestre 6

Alexandre NiveauJean-Marc Lecarpentier — Judith Jeyafreeda Andrew

Enseignement des technologies du Web

 

Devoir-projet : mini-site

2019-2020

Sujet

Vous devez réaliser, en binôme (les monômes sont acceptés, mais la notation ne sera pas spécialement adaptée), un mini-site sur un sujet de votre choix. Il doit au moins en partie porter sur des choses listables ; dans la suite de l'énoncé, nous parlerons d'« objets », mais ce ne sont pas nécessairement des objets au sens propre. Cela pourra être par exemple des livres, chansons, pays, mots, disques, personnes, événements historiques, arbres, boîtes de camembert…

Préférez un sujet original (en particulier, autre chose que votre page perso, et autre chose que les Pokémon) ; mais vous ne serez pas jugé·e sur le choix du sujet. Cependant, ne reprenez pas tels quels les objets « poème », « couleur » et « animal » manipulés en cours et en TP.

Consignes

Votre site devra remplir les consignes suivantes.

  • Il devra comporter une page listant tous les objets.
  • Chaque objet de la liste devra avoir une page dédiée, typiquement avec plus de détails.
  • Il faudra gérer l'authentification des utilisateurs :
    • tout·e internaute devra pouvoir s'inscrire en fournissant certaines informations personnelles ;
    • les personnes non authentifiées pourront voir la liste des objets, mais pas la modifier, et ne pourront pas voir les pages individuelles des objets ;
    • les personnes authentifiées pourront voir les pages individuelles des objets, et en ajouter de nouveaux à la liste ;
    • de plus, les personnes authentifiées devront pouvoir modifier et supprimer leurs propres objets (mais pas ceux des autres).
  • Le site devra contenir une page de type « à propos », qui contiendra les numéros étudiants des membres du binôme (mais pas les noms, pour permettre une correction un minimum anonyme), ainsi qu'une courte présentation/justification de vos choix en matière de design, modélisation, code, etc., et tout ce qu'il vous semble utile de nous signaler.
  • Le design de la page ne sera pas spécialement pris en compte, en revanche l'ergonomie et l'accessibilité seront des facteurs important d'évaluation, en particulier les aspects spécifiquement abordés en TP.
  • Évidemment, votre site ne devra pas être vulnérable aux principales failles de sécurité vues en cours (injections SQL et JavaScript, « fuite » de la base de données).

En outre, il faudra respecter les contraintes techniques suivantes.

  • Le site devra être hébergé sur le serveur web du département (détails plus bas sur le rendu du devoir).
  • Vous devrez stocker les objets et les comptes utilisateur dans une base de données MySQL ou PostgreSQL.
  • Vous devrez utiliser l'architecture MVCR vue en cours et détaillée lors des TP, avec en particulier une bonne séparation des classes métier (le modèle), de l'affichage (vues), de la gestion des requêtes HTTP (routeur), de la gestion des actions (contrôleurs), de la validation des données (builders), et des détails de stockage en base de données.
  • Les pages générées devront être valides HTML5 (pas nécessairement valides CSS, le validateur W3C n'étant pas forcément à jour sur les spécs).

Outre le respect des consignes, nous évaluerons votre travail suivant la qualité du code PHP (lisibilité, propreté, documentation).

Bonus

N'hésitez pas à enrichir votre mini-site, en contenu ou en fonctionnalités (effort particulier sur le design, partie d'administration des comptes utilisateur, possibilité de configurer certains aspects de l'affichage…). À condition que les consignes de base soient respectées, et dans une certaine limite de points (voir plus bas), ce que vous rajouterez comptera comme bonus dans l'évaluation ; n'oubliez cependant pas d'en parler sur votre page « à propos », pour que nous ne rations rien.

Attention, vous pouvez utiliser JavaScript autant que vous voulez pour améliorer l'expérience utilisateur, mais le site doit pouvoir fonctionner sans.

Remarques sur l'architecture

Un des objectifs du DM est de vous faire appliquer l'architecture présentée en cours et détaillée dans le gros exercice filé vu en TP. Certains des choix faits dans cet exercice sont destinés à en simplifier l'énoncé : ils ne représentent pas une consigne ferme. Par exemple, si vous regardez les sources du site des poèmes ou des couleurs, vous verrez qu'il y a des variations. Vous pouvez vous aussi tout à fait faire des choix différents.

Cependant, les principes de l'architecture MVCR doivent être respectés. Plus vous vous éloignerez de la structure présentée en cours/TP, plus vous vous exposerez à la critique. Réfléchissez bien avant de faire des choix architecturaux trop différents (vous pouvez aussi évidemment en discuter avec nous), et si vous décidez de les faire, justifiez-les sur votre page « à propos ».

Remarque pour les spécialistes du PHP : il n'est pas interdit de réutiliser des bouts de code que vous auriez déjà écrits, mais ne reprenez pas tout le super framework perso sur lequel vous travaillez depuis deux ans. C'est très difficile à évaluer, ça prend beaucoup de temps, ce n'est pas très juste par rapport aux autres (car on n'évalue alors pas un simple DM mais le travail de plusieurs mois/années), et on ne peut pas vérifier votre implication personnelle dans le développement. Ça peut être frustrant pour vous, mais ce type de frustration est courant en informatique — et rien ne vous empêche d'intégrer proprement vos idées dans l'architecture demandée.

Compléments d'information

  • La correction se fera avec Firefox sous Ubuntu sur les machines du département. On ne vous demande pas que votre HTML/CSS/JavaScript fonctionne sur d'autres navigateurs ou OS. En revanche le site sera testé avec et sans JavaScript.
  • Dans la mesure du possible, la correction se fera de façon anonyme. Ne mettez pas vos noms sur le site, dans les sources et dans les noms de fichier (seulement vos numéros étudiants sur la page « à propos »).
  • Les contenus (textes, images, etc.) peuvent être pris sur diverses sources, à condition de les citer.
  • Il n'est pas à proprement parler interdit d'utiliser un framework CSS (ou JS), mais nos exigences en matière de design seront plus hautes, et ça impactera probablement sévèrement notre appréciation de la qualité du code.
  • Si votre site utilise de l'upload de fichiers, les fichiers récupérés devront être placés dans le répertoire upload à la racine du mini-site, sinon l'upload ne fonctionnera plus après la date limite (voir la section sur le rendu du devoir).
  • N'hésitez pas à vous entraider, mais ne copiez pas le code des autres. Nous serons sévères envers les fraudes.
  • En cas de difficultés, n'hésitez pas à nous contacter.

Barème indicatif

Le nombre de points pourra être modifié si nécessaire. Voir plus haut pour les détails sur chaque élément.

  • Fonctionnalités : 13 points
    • Liste d'objets, affichables indépendamment : 3 points
    • Création, suppression, modification d'objets : 4 points
    • Comptes utilisateur, authentification : 3 points
    • Respect des droits d'accès : 3 points
  • Apparence et utilisabilité : 7 points
    • Accessibilité, adaptabilité : 3 points
    • Ergonomie : 4 points
  • Bonus et malus : entre -14.5 et +5 points
    • Malus pour le non-respect des consignes de rendu : entre -2 et 0 points
    • Malus pour la non-validité du HTML : entre -1.5 et 0 point
    • Malus pour le non-respect de l'architecture demandée : entre -4 et 0 points
    • Malus pour les problèmes de sécurité : entre -5 et 0 points
    • Bonus-malus pour la qualité du code PHP : entre -1 et +1 point
    • Bonus-malus pour la « finition » (citation des sources, problèmes d'affichage, effort dans le choix ou le traitement du sujet…)  : entre -1 et +1 point
    • Bonus pour les ajouts et fonctionnalités supplémentaires : entre 0 et +3 points

Rendu du devoir

La date limite de rendu du devoir est le dimanche 1er décembre à 19h.

Le travail devra être rendu uniquement par l'un des deux membres du binôme (au choix). On note NUMETU1 son numéro étudiant, et NUMETU2 celui de l'autre membre.

Il y a deux étapes à remplir pour que le devoir soit considéré comme rendu :

  1. NUMETU1 devra déployer le mini-site sur le serveur web du département, dans le répertoire /users/NUMETU1/www-dev/dm-inf5c-2019/. Ce répertoire a été créé automatiquement pour tout le monde ; vous ne devez pas le supprimer ou le renommer. Après la date limite, il sera rendu inaccessible en écriture jusqu'à ce que la correction soit terminée (excepté le répertoire /users/NUMETU1/www-dev/dm-inf5c-2019/upload/, pour que l'upload de fichiers puisse continuer à fonctionner). Votre mini-site devra donc être accessible à l'URL https://dev-NUMETU1.users.info.unicaen.fr/dm-inf5c-2019/.
  2. NUMETU1 devra déposer sur Ecampus une archive contenant le répertoire dm-inf5c-2019 (arborescence du site), ainsi que tout autre fichier nécessaire à son déploiement (pensez notamment à faire un dump de vos bases de données, si nécessaire).

    L'archive devra obligatoirement être au format ZIP et porter le nom suivant : dm_NUMETU1_NUMETU2.zip (ou dm_NUMETU1.zip pour les monômes).

Attention à ne pas mentionner vos noms sur le site ou dans le code (ou les noms de fichier…), de façon à ce qu'une correction anonyme soit possible.

Si vous n'utilisez que votre propre serveur pour développer votre site, prévoyez de la marge pour le déploiement sur le serveur du département. Entre la BD, les différences de versions de PHP et la configuration d'Apache, il peut y avoir énormément de problèmes imprévisibles.

En cas de problème au moment du rendu de votre travail, contactez-nous le plus rapidement possible.