Role de l'architecture MVC dans les framework Frontend et Backend

L'architecture MVC et leur role dans les framework Frontend comme backend parlons en un tout petit peu?

Quand on débute en dev, non seulement il y a beaucoup de confusions sur ce qu'on doit apprendre comme langage de programmation pour demarrer et d'ailleur j'ai fait tout un poste ici sur ma page sur cette problematique, on doit aussi apprehender, comprendre et maitriser l'abstraction autour de la OOP(programmation orienté objet), mais pour écrire du code de qualité (clean code en anglais), il faut comprendre aussi ce qu'on appelle "Design Pattern" qui en paroles simples, sont les bonnes manières qu'il faut suivre pour écrire du code qui sera facilement maintenanble et surtout integrable dans le temps, le Design Pattern est basé sur la OOP . C'est essentiellement la raison pour laquelle on encourage de maintriser la OOP dans n'importe quel langage et ainsi, on pourra tranquillement se mouvoir dans n'importe quel autre langage et quel autre framework.

Puisque nous parlons dans ce post des framework, beaucoup parfois se demande à quoi servent réellement les framework?

Tout d'abord, il ne faut pas confondre un framework d'une simple librairie ou bibliothèque, une bibliothèque le plus souvent regroupe des fonctions communes qui simplifient la vie du developpeur pour faire une tache precise, un framework va au dela d'une simple bibliothèque, bien qu'il soit composer de bibliothèque, il apporte tout un ecosysthème propre à lui pour construire un logiciel dans un langage donné, si vous prenez par exemple PHP, on retrouve plein de framework PHP pour faire des sites web : Laravel, Codeigniter, Symfony, chacun apporte son propre mecanisme mais le but finale c'est d'aider le developeur à faire un site web et le framework les gere de manière trasparente certains aspects complexes qui serait difficile de le faire en PHP vanilla par exemple : l'accès facile à la BDD à travers un ORM, l'aspect de la securité par exemple protégé ses pages ou ses API REST avec du JWT(Json Web Token) qui respecte le standard Auth 2.0 en écrivant vraiment quelque ligne de code alors qu'il s'agit d'une solution bien complexe, parfois cela necessite juste meme une simple configuration ou une convention à respecter ce que les angloxasones appellent "Convention over configuration".

Vous trouverez la meme logique en dotnet c# avec asp.net core qui est le framework de dotnet pour faire les sites web, java spring MVC ou spring Boot ou python Djano etc.. cela est aussi le cas dans les framework frontend comme React, Angular, Vuejs, React normalement est une bibliothèque plus qu'un framework, les framework frontend comme j'ai souligné plusieurs fois, vous aident à manipuler le DOM(Document Object Model) qui en fait est votre page HTML vu en terme de code, donc quand vous faite votre page XML/HTML, la premiere des choses que fait votre navigateur est de le "parser" c'est à dire le traduire en DOM javascript, une fois qu'il l'a traduit, le navigateur peut donc le manipuler en mémoire et justement, le role des framework frontend est de manipuler ce DOM avant de le passer au navigateur qui doit s'occuper du rendu finale, avant on utilisait JQUERY pour faire cette tache, mais de nos jours, les framework frontend, apportent des touches particulières en utilisant les "web component" pour manipuler le DOM de manière efficace pour vous en tant que developpeur qui doit simplement creer des "compoenent" dans ces framework et l'indiquer comment ils sont structurés sur sa page web et le framework s'occupera de creer ces components pour vous et de gerer leur cycle de vie durant leur sejour sur la page web.

De nos jours, tous ses framework sont basés sur l'architecture MVC

dans cette architecture, le M appellé Model en anglais, represente les données à manipuler, generalement ce que l'on veut faire voire à l'utilisateur, Le V appellé View en anglais (la vue), represente l'interface graphique, dans une page web c'est le HTML qui represente le component, dans une app android c'est le XML de l'activity android etc.., Le C appellé Controller en anglais, c'est le code qui contient la logique metier pour passer les données de la View au Model et du Model à la View donc c'est lui qui fait le pont.

Pourquoi utiliser une telle architecture? simplement parcque c'est une architecture qui permet de decoupler de manière distincte un logiciel, le découplage d'un logiciel en View, Model, Controller permet de les isoler et de pouvoir les tester separement l'un independement de l'autre, c'est un gros gros avantage en terme de developpement, on peut ainsi avoir plusieurs equipes de developpeurs sur le meme projet qui ne vont pas en conflit, de plus on peut fair abusivement et massivement recourt à l'abstraction quand il faut les integrer donc en phase de developpement, passer des données fictifs du Model à la View et quand on va en production, avoir les données réelles. Ces framework justement utilise cette architecture pour automatiser beaucoup de fonctionnalités qui sont transparent pour le developpeur.Avoir son propre projet basé sur une architecture MVC donc decouplé nous permet egalement de faciliter sa modulation afin de le rendre facilement scalable, on a parlé dans ce meme blog quels sont les techniques à faire pour faire en sorte que son site web supporte des millions voir des milliards d'utilisateurs, eh bien il faudrait que l'application soit projecter de manière à etre scalable et pour faciliter cette scalabilité, il faut que l'application soit decouplé et le MVC apporte justement un début de solution à ce decouplage.

il existe plusieurs variantes du MVC : le MVVM(Model View ViewModel) par exemple ce type d'architecture est utilisé pour les app mobile en microsoft Xamarin et meme Angular et vuejs s'approche de ce type d'architecture, le MVP(Model View Presenter) beaucoup moins utilisé.

J'espère que ce post vous a éclaircit certaine chose que vous lisez beaucoup et que vous ne comprenez pas ou on veut en venir, s'il y a des questions, n'hesitez pas de les poser en commentaire

Bon coding

---

---

Share

Comments (0)

Leave A Comment

Your Name:
Comment: