/alyra-veilles-challenge

Primary LanguageJavaScript

Alyra Veilles Challenge

La référence veilles.mp4 - vous la trouverez aussi dans le dossier assets avec quelques captures d'écran en plus.

Vous utilisez bootstrap 5 pour les styles de ce document, vous pouvez personnaliser le rendu. Mise en page est libre mais vous devez penser à l'expérience utilisateur.

Vous utilisez la bibliothèque JavaScript - Moment.js et son extension moment-with-locales

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment.min.js"></script>
<script src="https://momentjs.com/downloads/moment-with-locales.min.js"></script>

Fonctionnalités à mettre en place :

  1. Afficher la date du jour (format avec le nom du jour en français)
  2. La liste des veilles (afficher toute la liste depuis la variable veilles (à trouver dans fichier js/veilles.js))
  • le titre
  • la catégorie
  • la date en format comme dans la vidéo ou sur des captures d'écran
  1. Possibilité de trier les veilles dans l'ordre alphabétique AZ et ZA ainsi que par date. Le tri par date est le tri par défaut
  • utiliser un élément select
  1. Possiblité de filtrer uniquement des veilles à venir
  • utiliser un checkbox

  1. Élément select avec options qui correspondent aux catégories des veilles (la liste déroulante des catégories uniques)

  2. Possibilité de filtrer les veilles par catégorie

Bon courage 💪!!!