使用ASP.NET MVC和AngularJS的Web模块化管理

快速浏览标题便了解到本文要谈到公开资源平台,该平台允许快速,轻松地创建一个管理网络,并不需要在风格,导航,解决方案架构和其它跟主要任务无关的琐事上花费过多的时间。

平台视觉图和其中一块模板:(见附图一)

很长一段时间里,我们使用WPF技术模块化管理应用。我们做出的决定是将此管理迁移到网站中。最后我们得出了2个不同的产品:第一个:平台,就是这篇文章致力于介绍的,第二个是用于电子商务应用程序开发使用的集合模块。

技术运用于:(见附图二)

我们决定使用这些技术都是我们广泛应用微软产品的经验结果。

我们使用以下的技术:

·        ASP.NET MVC 5.0 -作为一个网络托管技术

·        ASP.NET Web API 2.0-去实施REST服务

·        Entity Framework 6.0 – ORM

·        EF Migrations -以便管理数据库模式的更改和数据

·        ASP.NET Identity -授权和认证任务

AngularJS –主要针对SPA 的用户界面。挑选它的主要依据之一是因为它的普及性和文件质量。我们之前虽然没有过应用AngularJS方面的工作经验。但一路回首,我们从未对这个选择有过任何遗憾。

Architecture 

平台和模块都采用DDD,SOLID,TestDriven Development(TDD)。从表面看,我们在使用MVVM(非常感谢AngularJS-从WPF的过渡到现在都没有出现过任何并发症)

Platform Capabilities

现在让我们看一下平台兼容性的核心列表。理解这个列表包含平台兼容性是很重要的,因为它不仅仅是电子商务应用的一个附加功能。

风格指南(见附图三)

我们使用MCSS系统方法的应用创造了我们自己的主题。我们还创建了一个风格元素指南和用于元素导航的视觉构造,允许您轻松地创建一段HTML源码,以此用来扩展模块。

Navigation

在这里,我们针对用户界面提出了一个统一的导航用户界面概念。我们非常喜欢应用于新portal.azure.com中水平滚动页面导航的想法,于是我们决定把它作为一个基点。

主要的导航元素是:

·        “blade”-传统界面的模拟窗口

·        “widget容器包含widget

·        “main menu” -针对所有模块的全局导航菜单

 Modularity

平台在运行安装扩展模块时允许系统功能扩展。鉴于每个模块都可以提供自己的用户界面和REST API服务,所以该平台可以被定制用于服务许多特殊的商业需求。

模块化是我们遇到的最困难的问题之一。为了解决这个问题,我们不得不从WPF中采用微软PRISM,并且使它在ASP.NETMVC中可以正常运行。模块包含了使用版本和依附关系的信息,这些信息常在系统在模块初始化和安装过程中有被使用。

除了扩张用户界面和API ,每个模板可以用自己的数据库模式并且支持在版本更新过程中的数据迁移。它们也可以通过loC和依赖注入来扩展或覆盖其他模块的功能。

我们就不一一列出所有用户界面的扩展点啦,这只是其中的一小部分:主菜单,工具栏,窗口,通知等。

其它有用的信息

·        授权和认证联合认证兼容-使用微软ASP.NETIdentity。

·        Managing users and permissions -我们自己的执行并且准备使用UI。

·        Working with binary data (files) -扩展系统提供API上传文件到本地磁盘存储,网络存储或azureblob存储。可以扩展用来使用任何类型的存储服务。

·        背景工作调度-使用延时库来实现,是一个很灵活的功能体系,为监测工作提供自己的接口。

·        动态设置系统-允许声明性设置,并提供标准管理界面和API代码使用。

·        动态特性系统-允许使用UI 或代码来动态扩展任何用户对象的新属性。

·        贮藏-使用缓存服务来优化和提升缓存能力   (AppFabric, WEB Cache, memcache等.)

·        基于模板的通知系统-定义通知类型,编辑模板,支持本地化,规划,日志。支持包括电子邮件、短信等多种不同的通知渠道。

·        统一的输出/输入系统模块-统一的用户界面和数据格式的实际执行模块。

它不仅仅是一颗银色的“***”,而且还…

因此,我们最终拥有了一个相当好的系统,它允许有经验的开发人员针对复杂的项目快速创建一个管理网站,或者使用它作为一个指南来创建独一无二的系统。

·        更多关于平台的信息可以点击:http://docs.virtocommerce.com/display/vc2devguide/Working+with+Platform.

·        您可以看到,使用该平台创造一个电子商务产品的真实例子:VirtoCommerce online demo (frontend and admin).

·        项目本身就坐落在此:https://github.com/VirtoCommerce/vc-community. 项目正在积极发展中,所以所有的意见,反馈和要求将得到高度赞赏。

许可证

在该文中提及的相关源代码和文件,都是由CPOL授权许可的

关于作者:

Alexander Siniouguine

职业:软件构架师

国籍:美国

高级软件构架师。作者已经自主设计了几款网络产品,这些产品被世界上著名的网络公司所运用

阅读我最近的文章:

Checkout my latest article: http://www.codeproject.com/Articles/1013731/Modular-WEB-Admin-Using-ASP-NET-MVC-and-AngularJS

http://virtocommerce.com/

原文摘自:http://www.codeproject.com/Articles/1013731/Modular-WEB-Admin-Using-ASP-NET-MVC-and-AngularJS

