Post
Ask Question

Scaffolding ASP.NET Core MVC

In this post, we are going to explore how to create a model based on the existing database (Db-First), with the help of Entityframework Core Command then learn how to generate Controller & Views using Scaffolding (Interface & Code-Generator Command) based on model.

Here are the topics.

  1. Manage Packages
  2. EF Core Model(DB-First)
  3. MVC Core Scaffolding

Let’s create a New Project: File > New > Project.

From the left menu choose .NET Core > ASP.NET Core Web Application

Choose ASP.NET Core sample template, Click OK.

Here, the initial view of the sample template is given below in the Solution Explorer.

Create a new database, using SSMS, name it “PhoneBook”. Copy the query & run it, using query editor of SSMS.

USE [PhoneBook]
GO

/****** Object:  Table [dbo].[Contacts] Script Date: 12/9/2016 2:47:49 AM ******/
SET ANSI_NULLS ON
GO

SET QUOTED_IDENTIFIER ON
GO

CREATE TABLE [dbo].[Contacts] (
    [ContactID]   INT IDENTITY(1,1) NOT NULL,
    [FirstName]   NVARCHAR(50) NULL,
    [LastName]    NVARCHAR(50) NULL,
    [Phone]       NVARCHAR(50) NULL,
    [Email]       NVARCHAR(50) NULL,
    CONSTRAINT [PK_Contacts] PRIMARY KEY CLUSTERED (
        [ContactID] ASC
    ) WITH (
        PAD_INDEX = OFF,
        STATISTICS_NORECOMPUTE = OFF,
        IGNORE_DUP_KEY = OFF,
        ALLOW_ROW_LOCKS = ON,
        ALLOW_PAGE_LOCKS = ON
    ) ON [PRIMARY]
) ON [PRIMARY]

GO

Entity Framework Core:Entity Framework (EF) Core is data access technology, which is targeted for cross-platform. Open project.json, and add the packages given below in Dependency & Tools section.

Add Dependency Package

{
  // Database Provider for EF Core
  "Microsoft.EntityFrameworkCore.SqlServer": "1.0.1",

  // EF Core Package Manager Console Tools
  "Microsoft.EntityFrameworkCore.Tools": "1.0.0-preview2-final",

  // EF Core Functionality for MSSQL Server
  "Microsoft.EntityFrameworkCore.SqlServer.Design": "1.0.1"
}

Add Tools

{
  // Access Command Tools EF Core
  "Microsoft.EntityFrameworkCore.Tools": "1.0.0-preview2-final"
}
  • EntityFrameworkCore.SqlServer:The database provider allows Entity Framework Core to be used with Microsoft SQL Server.
  • EntityFrameworkCore.SqlServer.Design:Design-time allows Entity Framework Core functionality (EF Core Migration) to be used with Microsoft SQL Server.
  • EntityFrameworkCore.Tools:Command line tool for EF Core that includes the commands.

For Package Manager Console.

  • Scaffold-DbContext
  • Add-Migration
  • Update-Database

For Command Window

  • dotnet ef dbcontext scaffold

Using CommandLine

In our sample Application, we are going to apply commands, using the command line.

Go to Project directory > Shift + Right Click to open Command Window.

Command

dotnet ef –help

Command

dotnet ef dbcontext scaffold "Server=DESKTOP-5B67SHH;Database=PhoneBook;Trusted_Connection=True;" Microsoft.EntityFrameworkCore.SqlServer --output-dir Models.

As you can see from Solution Explorer, models folder is created with context & entities.

Generated DbContext

Finally, a full view of generated Context class is given below.

public partial class PhoneBookContext : DbContext
{
    protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)
    {
        #warning To protect potentially sensitive information in your connection string, 
        #warning you should move it out of source code. See http://go.microsoft.com/fwlink/?LinkId=723263 
        #warning for guidance on storing connection strings.
        optionsBuilder.UseSqlServer(@"Server=DESKTOP-5B67SHH;Database=PhoneBook;Trusted_Connection=True;");
    }

    protected override void OnModelCreating(ModelBuilder modelBuilder)
    {
        modelBuilder.Entity<Contacts>(entity =>
        {
            entity.HasKey(e => e.ContactId)
                .HasName("PK_Contacts");

            entity.Property(e => e.ContactId).HasColumnName("ContactID");

            entity.Property(e => e.Email).HasMaxLength(50);

            entity.Property(e => e.FirstName).HasMaxLength(50);

            entity.Property(e => e.LastName).HasMaxLength(50);

            entity.Property(e => e.Phone).HasMaxLength(50);
        });
    }

    public virtual DbSet<Contacts> Contacts { get; set; }
}

ASP.Net MVC Core Scaffolding:We have used scaffolding in previous versions of .NET, as .NET Core is new. Sometimes it’s confusing as to how to start. Here, we will explore those issues. Open project.json and add the packages given below in Dependency & Tools section.

Add Dependency Package

{
  // Code Generators Command Generate Controller, Views
  "Microsoft.VisualStudio.Web.CodeGenerators.Mvc": "1.0.0-preview2-final",
  "Microsoft.VisualStudio.Web.CodeGeneration.Tools": "1.0.0-preview2-final"
}

