AngularJS : architecture et bonnes pratiques

Un document que je ne saurai trop recommander pour les développeurs désireux de connaitre les bonnes pratiques sous AngularJS : https://docs.google.com/document/d/1XXMvReO8-Awi1EZXAXS4PzDzdNvV6pGcuaF4Q9821Es/

C’est rempli de bonnes idées pour présenter sa solution, ainsi que sur les bonnes pratiques comme le nommage etc.

Architecture par fichier, répertoire ou bien modulaire ?

On a souvent l’habitude de voir des exemples d’applications AngularJS qui sont architecturés par ce que l’on appelle le « file pattern »:

AngularArchi02

 

L’ensemble des contrôleurs directives, services etc sont regroupés dans des fichiers.

Le problème avec cette approche, c’est qu’en terme d’évolution, on pourra vite se trouver avec des fichiers JS de taille importante… Imaginez que l’on ai une vingtaine de directives dans un même fichier ! Pour retrouver une directive spécifique il faudra prendre du temps pour scroller et la chercher…

Afin d’éviter cela, on préférera une architecture modulaire ou par features. Dans laquelle un ensemble de contrôleurs vues, services et directives seront répertoriées.

AngularArchi01
Dans cet exemple nous avons deux modules « bar » et « foo » qui ont des services et directives distincts. On préconise en général : 1 controlleur = 1 fichier .js etc
L’idéal ensuite est de créer un répertoire dans chaque module par type (Filters, Controllers, Directives, Partials etc.) afin d’avoir un classement des fichiers clair et lisible.

Il existe une démo qui applique de façon correcte ce pattern : https://github.com/angular-app/angular-app

Partagez:

Créer une application WPF avec MVVM

Pour commencer cet article, je vais faire une brève présentation du design pattern MVVM (Model View ViewModel) :

C’est une méthode d’architecture logicielle qui est une variation du design pattern MVC (Model View Controller), consistant à séparer les différentes couches entre développeur et designer. Le terme designer sera ici la personne plutôt chargée de l’aspect graphique et de la réalisation de l’interface utilisateur (au sein du XAML via des outils comme Expression Blend).
Les différentes parties étant bien distinctes, cela facilitera le travail en équipe sur un même projet. Surtout si l’on travaille avec TFS et que plusieurs personnes ont besoin de passer en checkout un fichier pour le modifier, ca risque de coincer 🙂

Schématisons ces différentes parties

Exemple de création d’une application WPF simple se basant sur MVVM

Continuer la lecture de Créer une application WPF avec MVVM

Partagez: