--- title: "Scaffolding Syncfusion Controls in ASP.NET Core Applications" published_at: "2020-01-17T12:00:59+00:00" modified_at: "2024-11-20T13:26:36+00:00" url: "https://www.syncfusion.com/blogs/post/scaffolding-syncfusion-controls-in-asp-net-core-applications" excerpt: "Syncfusion is happy to announce that scaffolding support for Syncfusion ASP.NET Core controls is available with our 2019 Vol 4 (v17.4.0.39) release. In this blog, we will explain how to use scaffolding in an ASP.NET Core application with the Syncfusion..." taxonomy_category: - "ASP.NET Core" taxonomy_post_tag: - "ASP.NET Core" - "productivity" - "Scaffolding" --- # Scaffolding Syncfusion Controls in ASP.NET Core Applications [Kannan](https://www.syncfusion.com/blogs/author/skannan) ![Scaffolding ASP.NET Core](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/Scaffolding-ASP.NET-Core.jpg) Syncfusion is happy to announce that [scaffolding](https://docs.microsoft.com/en-us/aspnet/core/tutorials/razor-pages/page?view=aspnetcore-3.1&tabs=visual-studio) support for Syncfusion [ASP.NET Core controls](https://www.syncfusion.com/aspnet-core-ui-controls) is available with our [2019 Vol 4 (v17.4.0.39) release](https://www.syncfusion.com/forums/150001/essential-studio-2019-volume-4-release-v17-4-0-39-is-available-for-download) . In this blog, we will explain how to use scaffolding in an ASP.NET Core application with the Syncfusion [DataGrid](https://www.syncfusion.com/aspnet-core-ui-controls/grid) control for ASP.NET Core as an example. ## What is scaffolding? Scaffolding is a great way to kick-start model-view-controller (MVC) framework development. It is a code-generation framework for ASP.NET Core applications. Application developers can quickly create the controller and views with respect to the existing models in the application. ## Scaffolding support for Syncfusion ASP.NET Core controls Developers can be more productive with Syncfusion scaffolding because the system will fill in the data with Syncfusion code snippets to controllers and views. The following are the Syncfusion ASP.NET Core controls that support scaffolding: - [DataGrid](https://www.syncfusion.com/aspnet-core-ui-controls/grid) - [Charts](https://www.syncfusion.com/aspnet-core-ui-controls/charts) - [Scheduler](https://www.syncfusion.com/aspnet-core-ui-controls/scheduler) - [Diagram](https://www.syncfusion.com/aspnet-core-ui-controls/diagram) - [TreeGrid](https://www.syncfusion.com/aspnet-core-ui-controls/tree-grid) - [Rich Text Editor](https://www.syncfusion.com/aspnet-core-ui-controls/wysiwyg-rich-text-editor) - [Document Editor](https://www.syncfusion.com/aspnet-core-ui-controls/word-processor) - [PDF Viewer](https://www.syncfusion.com/aspnet-core-ui-controls/pdf-viewer) ## Create model and DB context classes To perform Syncfusion scaffolding, you should use model and DB context classes in your application. Please follow these steps to create model and DB context classes in an ASP.NET Core application, if does not exist: **Step 1:** Create a new database and table using the ** SQL Server**application if the project does not have the database. **Step 2:** Open an existing ASP.NET Core web application project or create a new one in Visual Studio. **Step 3:** Install the following NuGet packages in the application: - AspNetCore.Mvc.NewtonsoftJson - EntityFrameworkCore.SqlServer - EntityFrameworkCore.Tools - Extensions.Logging.Debug - VisualStudio.Web.CodeGeneration.Design **Step 4:** To connect your SQL Server, go to ** View->SQL Server Object Explorer** in SQL Server Object Explorer, right-click your database, and then copy the connection string. **Step 5:** Now, open the Package Manager Console by selecting the project and then go to ** Tools->NuGet Package Manager->Package Manager Console**. **Step 6:** Execute the following commands in the Package Manager Console with the copied connection string: **>Scaffold-DbContext “{Connection String}” Microsoft.EntityFrameworkCore.SqlServer -OutputDir Model -Context “{Db context class name}” -DataAnnotations** **Step 7:** Now, Model and DbContext classes are created in the application. Build the project. ## How to use Syncfusion scaffolding Follow these steps to use Syncfusion scaffolding: **Step 1:** Open an existing ASP.NET Core web application project or create a new one with the Entity Framework Data Model. Ensure that the application has been compiled once. **Step 2:** Right-click the ** Controllers**folder in the Solution Explorer and select ** Add > New Scaffolded Item**… ![Adding New Scaffolded Item](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/Adding-New-Scaffolded-Item.png) Adding New Scaffolded Item **Step 3:** You will see the ** Add Scaffold**dialog. Select ** Syncfusion ASP.NET Core UI**** Scaffolder**and click ** Add**. This will display the ** Syncfusion UI Scaffolding** dialog. ![Adding Syncfusion ASP.NET Core UI Scaffolder](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/Adding-Syncfusion-ASP.NET-Core-UI-Scaffolder.png) Adding Syncfusion ASP.NET Core UI Scaffolder **Step 4:** Select the desired control—** DataGrid**in our example—on which scaffolding should be performed and click ** Next**. ![Syncfusion UI Scaffolding control selection dialog](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/Syncfusion-UI-Scaffolding-control-selection-dialog.png) Syncfusion UI Scaffolding control selection dialog The Syncfusion UI scaffolding for the selected control dialog will open. Since we selected the **DataGrid** control, the model configuration dialog will open as shown in the following figure. Enter the ** Controller Name** and ** View Name** as per the application requirements. Select the required ** Model Class** of the active project and its relevant ** Data Context Class** and then click ** Next**. ![DataGrid model configuration dialog](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/DataGrid-model-configuration-dialog.png) DataGrid model configuration dialog **Step 5:** In the wizard, select the features of your choice to be included and click ** Add**. ![DataGrid feature selection dialog](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/DataGrid-feature-selection-dialog.png) DataGrid feature selection dialog The **Controller** and the corresponding ** View** files will now be generated with the code snippets of the selected features. ![Controller and view files added](https://www.syncfusion.com/blogs/wp-content/uploads/2020/01/Controller-and-view-files-added.png) Controller and view files added **Step 6:** Then, add navigation to the created view file based on your requirement to open it in the webpage. **Step 7:** Refer to the following UG documentation link to render the Syncfusion control after performing scaffolding. [Configure ASP.NET Core controls using the Syncfusion.EJ2.AspNet.Core package](https://ej2.syncfusion.com/aspnetcore/documentation/getting-started/visual-studio-2017/) ## Conclusion Use Syncfusion scaffolding in your project to quickly add code that interacts with data models. Using it can reduce the amount of time it takes you to develop standard data operations in your project. Syncfusion provides 70+ high-performance, lightweight, modular, and responsive [ASP.NET Core UI controls](https://www.syncfusion.com/aspnet-core-ui-controls) such as [DataGrid](https://www.syncfusion.com/aspnet-core-ui-controls/grid) , [Charts](https://www.syncfusion.com/aspnet-core-ui-controls/charts) , and [Scheduler](https://www.syncfusion.com/aspnet-core-ui-controls/scheduler) . You can use these controls to speed up your application development. For which control are you anticipating scaffolding support? Let us know in the comment section below. You can also contact us through our [support forum](https://www.syncfusion.com/forums) , [Direct-Trac](https://www.syncfusion.com/support/directtrac/incidents) , or [feedback portal](https://www.syncfusion.com/feedback/) . We will implement requests based on the number of customers requesting them.