Introduction
Dans ce cours nous continuerons l'exploration des technologies front-end avec le framework Angular, et back-end avec nodeJS, BDs NoSQL, hébergement dans le cloud etc.
Mini projet à rendre :
Modalités de rendu
- A faire en binôme ou seul
- Date de rendu : lundi 13 Décembre
- Comment le rendre :
- m'envoyer par mail votre repo github (back et front), INDIQUER CLAIREMENT LES NOMS DU BINOME
- Le repo github doit avoir un README qui indique clairement vos contributions (en gros, ce que vous avez fait en plus par rapport à la correction que je vous ai donnée pendant le cours)
- des points en plus si vous m'envoyez les deux URLs sur heroku pour que je teste directement sans avoir besoin de builder chez moi (je regarderai le code).
Travail à faire
- Rendre la présentation plus jolie, notamment je voudrais les assignments dans une table angular material, avec si possible l'élément paginator pour faire la pagination (il y a un exemple dans la page de documentation des tables.
- Optionnel : table de hauteur fixe, qui scrolle les éléments, mais qui laisse le header fixe.... (chercher dans la doc ou sur google "sticky row")
- Optionnel : colonnes triables (juste sur la vue, on n'envoie pas de requêtes etc.)
- Optionnel : mettre en surlignage la ligne sur laquelle on déplace la souris (y'a un exemple dans la doc)
- On avait affiché le détail quand on cliquait sur un assignment dans la liste. Maintenant, on ne va plus faire comme cela, on va à la place afficher une icône dans une colonne supplémentaire à droite, et quand on clique dessus on a le détail. (ici aussin écouter (click) sur la cellule etc.)
- On pouvait supprimer un assignment avec le bouton DELETE qui était dans le composant de détail. Maintenant, EN PLUS, on voudrait une colonne supplémentaire dans le tableau qui présente la liste, et si on clique dessus ça supprime directement (sans passer par le détail)
- Un plus si vous arrivez à afficher un dialogue "êtes vous sur de vouloir supprimer cet assignment / cancel / ok". Aide: utiliser un Dialog aAngular Material ou équivalent (il y a peut-être un composant spécialisé)
- Optionnel : utiliser le composant angular material Snack Bar pour afficher les messages qu'on affiche dans la console (les plus intéressants, comme "assignment ajouté", supprimé, modifié, etc.
- Optionnel (pour les bons) : gérer la connexion login/password
- Vous ne ferez pas la partie back-end. Juste le client angular, avec un tableau de login/password codé en dur dans le service d'authentification.
- Pour l'interface graphique de connexion: coder un formulaire login/password en haut de l'écran, avec un bouton "deconnexion" qui n'apparait que si on est connecté, et un bouton connexion qui apparait que si on n'est pas connecté. FAIRE UN NOUVEAU COMPOSANT.
- On ne pourra editer et supprimer un assignment que si on est connecté en admin. Les boutons serons grisés pour ne pas proposer l'option si on n'a pas le droit.
- SI VOUS VOULEZ RAJOUTER DES CHOSES, faites-le ! J'aime être surpris :-)