Devrais-je utiliser AngularJS et ASP.NET MVC?

58

J'ai commencé à apprendre AngularJS et ASP.NET MVC, mais je ne sais pas pourquoi les utiliser ensemble dans le même projet?

Ne sont-ils pas les deux frameworks MVC? Devrais-je les utiliser tous les deux dans la même application? N'est-ce pas l'un ou l'autre?

Natalie
la source

Réponses:

74

Si vous construisez une application à page unique (SPA) , vous n'avez probablement pas besoin du "MVC" dans ASP.NET MVC . Les vues, en particulier les vues dynamiques, sont probablement livrées / manipulées côté client. Poignées angulaires que très bien.

Mais peut-être que vous ne voulez pas un spa à 100%. Alors quoi? Imaginez au lieu de cela 10 pages, mais 10 pages trèsdynamique. Une fois qu'un utilisateur s'est connecté, un petit badge apparaît dans le coin droit. Ce n'est pas dynamique. Il montre simplement quelques choses astucieuses comme le "score" de l'utilisateur et son dernier selfie. Vous cachez les choses astucieuses afin qu'elles puissent être facilement récupérées. Maintenant, vous pouvez aller de deux manières avec cela. Si vous êtes un puriste MVC côté client, vous récupérez simplement les données de badge une fois la charge HTML initiale livrée, comme pour toutes les autres données. Mais peut-être que vous n'êtes pas un puriste. Peut-être que vous êtes le contraire d'un puriste. Peut-être que vous êtes un impuriste. Par conséquent, au lieu de fournir le code HTML initial, livrez du code JavaScript qui sera publié sur votre serveur, puis envoyé via JavaScript pour récupérer les données de badge, puis fusionner ces données dans une vue via MVC côté client,cela comme votre HTML initial. Une fois que votre code HTML initial a été livré, vous continuez avec vos ébats MVC typiques côté client.

Alors ... MVC sur le serveur et sur le client n'est qu'un moyen pratique d'organiser du code qui était un désastre en 2001. Vous n'avez pas à choisir l'un ou l'autre. Vous pouvez choisir les deux. Certes, plus vous en ferez après la livraison de ce code HTML initial, moins vous aurez besoin de MVC côté serveur. Pourtant, il est là pour vous si vous en avez besoin. Par exemple, j'ai travaillé sur une application ASP.NET MVC / Angular dans laquelle les modèles angulaires externes pouvaient être réellement .NET MVC ActionResult. Cela signifie que votre contrôleur de serveur pourrait fusionner des données dans sa vue, les transmettre à Angular en tant que modèle et que le contrôleur d'Angular pourrait alors fusionner ses données dans la vue. Je ne dis pas que c'est une bonne idée, mais cela montre simplement qu'une forme de MVC ne rend pas l'autre obsolète.

En outre, quelle que soit la manière dont vous déployez Angular, vous aurez besoin d’un moyen de fournir le code HTML initial, les modèles et, plus important encore, les données. Pourquoi ne pas utiliser une plateforme qui facilite les choses? Il y en a beaucoup, mais .NET MVC n'est pas en reste. Comme je l'ai dit, vous pouvez associer les modèles HTML et angulaires externes initiaux au résultat d'une action MVC, mais vous pouvez également utiliser l' API Web de .NET pour fournir les données. L'API Web est aussi délicieuse que la compote d'abricot.

Résumé: MVC est juste un motif. Vous souhaiterez peut-être utiliser ce modèle sur un nombre quelconque de couches physiques. Il ne peut pas être utilisé. Utilisez-le librement si cela a du sens. En outre, Angular n’est peut-être pas de toute façon MVC (ainsi que le disent les personnes qui s’intéressent à ce sujet), alors n'hésitez pas à l’utiliser avec un outil qui porte le nom "MVC". Enfer, même si c'est MVC, mélangez et faites correspondre comme vous le souhaitez.

Scant Roger
la source
3
Réponse étonnante. Merci beaucoup pour votre explication +1
Natalie
Pouvez-vous me dire, par exemple, si une API Web me fournit des données et que je souhaite afficher ces données dans une grille, est-ce que je fais la création de boucles et de modèles en utilisant Angular ou MVC? Est-ce que j'appelle le service de l'API Web en utilisant comment? Comment décidez-vous dès le début du projet dans quelle direction vous allez aller?
Natalie
1
@ Natalie Si les données proviennent de l'API Web, vous allez probablement les récupérer côté client. Cela signifie que vous êtes contraignant en mode angulaire et non en .NET MVC. Vous ne faites pas explicitement la boucle. Vous liez les données à votre grille / table en utilisant ngRepeat . Pour récupérer les données, vous utiliserez probablement le module $ http et appelez votre point de terminaison API Web. Quant à décider quelle approche utiliser, c'est bizarre. Il n'y a pas de réponse en noir et blanc. Vous devez expérimenter, évaluer et suivre votre instinct.
Scant Roger
... un mot de prudence. Si vous n'avez encore jamais utilisé de framework JavaScript angulaire ou autre, vous devrez passer de longues heures à apprendre les ficelles du métier. Ils ne sont pas nécessairement simples. Je peux cependant vous assurer qu'ils vous facilitent la vie à long terme. Travailler dur. S'en tenir à cela. Vous ferez bien.
Scant Roger
1
@ScantRoger Je m'excuse, mais votre réponse n'a pas clarifié les choses pour moi. Si j'utilise un framework côté serveur MVC, où la vue est agnostique, comment puis-je associer Angular à celui-ci? Le serveur (l'API Web) contient déjà les définitions de modèle et de contrôleur. Donc, si j'utilise Angular, on m'impose à nouveau MVC. Alors finit-il par être MCVCM ...? (Définitions des modèles et des contrôleurs côté client et côté serveur) Ou est-ce la raison pour laquelle je ne devrais pas utiliser un framework MVC côté client, tel que Angular, si j'utilise déjà un framework MVC pour mon API Web
Abdul
17