Add Tools

// Access Command Tools Code Generation
"Microsoft.VisualStudio.Web.CodeGeneration.Tools": "1.0.0-preview2-final"

Click Save, packages will restore automatically. Well, the packages are installed to our Application. We are good to perform the next step of scaffolding, Controller & Views.

Scaffold using Interface

Right click on Controller folder > Add > New scaffolding Item

Choose the scaffold option, as to how the code will be generated.

Now provide model and context classes that are you are going to use to interact with the database, choose view options, and then click  the Add button to perform the action.

Wait for awhile, and as we can see from Solution Explorer, the views are generated.

The output messages are shown below.

C:\Program Files\dotnet\dotnet.exe aspnet-codegenerator --project "E:\Documents\Article\ScaffoldingCoreMVC\CoreMVCScaffolding\src\CoreMVCScaffolding" controller --force --controllerName ContactsController --model CoreMVCScaffolding.Models.Contacts --dataContext CoreMVCScaffolding.Models.PhoneBookContext --relativeFolderPath Controllers --controllerNamespace CoreMVCScaffolding.Controllers --useDefaultLayout
Finding the generator 'controller'.
Running the generator 'controller'.

Attempting to compile the application in memory

Attempting to figure out the EntityFramework metadata for the model and DbContext: Contacts

  • Added Controller : \Controllers\ContactsController.cs.
  • Added View : \Views\Contacts\Create.cshtml.
  • Added View : \Views\Contacts\Edit.cshtml.
  • Added View : \Views\Contacts\Details.cshtml.
  • Added View : \Views\Contacts\Delete.cshtml.
  • Added View : \Views\Contacts\Index.cshtml.

RunTime 00:00:07.87

Scaffold using CommandLine

We can generate this by using CommandLine by pointing project folder with Shift + Right click followed by the appearing command, and the Window will appear. Get help information by the command given below.

Command

dotnet aspnet-codegenerator --help

Let’s generate Controller & View, using the command given below, with project path, controller, and model info.

Command

dotnet aspnet-codegenerator --project
"E:\Documents\Article\ScaffoldingCoreMVC\CoreMVCScaffolding\src\CoreMVCScaffolding" controller --force --controllerName ContactsController --model CoreMVCScaffolding.Models.Contacts --dataContext CoreMVCScaffolding.Models.PhoneBookContext --relativeFolderPath Controllers --controllerNamespace CoreMVCScaffolding.Controllers –useDefaultLayout

We can see the controller & view are successfully generated using MVC model. In our sample Application, if we notice in the Error List tab , there’s a warning about moving sensitive information from DbContext.

This is the area in DbContext class, which causes the warning.

protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)
{
    #warning To protect potentially sensitive information in your connection string, 
    #warning you should move it out of source code. See http://go.microsoft.com/fwlink/?LinkId=723263 
    #warning for guidance on storing connection strings.
    optionsBuilder.UseSqlServer(@"Server=DESKTOP-5B67SHH;Database=PhoneBook;Trusted_Connection=True;");
}

Let’s comment that out here in startup class. Now, add the Service by moving the connectionstring info from DbContext. Below, you may notice the code snippet that adds the Service.

// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
    // Add framework services.
    services.AddMvc();

    var connection = @"Server=DESKTOP-5B67SHH;Database=PhoneBook;Trusted_Connection=True;";
    services.AddDbContext<PhoneBookContext>(options =>
        options.UseSqlServer(connection));
}

If we now try to run our Application, the exception given below will occur. Here, the Exception message is given below.

InvalidOperationException

No database provider has been configured for this DbContext. A provider can be configured by overriding the DbContext.OnConfiguring method or by using AddDbContext on the Application Service provider. If AddDbContext is used, ensure that your DbContext type accepts a DbContextOptions<TContext> object in its constructor and passes it to the base constructor for DbContext.

It says, no database provider has been configured for this DbContext. Notice, we have used AddDbContext in ConfigureServices(IServiceCollection services) method.

services.AddDbContext<PhoneBookContext>(options =>
    options.UseSqlServer(connection));

We didn’t pass it for DbContext. We need to add constructor given below to pass it to the base constructor for DbContext.

public PhoneBookContext(DbContextOptions<PhoneBookContext> options) 
    : base(options)
{
}

Now, we may run our sample Application by Ctrl+F5 or we can run it using the command given below.

Command

dotnet run

Open the Browser and go to http://localhost:5000 and finally the Application is running.

Contact List

Create New Contact

Edit Existing Contact

View Details Existing Contact

Delete Existing Contact

Hope this will help.

References

  1. https://docs.microsoft.com/en-us/ef/core/index
  2. https://docs.microsoft.com/en-us/ef/core/miscellaneous/cli/dotnet
  3. https://github.com/aspnet/EntityFramework/wiki/Roadmap
  4. https://www.codeproject.com/articles/1118189/crud-using-net-core-angularjs-webapi


Similar Articles