# Using Visual Studio Code

## Content

Visual Studio Code (VS Code) allows you to create ASP.NET MVC application on Windows and Mac systems. To use C1 MVC controls, few additional steps are required to configure the project created using the Visual Studio Code IDE.

1. Create a new folder on your system for the ASP.NET Core MVC application.
2. Open VS Code and select **File \| Open Folder\.\.\.** to open the recently created folder in VS Code.
3. Select **View \| Terminal** to open the terminal.
4. In the Terminal, type the following command line to create a new ASP.NET Core MVC application and press **Enter**.
    `dotnet new mvc`
<br>
    This creates the complete MVC folder structure inside your application folder that you created at the beginning.
5. To add the ASP.NET Core MVC references to the project, press **Ctrl + Shift + P** keys and select **NuGet Package Manager: Add Package** option.

    >type=note
> Note: **NuGet package Manager** extension is a prerequisite in VS Code for installing NuGet packages.
6. Type and search for **C1.AspNetCore.Mvc** package name, select the version and press **Enter**. The package gets installed.
    ![](https://cdn.mescius.io/document-site-files/images/9b6a6cfe-b8e8-42e9-8a04-da6cb7762977/images/installing-nuget-vscode.gif)
7. To use specific controls in your application, add the following NuGet Packages based on the control.

    | **Control** | **NuGet Package** |
    | ------- | ------------- |
    | Financial Chart | `C1.AspNetCore.Mvc.Finance` |
    | FlexSheet | `auto C1.AspNetCore.Mvc.FlexSheet ` |
    | OLAP | `auto C1.AspNetCore.Mvc.Olap ` |
    | MultiRow | `auto C1.AspNetCore.Mvc.MultiRow ` |
    | FlexViewer | `C1.AspNetCore.Mvc.FlexViewer` |

<br>
8. From the **Explorer**, expand the folder **Views** and double click the `_ViewImports.cshtml` file to open it.
9. In the \_ViewImports.cshtml file, add the following code.

    ```html
    @addTagHelper *, C1.AspNetCore.Mvc
    ```
10. (Optional) To add specific controls in your application, you need to add the following TagHelpers in the `_ViewImports.cshtml` file.

```auto
| **Control** | **TagHelper** |
| --- | --- |
| Financial Chart |   ``` @addTagHelper *, C1.AspNetCore.Mvc.Finance ```   |
| FlexSheet |   ``` @addTagHelper *, C1.AspNetCore.Mvc.FlexSheet ```   |
| OLAP |   ``` @addTagHelper *, C1.AspNetCore.Mvc.Olap ```   |
| MultiRow |   ``` @addTagHelper *, C1.AspNetCore.Mvc.MultiRow ```   |
| FlexViewer |   ``` @addTagHelper *, C1.AspNetCore.Mvc.FlexViewer ```   |
```

11. To add a license, right-click the solution name from the Solution Explorer or go to the Tools menu, and then select **MESCIUS License Manager**. Optionally, you can also generate runtime license key and add it to your application. For more information on generating license, see [Licensing](/componentone/docs/mvc/online-mvc-core/GettingStarted/Licensing) topic.
12. After completing the steps above, register the resources for the controls to be used in the application.