ASP.NET MVC est une infrastructure côté serveur. peu importe les bibliothèques JavaScript que vous utilisez. AngularJS est une bibliothèque côté client, peu importe la technologie utilisée par le serveur pour alimenter le site Web: il peut s'agir de Python, ASP.NET MVC, ou même du vieil ensemble de fichiers HTML statiques stockés directement sur le disque.

ASP.NET MVC et AngularJS sont compatibles, et de nombreux projets les utilisent ensemble.

Avez-vous besoin d'utiliser les deux? Pas vraiment. Cela dépend entièrement des besoins de votre projet.

  • Si votre site Web est dynamique, vous devez utiliser des scripts côté serveur. Vous pouvez utiliser ASP.NET et le fait que vous utilisez AngularJS ne rendra pas votre code côté serveur plus MVC. Si vous souhaitez pouvoir structurer votre application côté serveur en tant que MVC, choisissez plutôt ASP.NET MVC.

  • De même, le fait que vous utilisiez ASP.NET MVC n'implique en rien la structure de votre code côté client. Vous pouvez mettre tout votre code JavaScript dans un seul fichier sans vous soucier de la structure et en être heureux (jusqu'à ce que le projet commence à se développer) Là encore, AngularJS se présente comme un moyen de structurer votre application côté client.


Note annexe: vous avez tagué votre question ASP.NET MVC 3. Sauf s'il s'agit d'un projet hérité que vous devez gérer ou que vous avez des contraintes spécifiques lors de l'hébergement de l'application sur des serveurs hérités qui n'ont pas été mis à jour depuis quatre ans, vous pouvez utiliser ASP. .NET MVC 4 ou 5 à la place.

Arseni Mourzenko
la source
1
merci MainMa. Je suis conscient que AngularJS est côté client et MVC est côté serveur. Je suis également conscient du fait que d’autres bibliothèques telles que le guidon, knockoutjs peuvent être utilisées dans MVC.NET et Angular peuvent être utilisées dans les applications php, java. Ce que je demande, c'est pourquoi utiliser les deux ensemble, car ils font tous deux la même chose, à savoir "MVC", mais l'un est côté client et l'autre côté serveur. Pourquoi mélanger les frameworks MVC côté client et côté serveur? Ne pouvons-nous pas faire une application qui est seulement une application angulaire? Ou une application qui n'est que l'application MVC.net?
Natalie
@ Nathalie: je vois. J'ai édité la réponse pour fournir plus d'informations à ce sujet. Une réponse brève est que vous mélangez ces deux cadres dans des projets où il est logique d’avoir une structure spécifique à la fois du serveur et du client.
Arseni Mourzenko
Pouvez-vous me dire, par exemple, si une API Web me fournit des données et que je souhaite afficher ces données dans une grille, est-ce que je fais la création de boucles et de modèles en utilisant Angular ou MVC? Est-ce que j'appelle le service de l'API Web en utilisant comment? Comment décidez-vous dès le début du projet dans quelle direction vous allez aller?
Natalie
J'ai les mêmes questions dans mon esprit. Je ne pouvais pas trouver de raison d'utiliser asp.net MVC. Je veux dire que cela ressemble à l'API Web Asp.net côté serveur et à Angular côté client suffiraient. Mais j'ai pensé d'abord; API Web = couche d'accès aux données, Asp.Net MVC = couche de logique métier, angulaire = couche d'interface utilisateur. Mais du côté angulaire, nous ne pouvons faire que des appels d’API Web, nous ne pouvons donc pas utiliser le côté serveur Asp.Net MVC. Je pense que nous avons besoin d'un bon exemple pour lequel nous pourrions avoir besoin d'utiliser Asp.Net MVC.
Salim
9

Si vous utilisez visual studio, un nouveau modèle de site Web MVC pour «application à page unique» inclut des contrôleurs angulaires et MVC Web Api.

Cela fonctionne bien car votre code côté serveur MVC fournit des points de terminaison json pour le code client angulaire à appeler.

De plus, vous pouvez utiliser les contrôleurs MVC pour afficher la ou les vues HTML de base pour votre application à page unique. cela vous donne la puissance de la génération côté serveur, des autorisations, des redirections, du traitement des erreurs, etc.

Vous voudrez souvent une petite quantité de HTML / javascript générée par le serveur, même sur une application à une seule page, des choses telles que les URL de points de terminaison pour différents environnements, différentes langues ou même la page d'authentification étrange, qui peut simplement être plus facile à utiliser côté serveur.

Ewan
la source
1
Lors de la création du modèle SPA standard dans VS 2015 CE, je vois bootstrap, jquery, knockout, répondre et sammy dans le dossier de script, mais pas angulaire. Est-ce que je manque quelque chose?
TK-421
2

Trois ans plus tard, utilisez l’API Web ASP.NET pour servir vos données et Angular (js ou plus récent) pour structurer votre application côté client. Si vous créez un site statique, utilisez simplement ASP.NET MVC.

utilisateur441521
la source