# ASP.NET MVC Core Integration

This topic explains how to create an ASP.NET Core application using ActiveReports and render the reports in the JSViewer.

## Content



Let us create an ASP.NET Core application using ActiveReports and render the reports in the Js Viewer.

1.  Create an ASP.NET Core Web Application which includes example Razor Pages and configure ActiveReports in ASP.NET Core Middleware as illustrated in [Js Viewer ASP.NET Middleware](/activereportsnet/docs/v19.2/developers/create-applications/web-viewer-and-web-designer-middlewares/jsvieweraspnet-middleware) topic.
    
2.  Add Js Viewer to the application.
    
    1.  Open the **Tools** menu > **NuGet Package Manager** > **Package Manager Console** and run the following command:<br />`npm install @mescius/activereportsnet-viewer`
        
    2.  Copy the 'jsViewer.min.js' and 'jsViewer.min.css' files installed in the **node\_modules** folder to the **wwwroot\\js** and **wwwroot\\css** folder in the application, respectively.
        
3.  Replace the complete code in the 'Index.cshtml' with the following content:
    
    ```html
    @page
    @model IndexModel
    @{
        ViewData["Title"] = "Home page";
    }
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>ActiveReports JSViewer</title>
        <link rel="stylesheet" href="css/jsViewer.min.css" />
    </head>
    <body>
        <div id="viewer-id" style="width: 100%; height: 100%;">
        </div>
        <!--reference to js file-->
        <script src="js/jsViewer.min.js"></script>
        <script type="text/javascript">
            GrapeCity.ActiveReports.JSViewer.create({
                element: '#viewer-id',
                reportService: {
                    url: 'api/reporting',
                },
                reportID: 'DemoReport.rdlx',
                settings: {
                    zoomType: 'FitPage'
                }
            });
        </script>
    </body>
    </html>
    ```
    
4.  Modify the 'Startup.cs' class by adding the Reporting service in the 'Startup.cs' class as follows:
    
    ```csharp
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
            {
                if (env.IsDevelopment())
                {
                    app.UseDeveloperExceptionPage();
                }
                else
                {
                    app.UseExceptionHandler("/Error");
                    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
                    app.UseHsts();
                }
                app.UseHttpsRedirection();
                app.UseStaticFiles();
                app.UseReportViewer(settings =>
                {
                    settings.UseFileStore(new System.IO.DirectoryInfo(env.ContentRootPath + @"\Reports\"));
                });
                app.UseRouting();
                app.UseAuthorization();
                app.UseEndpoints(endpoints =>
                {
                    endpoints.MapRazorPages();
                });
            }
    ```
    
5.  Run the application.
