10 thay đổi trong ASP.NET 5 và MVC 6 với MVC5 ASP.NET 4.6

Sự kiện Visual Studio 2015 vừa ra mắt bản chính thức vào ngày 29/07/2015 và đi kèm theo đó là phiên bản ASP.NET 5 và MVC 6. Trong bài viết này chúng ta cùng nhau điểm danh, liệt kê ra 10 tính năng thay đổi mà ASP.NET 5 và MVC 6 mang đến cho các nhà phát triển.

Tại bài viết này bạn sẽ thấy sự khác biệt giữa các mô hình MVC 5 và bản cũ cũng như asp.net 4.6 khác với MVC 6, asp.net 5 như thế nào?

1. ASP.NET trên OSX và Linux

​

Lần đầu tiên trong lịch sử ASP.NET bạn có thể chạy một ứng dụng ASP.NET 5 trên hệ điều hành OSX và Linux đây là sự thay đổi lớn nhất trong ASP.NET. Với ứng dụng ASP.NET 5 có thể chạy trên cả ba môi trường đó là Windows, OSX và Linux. Thực tế điều này giúp cho ASP.NET mở ra và hướng đến những đối tượng mới đó là các nhà lập trình viên và thiết kế .

Những đối tượng truyền thống của ASP.NET đó chính là những lập trình viên chuyên nghiệp làm việc trong những tập đoàn. Và những khách hàng là doanh nghiệp họ thường bị gắn chặt vào những cổ máy chạy hệ điều hành Windows.

Những dự án Startup mới thường đi theo chiều ngược lại đó là họ hướng đến việc sử dụng OSX/Linux cho những dự án của mình. Bất kỳ khi nào mà tôi tham gia vào một hội nghị về Startup thì điều tôi thấy duy nhất chính là đa số họ đều sử dụng những chiếc Macbook Pro. Những người này đều không phải là những người dùng truyền thống của ASP.NET.

Ngoài ra những nhân viên thiết kế và phát triển front-end, khi họ ra bên ngoài hoạt động họ thường có khuynh hướng sử dụng những chiếc Macbook Pro hơn là sử dụng các công cụ trên Windows. Bất kỳ khi nào mà tôi tham gia vào một hội nghị về JQuey thì tôi luôn thấy những chiếc Macbook Pro xuất hiện mọi nơi (hình bên dưới này là từ một blog về JQuery).

​

ASP.NET 5 chạy trên Windows, OSX và Linux đã làm thay đổi mọi thứ. Đây là lần đầu tiên, tất cả những lập trình viên và người thiết kế có thể bắt đầu xây dựng những ứng dụng ASP.NET 5. Và họ có thể sử dụng những môi trường phát triển ưa thích của họ như là Sublime Text và WebStorm khi làm việc với những ứng dụng ASP.NET (Không yêu cầu Visual Studio).

Hãy xem dự án OminiSharp để thấy bạn có thể sử dụng những chương trình biên soạn mã như là Sublime Text, Atom, Emacs và Brackets với ASP.NET 5 như thế nào.

http://www.omnisharp.net

2. Không còn Web Forms

​

Tôi yêu ASP.NET Web Forms. Và tôi đã trải qua hàng ngàn mà nếu không phải là hàng ngàn thì rất là nhiều giờ trong cuộc đời của tôi để mà xây dựng những ứng dụng bằng Web Forms. Tuy nhiên, đây là thời điểm cuối cùng để nói lời tạm biệt. ASP.NET Web Forms không phải là một phần của ASP.NET 5.

Bạn có thể tiếp tục xây dựng ứng dụng bằng Web Forms với Visual Studio 2015 với .NET Framework 4.6. Tuy nhiên, những ứng dụng Web Forms sẽ không được thừa hưởng những tính năng mới tuyệt vời của ASP.NET 5 như đã được miêu tả trong danh sách này. Nếu mà bạn không muốn bị bỏ lại phía sau trong khi lịch sử tiến về phía trước thì bây giờ là thời điểm để bạn viết lại ứng dụng Web Forms của bạn thành ASP.NET MVC.

3. Không còn Visual Basic

​

Đây cũng là lúc để nói lời tạm biệt với Visual Basic. ASP.NET 5 chỉ hỗ trợ C# còn Visual Basic bây giờ đã là quá khứ.

Hy vọng của tôi rằng với thay đổi này sẽ không quá khó chịu. Tôi tin rằng chỉ có hai người trên toàn thế giới này xây dựng ứng dụng MVC bằng Visual Basic. Đây là lúc các bạn phải dừng lại. Có nhiều công cụ giúp bạn trong việc chuyển đổi từ Visual Basic sang C#.

http://converter.telerik.com

4. Tag Helpers

Tag Helper là một trong những điểm nổi bật, nó có tác động mạnh đến cách mà bạn tạo ra những cái view trong một ứng dụng ASP.NET MVC. Tag Helper là một sự lựa chọn tốt hơn so với việc sử dụng MVC helper truyền thống trước đây.

Xem xét view MVC dưới đây nó chứa đựng một cái form cho việc tạo một sản phẩm mới:

Mã:

@model MyProject.Models.Product
@using (Html.BeginForm())
{
    <div>
        @Html.LabelFor(m => p.Name, "Name:")
        @Html.TextBoxFor(m => p.Name)
    </div>
    <input type="submit" value="Create" />
}

Trong view ở bên trên, Html.BeginForm(), Html.LabelFor() và Html.TextBoxFor() helper đã được dùng để tạo ra một cái form. Nhưng những thẻ helper này sẽ không thân thiện với những nhà thiết kế HTML.

Chính vì sự bất tiện và khó chịu giữa code asp.net trong code HTML này mà asp-Tag-Helper được ra đời.

Sau đây là 1 ví dụ tạo form bằng việc sử dụng Tag Helpers:

Mã:

@model MyProject.Models.Product
@addtaghelper "Microsoft.AspNet.Mvc.TagHelpers"
<form asp-controller="Products" asp-action="Create" method="post">
    <div>
        <label asp-for="Name">Name:</label>
        <input asp-for="Name" />
    </div>
    <input type="submit" value="Save" />
</form>

Chú ý rằng ở phiên bản mới này form chỉ chứa đựng duy nhât (những gì giống như) là những phần tử HTML. Cho ví dụ, form này chứa đựng một phần tử INPUT thay thế cho Html.TextBoxFor(). Một nhà thiết kế front-end sẽ làm việc tốt hơn với những trang như thế này.

Điều đặc biệt duy nhất về cái view này đó là thuộc tính asp-for. Những thuộc tính này được sử dụng dành cho những phần tử có chức năng từ phía server-side của ASP.NET MVC.

Bạn có thể xem qua ví dụ của Damien Edwards về việc sử dụng Tag Helpers ở link bên dưới:

http://converter.telerik.com

5. View Components

Tạm biệt subcontrollers và xin chào View Components!

Trong những phiên bản trước đây của ASP.NET MVC, bạn đã sử dụng Html.Action() để gọi đến một cái subcontroller. Ví dụ bạn tưởng tượng bạn muốn hiển thị một banner quảng cáo trên nhiều view. Trong trường hợp đó, bạn sẽ tạo subcontroller cái mà chứa những xử lý logic cho việc trả về một banner quảng cáo cụ thể và gọi đến subcontroller bằng cách thông qua Html.Action() từ một cái view nào đó.

Subcontroller – Html.Action() không có trong bản beta hiện tại của MVC 6. Thay vào đó MVC 6 sẽ thay đổi bằng công nghệ khác được gọi là View Components.

Ví dụ bên dưới cho bạn thấy việc tạo một View Component để hiển thị một hoặc hai banner quảng cáo phụ thuộc vào thời gian trong ngày.

Mã:

using Microsoft.AspNet.Mvc;
using System;
namespace Partials.Components
{
    public class BannerAd : ViewComponent
    {
        public IViewComponentResult Invoke()
        {
            var adText = "Buy more coffee!";
            if (DateTime.Now.Hour > 17)
            {
                adText = "Buy more warm milk!";
            }
            return View("_Advertisement", adText);
        }
    }
}

