你的位置:首页 > ASP.net教程

[ASP.net教程]使用ASP.NET 5开发AngularJS应用


今天推荐的是一个系列文章,讲述了如何使用ASP.NET 5来开发AngularJS应用,一共7篇文章。

在Visual Studio 2015中由于优化了项目结构,优化了前端JS框架的引用方式,所以开发AngularJS这样的应用就更加方便了。

这个讲述如何使用ASP.NET 5来开发AngularJS应用的系列文章,一共分为7篇,分别介绍了:

  1. 配置Grunt、Uglify和AngularJS。大致步骤为。1)如何创建在一个空的Web应用项目中。2)利用NPM来安装Grunt执行器及其任务(grunt-contrib-uglify,grunt-contrib-watch)。3)利用Bower来安装AngularJS的库。4)利用Grunt把自己编写的app文件夹内的js文件合并部署到wwwroot文件夹中。
  2. 使用MVC 6 WEB API。大致步骤为:1)启用MVC 6功能(在project.json文件中添加引用,在Startup文件中调用AddMvc方法。2)创建示例实体模型。3)创建WEB API的Controller。4)使用内置模板创建AngularJS的app(也即Module)。5)创建AngularJS的Controller。6)创建AngularJS的Service来调用WEB API。7)创建AngularJS的视图模板。
  3. 添加客户端路由。大致步骤为:1)添加客户端路由定义。2)重写服务器上的请求路由。3)针对路由修改客户端的AngularJS的Controller。4)创建一个布局视图。5)创建列表、添加、编辑和删除的视图。
  4. 使用Entity Framework 7。之前服务端返回的数据是通过代码动态构建的。现在需要持久保存到数据库中。那么大致步骤是:1)添加EF7的Nuget包。2)创建DbContext。3)在Startup中注册EF服务。4)更新WEB API的Controller来使用DbContext操作数据。5)执行EF7的初始化和数据迁移。
  5. 进行窗体数据的验证。大致步骤为:1)使用AngularJS实现客户端验证。2)更新实体模型,实现服务端验证。3)升级数据库。4)完善WEB API的Controller来考虑数据验证的情况。5)完善AngularJS的Controller来显示服务端返回的验证提示。
  6. 实现安全控制。本篇介绍利用ASP.NET Identity来为不同用户分配不同权限。大致步骤为:1)启用ASP.NET Identity。2)编辑DbContext继承IdentityDbContext。3)强制用户必须登录。4)传递声明数据给AngularJS。5)对WEB API的Controller中的Action进行安全控制(添加Authorize标记)。
  7. 把这个应用跑在Mac上。介绍如何把这么一个ASP.NET 5应用在Mac上运行成功。大致步骤为:1)安装Mono。2)利用Homebrew安装KVM。3)在Mac上通过Git克隆代码。4)利用Sublime Text来打开并编辑代码。5)由于Mac上没有SQL Server,所以使用EF7的In-Memory provider来模拟一个内存中的数据库。当然也可以采用SQLite或者远程数据库服务器。6)使用Kestrel来替代IIS承载应用。7)运行之前恢复所有需要的Nuget包。8)如何启动和停止Kestrel。

这个系列文件不仅是一个ASP.NET 5开发的入门向导,也是一个AngularJS开发练习,还是一个ASP.NET 5跨平台运行的指导。

第一篇文章的原文地址是:http://stephenwalther.com/archive/2015/01/12/asp-net-5-and-angularjs-part-1-configuring-grunt-uglify-and-angularjs