PS:本文是小博主的呕心沥血译文,一直对Alexander Siniouguine这位有着20年IT行业经验精英有着十分崇敬之情,之前也读过他的文章,对他的独特眼光和对行业领域独到的见解感到钦佩,该篇 “使用ASP.NET MVC和AngularJS的Web模块化管理"我觉得也是行业领域的创新之作吧,与大家共享共勉哦!

时间: 2024-07-31 02:23:51

使用ASP.NET MVC和AngularJS的Web模块化管理的相关文章

ASP.NET MVC+EF框架+EasyUI实现权限管理系列

http://www.cnblogs.com/hanyinglong/archive/2013/03/22/2976478.html ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开篇 前言:博客又有一段时间没有更新了,心里感觉这段时间空空的,好像什么都没有学下,所以就想写博客,所以就有了这个系列,这里当然也要感谢大家了,因这个 项目我已经上传了,得到了很多网友的评价,也有好多人发邮件给我说这个框架容易出现问题,不能访问,这也是支持我写这个系列的动力,我将这个项目写成一个 系列

ASP.NET MVC+EF框架+EasyUI实现权限管理

4.为什么使用MVC而不是用WebForm呢? (1)为什么使用MVC而不是用WebForm呢?这个是我临时想的,因为我就是想说明一下WebForm和MVC的优缺点,来可以使大家能够更好地理解 MVC和WebForm,而不像某些人说MVC会替代WebForm,我个人认为这个可能性很小,因为各有各的好处,看在哪里使用吧,下面我就简单介绍下 WebForm和MVC的优缺点. (2)WebForm介绍 1)优点 1):支持事件模型,取决于微软提供了丰富的服务器端组建,WebForm可以快速的搭建Web

ASP.NET MVC+EF框架+EasyUI实现权限管理系列(5)-前台JqueryEasyUI前台实现

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(5)-前台JqueryEasyUI前台实现 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据库访问层的设计Demo    (3):面向接口编程   (4 ):业务逻辑层的封装 前言:今天经理买了一个诺基亚的Windows Phone 8系统,特感兴趣,所以在哪里看了很长时间,这篇文章就写的有点迟, 从这个Demo开始到现在我已经写了4篇博客了,终于可以看到页面的东

ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开篇

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列之开篇 前言:博客又有一段时间没有更新了,心里感觉这段时间空空的,好像什么都没有学下,所以就想写博客,所以就有了这个系列,这里当然也要感谢大家了,因这个项目我已经上传了,得到了很多网友的评价,也有好多人发邮件给我说这个框架容易出现问题,不能访问,这也是支持我写这个系列的动力,我将这个项目写成一个系列,可能要很长时间吧,但是我肯定会一直坚持,如果我哪里写的不好欢迎大家指出我们共同学习,而且我理解的也不是很透彻,所以我想在写这样一遍

在ASP.NET MVC中使用区域来方便管理controller和view

在ASP.NET MVC中使用区域来方便管理controller和view 在mvc架构中,一般在controllers和views中写所有控制器和视图, 太多控制器时候,为了方便管理,想要将关于person的所有控制器放在一个文件夹里面,这样就容易查看和管理. 这时候在WEB下面创建一个Areas文件夹.(和Controllsers文件夹同级) 然后在Areas里面右键选择新建区域. 会自动创建一个路由信息,和web.comfig还有controllers文件夹等. 这时候就可以很清晰的管理和

ASP.NET MVC+EF框架+EasyUI实现权限管理系列(4)-业务逻辑层的封装

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(4)-业务逻辑层的封装 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据库访问层的设计Demo    (3):面向接口编程 前言:前面几篇博客我们基本已经介绍完了搭建整个项目和数据库访问层以及一些业务逻辑层的实现,当然了,我们的数据库访问层这样还是可以在进行封装的,但是我到这里就行了吧,项目也不大,不需要那么麻烦的,那么我们今天开始介绍我们需要介绍的内容,那就是我

ASP.NET MVC+EF框架+EasyUI实现权限管理系列(2)-数据库访问层的设计Demo

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(2)-数据库访问层的设计Demo ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇) (1)框架搭建 前言:这篇博客我们继续来实现我的权限系列,这个博客一段时间也没有写了,重点是我在想还写不写,最终我决定还是写下去,因为我们是为了学习,当别人提出意见的时候,我们可以参考和采纳,但是我们不一定非要采纳,上几篇博客大家都说用CodeFirst来实现,是啊,现在基本很少有人用我的这种方法来实现了,都是用CodeF

ASP.NET MVC+EF框架+EasyUI实现权限管理系列(1)-框架搭建

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(1)-框架搭建 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇) 前言:这篇博客开始我们便一步一步的来实现这个权限系统的初步设计-框架搭建,首先我要说的是我们需要开发工具Visual Studio 2012或者10也行,其次是我们要有SQL Server数据库,如果是Visual Studio 2010的话,你还要安装MVC4的开发文件,这个是吗?我不记得了,谁可以回答我一下的,我一直用2012,都是集成

ASP.NET MVC+EF框架+EasyUI实现权限管理系列(6)- EF上下文实例管理

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(6)- EF上下文实例管理 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据库访问层的设计Demo    (3):面向接口编程   (4 ):业务逻辑层的封装  (5):前台Jquery easyUI实现 前言:通过前面的五篇博客我们已经对权限系统的后台架构进行了详细的说明,那么我再前面的博客中也说到了我们的后台架构还会再改的,我准备这段时间我们继续完善我们的后台