Nếu thời gian mà trước 5:00 chiều thì View Compenent trả về một partial tên là _Advertisement với nội dung quảng cáo là “Buy more coffee!”. Nếu mà sau 5:00 chiều thì nội dung quảng cáo sẽ thay đổi là “Buy more warm milk!”.

Partial _Advertisement sẽ trong như sau:

Mã:

@model string
<div style="border:2px solid green;padding:15px">
    @Model
</div>

Cuối cùng bạn có thể sử dụng BannerAd View Component trong view MVC như sau:

Mã:

@Component.Invoke("BannerAd")

View Component tương như như là subcontroller. Tuy nhiên, subcontroller luôn có gì đó hơi kỳ quặc. Nhìn thì có vẻ chúng tương tự với action của Controller nhưng thực tế nó không phải như vậy. Gọi là View Component dường như có vẻ chính xác hơn và tự nhiên hơn.

6. Hỗ trợ GruntJS, NPM và Bower

​

Trước đây khi public web lên hosting, chúng ta sử dụng một số công cụ kiểm tra tốc độ website đạt chuẩn google thường bị vướng lại lỗi về nén javascript, css chưa đạt chuẩn. Để loại bỏ lỗi này chúng ta phải sử dụng GruntJS để nén dữ liệu này khá phức tạp.

Với ASP.NET 5 đã được thích hợp sẵn GruntJS khi cần gọi rất dễ dàng. (và cuối cùng là Glup).

GruntJS là một task runner nó cho phép bạn xây dựng ngồn front-end như là JavaScript và file CSS. Ví dụ, bạn có thể sử dụng GruntJS để kết nối vào nhau thành một và làm nhỏ đi file JavaScript của bạn, bất kỳ khi nào mà bạn thực hiện việc build trong Visual Studio.

Có hàng ngàn plugin của GruntJS cho phép bạn làm nhiều điều tuyệt vời bằng những task khác nhau (hiện tại có 4,334 plugin được liệt kê ra trong repository của GruntJS plugin):

http://gruntjs.com/plugins

Ví dụ, có nhiều plugin cho việc chạy unit test của JavaScript, kiểm tra chất lượng mã JavaScript của bạn (jshint), biên dịch những file LESS và Sass thành CSS, biên dịch TypeScript thành JavaScript, và giảm bớt hình ảnh.

Để hỗ trợ GruntJS, Microsoft cần hỗ trợ hai bộ quản lý package mới (ngoài Nuget). Đầu tiền, plugin GruntJS được phân phối như là NPM packages, Microsoft đã thêm những hỗ trợ cho NPM package.

Thứ hai, bởi vì có nhiều nguồn client-side như là Twitter Bootstrap, JQuery, Polymer và AngularJS đã được phân phối thông qua Bower nên Microsoft đã thêm vào việc hỗ trợ cho Bower.

Điều này có nghĩa là bạn có thể chạy GruntJS sử dụng plugin từ NPM và client resource từ Bower.

7. Hợp nhất MVC và Web API Controllers

Trong những phiên bản trước của ASP.NET MVC, controller của MVC khác biệt so với controller của Web API. Một controller của MVC được sử dụng bởi lớp cơ sở System.Web.MVC.Controller và một controller của Web API được sử dụng bởi lớp cơ sở System.Web.Http.ApiController.

Trong MVC 6, chỉ có duy nhất một và chỉ một lớp controller là lớp cơ sở cho cả hai MVC và Web API controller. Lớp duy nhất đó là Microsoft.AspNet.Mvc.Controller.

Controller trong MVC 6 trả về một IActionResult. Khi sử dụng như một controller của MVC, IActionResult có thể là một view. Khi sử dụng như là một controller của Web API, IActionResult có thể là dữ liệu (như là một danh sách các sản phẩm). Controller giống nhau có thể có những action trả về cả hai view và data.

Trong MVC 6, cả hai controller của MVC và controller của Web API sử dụng cùng một route giống nhau. Bạn có thể sử dụng cả hai, đó là convention-based route hoặc thuộc tính route và chúng ứng dụng đến tất cả những controller trong project.

8. AngularJS

AngularJS là một trong những framework client-side phổ biến nhất cho việc xây dựng Single Page Applications (SPAs). Visual Studio 2015 đã bao gồm những template phục vụ cho việc tạo module, controller, directive và factory của AngularJS.

