Join the DZone community and get the full member experience.Join For Free
Jumpstart your Angular applications with Indigo.Design, a unified platform for visual design, UX prototyping, code generation, and app development.
First, we need to make sure that the Infragistics private NuGet package source is set up. Open the "Options" dialog in Visual Studio and navigate to the "Package Sources" view of the "NuGet Package Manager" node. There, we should add a new source that points out to https://packages.infragistics.com/nuget/licensed.
After we have the Infragistics private NuGet feed set up, we can continue with creating the ASP.NET Core application. In our case, we are using Visual Studio 2017 and we are targeting .NET Framework 4.7.1.
In the next view, we stick to the defaults - we will create an ASP.NET Core 2.0 application.
After pressing "OK," our new project is created. Let us have a look at what is initially included in the "NuGet" dependency in our project. ASP.NET Core 2.x applications that target .NET Core (this is our app) only require a single NuGetPackage - "Microsoft.AspNetCore.All." All the features of ASP.NET Core 2.x and Entity Framework are included in this package. Such a smaller application surface area helps to improve the security and also improves performance.
After we install the Infragistics.Web.AspNetCore package - it will also be placed under the "NuGet" dependency. We select "Manage NuGet packages..." from the context menu and we see the NuGet Package Manager view is opened. We see that the manager is set up to use all the available package sources. In addition, we see an indicator that "Microsoft.AspNetCore.All" package is already installed.
We need to change the package source to the Infragistics private feed to make sure that the Licensed version will be installed. Then, we search for the ASP.NET Core package. In this example, I demonstrate the difference between the packages in version 2017.1 and in 2017.2. I have licenses for both versions and after browsing for "Infragistics.Web," I see both the packages. For this example, we will use the 2017.2 version which is the top package.
After the package is installed, we need to include the Ignite UI scripts that are installed by the package to our application. As our project uses PackageReferences, the static script files are not added to the project automatically. They are installed under the "%UserProfile%\.nuget\packages" folder. So, you need to copy the files that are needed by your application and place it inside the "wwwroot" folder of the project. Inside your .cshtml pages, you need to reference those scripts from this folder.
As you can see on the following screenshot, I have added the combined .js files that I need under the "js" folder of my application and I have placed the Infragistics .css files that I want to use under the "css" folder.
@ using Infragistics.Web.Mvc
Below we need to reference our Ignite UI scripts. In my example they would look like this:
<link href="~/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" /> <link href="~/css/structure/infragistics.css" rel="stylesheet" /> <script src="~/js/infragistics.core.js"></script> <script src="~/js/infragistics.lob.js"></script>
When I run my application, the numeric editor will be rendered.
Published at DZone with permission of Alex Marinov , DZone MVB. See the original article here.
Opinions expressed by DZone contributors are their own.