ASP.Net : site internet organisé en widgets

Mar 11, 2022

Une multitude de technologies différentes permettent de développer un site internet. Pour la création d’un site de petite ou de moyenne taille dont le but est la consultation et la modification d’informations, il peut être intéressant de l’organiser sous forme d’ensemble de widgets. C’est-à-dire un site internet regroupant des pages organisées par fonctionnalités, elles-mêmes divisées en petits modules fonctionnels. Le framework ASP.Net permet de créer ce type d’applications.

Les avantages

Cette façon d’organiser l’architecture d’un site web présente plusieurs avantages significatifs dans notre contexte.

La modularité

L’avantage d’un site organisé en widgets est la souplesse qui en découle pour ajouter, retirer ou déplacer ceux-ci dans les pages. Les widgets permettent de faciliter l’organisation du site selon les besoins des utilisateurs même après la période de développement.

L’organisation

Chacun des widgets sera indépendant dans sa conception du côté de la vue, permettant une bonne organisation du site. L’apprentissage pour les développeurs rejoignant le projet en cours de développement en sera ainsi facilité.

Le contrôle

Ce modèle n’est pas géré par des surcouches de trop haut niveau, ce qui permet d’avoir un contrôle très précis sur les informations circulant entre la vue et le contrôleur. Cette méthodologie offre un bon modèle d’organisation d’une équipe dans le cas où les développeurs sont spécialisés Front et Back.

La mise en place

La mise en place est similaire à l’organisation d’un projet sur le template de base avec le Framework ASP.net Core  Web App en Model-View-Controller.

Ce modèle est adapté car il permet d’organiser les classes Controller en ensemble de Web Méthodes.

Dans le cadre de notre projet, une organisation en différents tiers a été adoptée :

Spécificités de l’organisation en widget

Contrairement à l’organisation standard des pages dans ce framework, les fichiers cshtml pourront correspondre soit aux pages web (organisées en ensemble de widgets) dans notre layout, soit à un widget spécifique.

Par exemple, une page Client.cshtml regroupera plusieurs widgets représentant différentes caractéristiques. Chaque widget sera ensuite défini dans un fichier cshtml correspondant.

Organisation du code JavaScript de la page

Le framework n’étant pas nativement adapté à cette organisation, il a été nécessaire de trouver une solution afin que le code JavaScript de chaque widget soit organisé comme le sont les sections dans les pages individuelles. Pour cela, une solution a été publiée par le développeur Martin Booth sur son blog, et s’adapte parfaitement à notre besoin.
De cette façon, chaque page de widget individuel peut avoir sa propre sous-section de script. Cette sous-section permettra de définir le code JavaScript propre au widget, et dans notre contexte, le ou les appels AJAX à nos Web Méthodes situées dans le Controller.

À l’issue de cet appel, le code JavaScript s’occupera de mettre à jour le contenu du widget avec les informations obtenues.

Pour conclure

Cette organisation de pages sous la forme d’ensemble de widgets permet une modularité et une stabilité assez importante. Chaque widget étant individuel et autonome, une erreur dans l’une des fonctionnalités n’entraînera pas de problème dans les autres.

Dans le cadre de notre projet, cela a facilité l’organisation de notre équipe pour travailler en parallèle sur la mise en place de nouvelles fonctionnalités, sur le design, sur la gestion des données et sur la maintenance.

Vous recherchez des compétences en ASP.Net ? Nos équipes restent également à votre écoute, n’hésitez pas à nous contacter dès aujourd’hui.

 

Article proposé par

Aymeric Ferrero
Développeur C#