​

Việc hỗ trợ GruntJS trong ASP.NET 5 làm cho ASP.NET là một framework server-side xuất sắc cho việc xây dựng những ứng dụng client-side bằng AngularJS. Bạn có thể kết hợp và giảm bớt những cái file của AngularJS một cách tự động bất kỳ khi nào bạn thực hiện việc build. Bạn có thể tương tác với một controller của MVC 6 từ một $resource của AngularJS sử dụng REST.

9. ASP.NET Dependency Injection Framework

ASP.NET 5 đã được xây dựng để hỗ trợ cho việc Dependency Injection và Service Locator pattern. Điều này có nghĩa là bạn không còn cần dựa vào những framework bên thứ ba như là Ninject hoặc Autofac.

Tưởng tượng, ở ví dụ này bạn tạo một lớp interface IRepository và một lớp EFRepository sẽ implement từ lớp interface. Trong trường hợp này, bạn có thể liên kết lớp EFRepository đến lớp IRepository trong phương thức ConfigureService() được viết trong lớp Startup.cs như thế này:

Mã:

services.AddTransient<IRepository, EFRepository>();

Sau đó bạn liên kết EFRepository và IRepository khi ấy bạn có thể sử dụng hàm khởi tạo denpendency injection trong những controller MVC của bạn (và bất kỳ lớp nào khác) sử dụng đoạn mã sau:

Mã:

public class ProductsController : Controller
{
    private IRepository _repo;
    public ProductsController(IRepository repo)
    {
        _repo = repo;
    }
}

Trong đoạn mã trên, interface IRepository đã truyền đến hàm khởi tạo của ProductsController. Việc xây dựng ASP.NET Dependency Injection framework để mà truyền EFRepository đến ProductsController bởi vì IRepository đã liên kết đến EFRepository.

Bạn cũng có thể sử dụng Service Locator pattern. Bất kỳ nơi nào bạn có thể truy cập HttpContext, bạn có thể truy cập đến bất kỳ servicer nào đã được đăng ký. Ví dụ, bạn có thể nhận lại EFRepository bằng cách sử dụng đoạn mã bên dưới vào bên trong một MVC controller action:

Mã:

var repo = this.Context.ApplicationServices.GetRequiredService<IRepository>();

10. xUnit.net

Tạm biệt framework Visual Studio Unit Testing và xin chào xUnit.net!

Trong những phiên bản trước của ASP.NET MVC, mặc định framework về testing là Visual Studio Unit Testing Framework (đôi khi nó được gọi là mstest). Framework này sử dụng những thuộc tính là [TestClass] và [TestMethod] để mô tả một unit test:

Mã:

[TestClass]
public class CalculatorTests {
    [TestMethod]
    public void TestAddNumbers() {
        // Arrange
        var calc = new Calculator();
        // Act
        var result = calc.AddNumbers(0, 0);
        // Assert
        Assert.AreEqual(0, result);
    }
}

ASP.NET 5 sử dụng xUnit.net như là một framework unit test giành cho nó. Framewrok này sử dụng thuộc tính [Fact] thay cho thuộc tính [TestMethod] và không còn thuộc tính [TestClass] nữa:

Mã:

public class CalculatorTests
{
    [Fact]
    public void AddNumbers()
    {
        // Arrange
        var calculator = new Calculator();
        // Act
        var result = calculator.AddNumbers(1, 1);
        // Assert
        Assert.Equal(result, 13);
    }
}

Nếu bạn nhìn vào mã nguồn cho ASP.NET 5 khi ấy bạn sẽ thấy rằng xUnit.net đã sử dụng để kiểm tra ASP.NET bao quát. Ví dụ về repository MVC chứa đựng unit test được viết bởi xUnit.net. Bạn có thể tìm thấy tại repository MVC (và unit test của nó) ở đây:

http://github.com/aspnet/mvc

ASP.NET sử dụng một phân nhánh của xUnit.net đặt ở đây:

https://github.com/xunit/xunit

Mã:

Copy tại : http://khiemnguyen.xyz/10-thay-doi-trong-asp-net-5-va-mvc-6/