欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

AngularJS Web 模块化开发

程序员文章站 2022-05-30 12:02:21
...
  在这个信息化时代,谁掌握最新资讯,谁就快人一步,我跟大家分享美国著名构架设计师
Alexander Siniouguine 的最新热作:"搞定Web模块化管理最新招"    该文在美国点击量日过万啦 ,IT 福音哦!是不是有小鹿乱撞的感觉呀?
快速浏览标题便了解到本文要谈到公开资源平台,该平台允许快速,轻松地创建一个管理网络,并不需要在风格,导航,解决方案架构和其它跟主要任务无关的琐事上花费过多的时间。
平台视觉图和其中一块模板:
AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
很长一段时间里,我们使用WPF技术模块化管理应用。我们做出的决定是将此管理迁移到网站中。最后我们得出了2个不同的产品:第一个:平台,就是这篇文章致力于介绍的 ,第二个是用于电子商务应用程序开发使用的集合模块。
技术运用于

AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
我们决定使用这些技术都是我们广泛应用微软产品的经验结果。
我们使用以下的技术:
• 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,Test Driven Development(TDD)。从表面看,我们在使用MVVM(非常感谢AngularJS-从WPF的过渡到现在都没有出现过任何并发症)


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

AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
我们使用MCSS系统方法的应用创造了我们自己的主题。我们还创建了一个风格元素指南和用于元素导航的视觉构造,允许您轻松地创建一段HTML源码,以此用来扩展模块。
Navigation

AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
在这里,我们针对用户界面提出了一个统一的导航用户界面概念。我们非常喜欢应用于新portal.azure.com中水平滚动页面导航的想法,于是我们决定把它作为一个基点。
主要的导航元素是:
• “blade”-传统界面的模拟窗口
• “widget容器包含widget
• “main menu” -针对所有模块的全局导航菜单

Modularity

AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
平台在运行安装扩展模块时允许系统功能扩展。鉴于每个模块都可以提供自己的用户界面和REST API服务,所以该平台可以被定制用于服务许多特殊的商业需求。
模块化是我们遇到的最困难的问题之一。为了解决这个问题,我们不得不从WPF中采用微软PRISM,并且使它在ASP.NET MVC中可以正常运行。模块包含了使用版本和依附关系的信息,这些信息常在系统在模块初始化和安装过程中有被使用 。
除了扩张用户 界面和API ,每个模板可以用自己的数据库模式并且支持在版本更新过程中的数据迁移。它们也可以通过loC和依赖注入来扩展或覆盖其他模块的功能。
我们就不一一列出所有用户界面的扩展点啦,这只是其中的一小部分:主菜单,工具栏,窗口,通知等。

其它有用的信息
• 授权和认证联合认证兼容-使用微软ASP.NET Identity。
• 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. 
• 您可以看到,使用该平台创造一个电子商务产品的真实例子:Virto Commerce 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模块化管理"我觉得也是行业领域的创新之作吧,与大家共享共勉哦





  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 80.4 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 214.8 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 69.9 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 117.6 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 128.1 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 80.4 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 214.8 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 69.9 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 117.6 KB
  • AngularJS Web 模块化开发
            
    
    博客分类: 架构设计类 架构web SPAangularjs电子商务mvc 
  • 大小: 128.1 KB