ASP.NET Core widget components
Overview
The following article describes the different parts that constitute an ASP.NET Core widget. It also specifies where you should place them and how should you name them.
GITHUB EXAMPLE: All the samples are taken out of the Sitefinity data widget that you can find in Sitefinity GitHub repository.
ViewComponent (required)
Location
/ViewComponents/SitefinityDataViewComponent.cs
Naming convention
The name of the class must have the ViewComponent suffix.
Description
The ViewComponent class must comply with the following:
- The class must be public.
- The class must be marked with the
[SitefinityWidget] attribute.
This way, the widget is loaded and displayed during the page editing, inside the Sitefinity CMS widget selector.
- The class must contain a public
InvokeAsync method which receives as argument IViewComponentContext<SitefinityDataEntity>.
For more information, see Microsoft documentation » View components in ASP.NET Core.
Sample
Following is an example of a ViewComponent class:
View (required)
Location
/Views/Shared/Components/SitefinityData/Default.cshtml
Naming convention
The naming of the folders where you place the Default.cshtml is strict.
SitefinityData folder is the name of your widget.
RECOMMENDATION: We recommend naming the view Default.cshtml
Description
In this folder, in addition to the Default.cshtml, you can place all views available for a particular ViewComponent.
Sample
Following is an example of a View file:
Entity (optional)
Location
/Models/SitefinityData/SitefinityDataEntity.cs
Naming convention
The name of the class must have the Entity suffix.
Description
The Entity class represents the data that is persisted in the database. This separates the logic for persisting the values of the properties, kept in the Entity class, from the business logic for the view components, kept in the Model class
The Entity class presents only plain public properties with get or set. This is visualized in Sitefinity CMS backend, through the widget property editors. The widget editor autogenerates a separate field for each property of the entity.
You can use attributes and data annotations to configure the look of the fields or their visibility, to group them in sections and categories, to set their default values, to validate them, etc.
For more information, see Autogenerated widget property editors for ASP.NET Core.
Sample
Following is an example of an Entity class:
Model (optional)
Location
/Models/SitefinityData/SitefinityDataModel.cs and
/Models/SitefinityData/ISitefinityDataModel.cs
Naming convention
The name of the class must have the Model suffix.
Description
This classes contains the business logic of the widget. They receive the data from the entity and process it to generate a ViewModel with the data needed by the View.
RECOMMENDATION: Although none of these classes are required, we recommend you add all logic for the widget in them, including the requests to Sitefinity CMS services and to third-party providers.
Sitefinity CMS built-in widgets, expose an interface for the model and take advantage of the built-in ASP.NET Core dependency injection mechanism to provide capability for replacing and extending the default logic.
Sample
Following is an example of a Model class:
Following is an example of the model interface class:
ViewModel (optional)
Location
/Models/WidgetName/WidgetViewModel.cs
Naming convention
The name of the class must have the ViewModel suffix.
Description
This class is intended to contain Plain old CLR object (POCO) for providing data to the widget view. You can have more than one ViewModel class for a single widget, depending on the specifics of your different views.
RECOMMENDATION: We recommend using a ViewModel class to separate the logic of the view from the business logic.
Sample
Following is an example of a ViewModel class: