Skip to content

Analyse technique

Kouvahe81 edited this page May 16, 2022 · 31 revisions

Architecture

image

Les services React interagissent avec le router NodeJs via des requêtes HTTP, ensuite Nodejs (Express) va récupérer les données nécessaires pour le frontend dans la base de donnée via Mongoose et le renvoyer vers le frontend via une autre requête Http

Backend

NodeJs

  1. Justification du choix
  • NodeJs est une technologie simple à prendre en main (utilisation du langage Javascript). Ayant déjà développer en javascript par le passé, cela nous permet de ne pas devoir réapprendre tout un nouveau langage et nous offre un gain de temps de développement.

  • Le fait d'utiliser des technologies Javascript pour le frontend et le backend nous permet la réutilisation de code et une division des tâches plus simple au sein du groupe.

  • NodeJs est apprécié pour sa rapidité. Il utilise la version 8 du moteur développé par google qui permet de compiler très rapidement le javascript en code machine natif. Les tâches interagissant avec une base de données, les lectures/écritures dans les fichiers et les connexions réseaux sont plus rapide avec NodeJs plutôt qu'avec leurs concurrents.

  • NodeJs possède une communauté très active, ce qui permet de trouver facilement et rapidement des solutions lorsque nous nous heurtons à un obstacle. De plus, NodeJs possède un gestionnaire de Node package (NPM) comprenant plus de 50 000 modules ce qui permet aux développeur de construire les solutions les plus efficace possible. Le NPM maintint les modules isolés des autres projets, ce qui permet d'éviter les conflits de version.

  • NodeJs permet d'avoir des performances optimales. Le fonctionnement de NodeJs est basé sur une boucle événementielle lui permettant de supporter de fortes montées en charge. L'utilisation de NodeJs en tant que serveur web permet de traiter un gros volume de requêtes simultanément de manière efficace.

  • NodeJS est une technologie stable qui est utilisé et éprouvée par des géants du web tel que Netflix, Trello, Paypal, LinkedIn, Walmart,... Une politique stricte concernant les mise à jour et le suivi de version en font une technologie stable et solide.

  1. Organisation du code

image

  1. Diagramme de classes UML

image

La table Groupe hérite de la table Membre car un membre appartient à un groupe. Il y a une relation qui lien la table groupe et Genre Musical. La table réservation a une relation avec un Festivalier(e) qui a à son tour une relation avec la table Genre Musical. Anime a une relation avec la table Groupe et Scène afin de déterminer la date de scène d'un groupe donné.

  1. Fonctionnement

[Explication du fonctionnement du backend. Par exemple : Explication du "voyage" d'une requête entre la réception de la requête sur une route donnée et l'envoi d'une réponse]

API

[Explication des choix de conception de l'API : Principes de nommage, technologie utilisée, outils,...]

Lien vers la liste des endpoints documentés

Base de données : MongoDB

  1. Justification du choix MongoDB est une base de données NoSQL. Cela signifie que l'on ne peut pas utiliser SQL pour communiquer avec. Les données sont stockées comme des collections de documents individuels décrits en JSON (JavaScript Object Notation). Il n'y a pas de schéma strict de données (on peut écrire, en gros, ce que l'on veut où l'on veut), et il n'y a pas de relation concrète entre les différentes données. Cependant, il existe des outils (que vous découvrirez rapidement !) pour nous aider à subvenir à ces besoins. MongoDB permet:
  • une orientation documents
  • d'excellentes performances
  • une très bonne scalabilité
  • un système totalement dynamique
  • des données hétérogènes
  • très bonne flexibilité
  • un système de gestion en JSON et BSON (JSON Binaire)
  • un système de recherches et de modifications aussi bon que le SQL
  • des excellentes performances par rapport au cloud. AWS, Google Cloud et Azure proposent des solutions pour implémenter MongoDB très facilement
  1. Diagrammes

[Schémas EA / Relationnel de la DB] [Texte expliquant les diagrammes et justifiant les choix de conception]

Frontend

ReactJs

  1. Justification du choix du framework JS
  • ReactJs est doté d'une grande flexibilité et de bonne performances grâce à l'utilisation d'un DOM virtuel permettant au navigateur de ne se mettre à jour qu'en cas de besoin. React a l'avantage de limiter les interactions avec celui-ci.

  • ReactJs n'impose pas de bibliothèque spécifique pour la data, il n'est que la partie "Vue" de l'interface. Cela permet une plus grande liberté dans les choix concernant la structure de l'interface.

  • La communauté autour de ReactJs est bien plus grande que celle de ses concurrents, donc en cas de problème, trouver une solution en ligne, ou trouver un autre aide sera très rapide et facile. La grande communauté apporte aussi beaucoup de librairies compatibles, et de conseils de développement.

  • React utilise une syntaxe spéciale appelée JSX qui permet de mixer l'HTML et le javascript. Cette syntaxe permet d'écrire facilement nos composants.

  • ReactJs permet de produire du code simple à lire et donc à comprendre. Cela permet de déterminer facilement quelles sont les fonctionnalités de notre application et donc aide à simplifier la maintenance de l'application. Cela rend également plus facile l'expansion des projets en React dans le temps.

  1. Justification du choix pour la mise en oeuvre du CSS (Framework?)

  2. Organisation du code

image

  1. Apparence

[Quelques screenshots pour montrer le résultat + discussion sur l'évolution depuis les premières maquettes]

  1. Fonctionnement

[Explication du fonctionnement du frontend depuis une action utilisateur (clic sur un bouton, envoi de formulaire, ...) jusqu'à l'affichage du résultat. Prendre comme illustration une action qui nécessite un échange avec le backend]

Clone this wiki locally