Getting Started with Progress® Telerik® UI for ASP.NET Core and the Command Line Interface

This article demonstrates how to configure an ASP.NET Core project to use Telerik UI for ASP.NET Core by using the command line interface.

The following approach is applicable when you work on .Net Core projects in Visual Studio Code or any other code editor. It is also platform-agnostic which means that you can follow the same steps on MacOS, Linux, or Windows machines.


Creating the Application


If you are configuring an existing project, skip this step.

Below are listed the steps for you to follow when creating an ASP.NET Core web app.

  1. Navigate to the folder of your choice by using the Terminal (cmd). Create a new folder and navigate in it.

    mkdir MyTelerikApp
    cd MyTelerikApp
  2. Run dotnet new mvc to create a .Net Core application by using the default web MVC template.

  3. Run dotnet restore to restore the project template dependencies. As a result, the NuGet packages are downloaded.


    For a list of current commands, refer to the guide on getting started with .NET Core.

  4. Run dotnet run to start the application. The following example demonstrates a sample response that you are expected to receive.

    Hosting environment: Production
    Now listening on: http://localhost:5000
    Application started. Press Ctrl+C to shut down.
  5. By using the browser, navigate to the above location and make sure the application is properly running. After you check the application in the browser, stop the server.

Integrating Telerik UI for ASP.NET Core

  1. Configure the private Telerik NuGet feed and use either of the following approaches:

    • Globally include the credentials to the NuGet configuration of the user. To do that, modify (or create) the NuGet.Config file for the user. That file could be found in the %appdata%\NuGet\ folder on Windows machines. Depending on the exact OS distribution, the file has to be available (created) in the ~/.config/NuGet/ or the ~/.nuget/NuGet/ folder on Mac/Linux machines.
    • Create a local NuGet.Config file in the project folder.

    In both cases, the NuGet.Config file has to include your credentials.

    <?xml version="1.0" encoding="utf-8"?>
        <add key="" value="" />
            <add key="Username" value="[ ]" />
            <add key="ClearTextPassword" value="[ ]" />
  2. Install Telerik UI for ASP.NET Core through the CLI.

    dotnet add package Telerik.UI.for.AspNet.Core
  3. Register Kendo UI as a service in Startup.cs.

    3.1. Locate the ConfigureServices method and add the JsonOptions and the Kendo UI service.

    public void ConfigureServices(IServiceCollection services)
        // Maintain property names during serialization. See:
                .AddJsonOptions(options =>
                    options.SerializerSettings.ContractResolver = new DefaultContractResolver());

    3.2. Add the required using of the Newtonsoft.Json.Serialization namespace.

    using Newtonsoft.Json.Serialization;

    3.3. Locate the configure method and add a call to app.UseKendo at the end (required for versions prior to R2 2018).

    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
  4. Import the Kendo.Mvc.UI namespace. Open ~/Views/_ViewImports.cshtml and add the following references.

    @addTagHelper *, Kendo.Mvc
    @using Kendo.Mvc.UI
  5. Include the Kendo UI client-side resources.

    For more information about the different approaches for including client-side resources please refer to the Include Client Side Resources article.

  6. Create a Kendo UI widget by adding the snippet from the following example to ~/Views/Home/Index.cshtml.

    <h2>Kendo UI DatePicker</h2>
  7. Navigate to the project folder by using the Terminal (cmd) and run it by using the dotnet run command. The Index page will display a Kendo UI DatePicker.

See Also

In this article
Not finding the help you need? Improve this article