Application web pour la gestion d’entrepôt de documents

Afin d’appliquer l’approche dans après son adaptation, nous avons recouru à la création d’un système de gestion d’entrepôt de documents multimédia. Nous cherchons essentiellement à travers ce système a déployer le modèle de représentation des documents multimédia, la démarche de classification, et surtout montrer que l’implantation du modèle permet d’exploiter les documents de façon simple et flexible. Nous avons donc créé une application Web intitulée MERN-WMS pour gérer les entrepôts de documents multimédias. MERN est considérée de nos jours comme une moderne et populaire approche Web, elle signifie MongoDB, Express, React et NodeJs. WMS signifie Warehouse Management System. Ce chapitre est considéré comme le dernier de notre mémoire, dans lequel nous démontrons les différents outils et technologies utilisées lors du développement de notre application, nous décrivons notamment les résultats des expérimentations réalisées avec cette application. L’application MERN-WMS permet d’optimiser l’intégration et l’exploitation des documents hétérogènes dans le cadre d’un entrepôt de documents multimédia

Analyse et conception 

Présentation UML

 UML est un langage de modélisation graphique conçu pour fournir une méthode normalisée pour visualiser la conception d’un système. C’est un support de communication performant qui permet grâce à sa représentation graphique, de concevoir des solutions, de faciliter la comparaison et de les évoluer. Il est couramment utilisé en développement logiciel et en conception orientée objet. IV.3.2. Diagramme de cas d’utilisation Il est utilisé pour donner une vision globale du comportement fonctionnel d’un système logiciel. Un cas d’utilisation représente une unité discrète d’interaction entre un utilisateur et un système. Il est une unité significative de travail. Dans un diagramme de cas d’utilisation les utilisateurs sont appelés acteurs, ils interagissent avec les cas d’utilisation. Dans l’application MERN-WMS, nous avons deux acteurs :  Admin : il peut accéder à n’importe quelle partie du système, il peut ajouter, supprimer ou mettre à jour des utilisateurs ou des documents, il peut également modifier les autorisations des utilisateurs et mettre à niveau un utilisateur vers un administrateur.  User : il ne peut pas accéder au système sans l’autorisation de l’administrateur et il ne peut que prévisualiser et télécharger des documents

Diagramme de séquence

 Un diagramme de séquence est un diagramme d’interaction dont le but est de décrire comment les objets collaborent au cours du temps et quelles responsabilités ils assument. Il décrit un scénario d’un cas d’utilisation. C’est un diagramme qui représente la structure dynamique d’un système car il utilise une représentation temporelle. Les objets, intervenant dans l’interaction, sont matérialisés par une « ligne de vie », et les messages échangés au cours du temps sont mentionnés sous une forme textuelle. Dans le diagramme de séquence suivant, on a représenté seulement les deux principales opérations du système : ‘Login’ et ‘Upload’

Diagramme de classe 

Ce digramme permet de donner la représentation statique du système à développer. Cette représentation est centrée sur les concepts de classe et d’association. Chaque classe se décrit par les attributs et les opérations. Un digramme de classe se définit comme un ensemble de classes contenant des attributs et des opérations, reliées les unes aux autres par des relations et ceci ayant des conditions de participation (cardinalités). Une classe décrit un groupe d’objets ayant les mêmes propriétés (attributs), un même comportement (opérations) et une sémantique commune. Un attribut est une propriété élémentaire d’une classe qui prend une valeur. Une opération est une fonction applicable aux objets d’une classe. Elle est également appelée méthode

Implémentation 

Environnement et outils de développement 

Avant de commencer la présentation de notre application, nous allons tout d’abord, citer les outils utilisés lors du développement.  HTML Langage de marquage hypertexte (HyperText Markup Language). Il s’agit du langage de base du Web (World Wide Web).HTML n’est pas un langage de programmation proprement dit, mais plutôt un code de marquage. Il permet de décrire la page Web élément par élément en se servant de balises de description. Page | 73  CSS CSS est un langage de style qui définit la présentation des documents HTML. Par exemple, CSS couvre les polices, les couleurs, les marges, les lignes, la hauteur, la largeur, les images d’arrière-plan, les positionnements évolués et bien d’autres choses.  JavaScript Javascript est un langage de script orienté objet principalement utilisé dans les pages HTML. A l’opposé des langages serveurs (qui s’exécutent sur le server), Javascript est exécuté sur l’ordinateur de l’internaute par le navigateur lui-même. Ainsi, ce langage permet une interaction avec l’utilisateur en fonction de ses actions.  Visual Studio Code Visual Studio Code est un éditeur léger mais puissant, disponible pour Windows, macOS et Linux. Il a un support intégré pour JavaScript, TypeScript et Node.js, et dispose d’un riche écosystème d’extensions pour d’autres langages tels que C ++, C #, Java, Python, PHP, Go, …, et des environnements tels que .NET et Unity.  Git Un logiciel de versioning, ou logiciel de gestion de version est un logiciel qui permet de conserver un historique des modifications effectuées sur un projet afin de pouvoir rapidement identifier les changements effectués et de revenir à une ancienne version en cas de problème.  GitHub GitHub est un service en ligne qui permet d’héberger des dépôts ou repo Git. C’est le plus grand hébergeur de dépôts Git du monde.  MongoDB Compass MongoDB Compass propose une interface graphique pour MongoDB afin de simplifier la gestion de la base de données NoSQL. 

Les technologies et Les Framework utilisées 

 Sass Sass est un langage de stylesheet compilé en CSS. Il nous permet d’utiliser des variables, des fonctions, etc., Sass aide à garder les stylesheets bien organisées et facilite le partage de la conception au sein et entre les projets.  NodeJS Node.js est un environnement d’exécution JavaScript qui exécute du code JavaScript en dehors d’un navigateur Web. Node.js permet aux développeurs d’utiliser JavaScript côté serveur pour produire des pages Web dynamiques.  Express Express.js est un Framework d’application Web pour Node.js. Il fournit diverses fonctionnalités qui rendent le développement d’applications Web rapide et facile, ce qui prend autrement plus de temps en utilisant uniquement NodeJS.  ReactJS Est une bibliothèque JavaScript pour créer des interfaces utilisateurs, il est facile de créer des interfaces utilisateurs interactives. Définissez des vues simples pour chaque état de votre Page | 74 application, et lorsque vos données changeront, React mettra à jour, de façon optimale, juste les composants qui en auront besoin.  MongoDB MongoDB est une base de données orientée document multiplateforme et open source, une sorte de base de données NoSQL. En tant que base de données NoSQL, MongoDB évite la structure basée sur les tables de la base de données relationnelle pour adapter les documents de type JSON qui a des schémas dynamiques qu’il appelle BSON.