Blog ENI : Toute la veille numérique !
🐠 -25€ dès 75€ 
+ 7 jours d'accès à la Bibliothèque Numérique ENI. Cliquez ici
Accès illimité 24h/24 à tous nos livres & vidéos ! 
Découvrez la Bibliothèque Numérique ENI. Cliquez ici

Création d'une gestion de collections

Présentation du projet

1. Description du projet

L’objectif de ce projet est de concevoir et de réaliser un logiciel de gestion de collections. Ce projet est un peu plus sophistiqué que les précédents.

Le cahier des charges est le suivant.

  • L’utilisateur peut créer autant de collections qu’il désire.

  • Il choisit librement le type d’objets à collectionner : des timbres, des DVD, des livres, des cartes postales, etc.

  • Pour chaque collection qu’il désire gérer, l’utilisateur crée un modèle de fiche de saisie constituée des champs qu’il juge représentatifs des objets collectionnés. Via cette fiche, il saisit chaque élément de la collection et l’enregistre dans une base de données. 

  • Il est également possible de lister tout ou partie de la collection sélectionnée et d’en afficher certains éléments déterminés par des critères de sélection.

Pour les choix techniques retenus, la base de données gestionnaire est une base MySQL sur un serveur hébergé localement et les services de données sont écrits en PHP.

2. Les compétences acquises au cours du projet

La réalisation de ce projet permettra au lecteur d’acquérir les compétences JavaScript et jQuery suivantes :

  • manipuler des objets et des tableaux

  • choisir et utiliser des sélecteurs jQuery et CSS

  • injecter et supprimer des objets HTML dans le DOM

  • animer, déplacer et positionner interactivement des objets du DOM

  • effectuer des appels AJAX pour récupérer et afficher des données externes

  • effectuer des appels AJAX pour envoyer et sauvegarder des données utilisateurs en base de données externe

  • déclencher et réagir à des évènements personnalisés

Accessoirement, des techniques de programmation PHP et des requêtes MySQL sont aussi largement abordées dans ce projet.

3. La structure du projet

Ce projet se compose d’une page HTML, d’une feuille de style CSS, de fichiers permettant l’accès aux données par l’intermédiaire d’un...

Gérer des collections

1. Définir une collection

Pour le moment, la seule option disponible lorsqu’on charge la page dans un navigateur est le bouton proposant la création d’une nouvelle collection.

images/16-21-001.png

Bien évidemment, à ce stade, il ne se passe rien lorsqu’on clique dessus.

Comme déjà expliqué précédemment, le système doit proposer aux utilisateurs une liste de boutons correspondant chacun à un accès vers une collection déjà définie. Cela implique que l’application doit récupérer une liste des collections créées et injecter dans le DOM un bouton pour accéder à chacune d’entre elles.

Ensuite, il faut gérer le fait de cliquer sur ces boutons. S’il s’agit d’un des boutons de collection injectés, il faut exécuter la partie de l’application en charge de la présentation d’une collection pour permettre son exploitation, et s’il s’agit du bouton de création d’une nouvelle collection, il faut exécuter la partie administration de l’application, qui permet de paramétrer les informations définissant la nouvelle collection dont l’utilisateur souhaite gérer les éléments.

Dans la partie administration, il faut permettre à l’utilisateur de définir sa collection. Une collection est définie par les propriétés suivantes :

Propriété

Description

Valeurs possibles

name

Nom de la collection. Ce nom est celui figurant sur le bouton permettant d’y accéder.

Chaîne de caractères unique

description

Texte libre décrivant la collection.

Chaîne de caractères

type

Type de collection.

Chaîne de caractères parmi : image, livre, objet, son, video

properties

Liste d’objets définissant la fiche d’une collection.

Tableau d’objets JavaScript

Dans cette liste de propriétés de collection, l’une d’entre elles doit être expliquée plus en détail. Il s’agit de la propriété properties. Cette propriété est un tableau d’objets JavaScript représentant chacun une entrée dans la fiche d’identité d’un élément...