# First Steps with UI for WinUI by Installing with Telerik VS Extension
The Telerik UI for WinUI library provides an option for installing its controls with the Telerik Visual Studio (VS) extension, which contains the Telerik UI for WinUI DLLs and referenced assembly files.
This tutorial describes how to get up and running with Telerik UI for WinUI by using the Telerik VS extension.
* First, you will set up your WinUI project and create the WinUI application.
* Next, you'll install the Telerik UI for WinUI library from a ZIP file, declare the namespace, and define the DataGrid control.
* Then, you will show some sample data in the DataGrid.
* Finally, you will add styles to the DataGrid and populate it with data.
## Step 1: Set Up Your WinUI Project
1. Install Windows 10, version 1809 (build 17763) or later.
2. Install [Visual Studio 2019, version 16.9 or later](https://visualstudio.microsoft.com/downloads/). Visual Studio 2022 is recommended for WinUI development.
For WinUI application development, you should install the `.NET Desktop Development` workload.
Telerik is developed for `Windows 10 SDK (10.0.22621.0)` and [Windows App SDK](https://learn.microsoft.com/en-us/windows/apps/windows-app-sdk/) version 2.2.0.
3. Create a [Telerik account](https://www.telerik.com/account/).
## Step 2: Create the WinUI Application
1. Open Visual Studio.
2. Open the Telerik VS extension menu and select the **Create New Telerik Project** option.
**VS Extension Installation: Create New WinUI Application**
1. In the dialog that opens, configure the basic project settings.
**VS Extension Installation: Project Settings**\
1. The **Create New Project Wizard** dialog provides the options to select the **project template** (**Empty** or **DataGrid**).
For the purposes of this tutorial, let's select **Empty**. As a result, the template creates an empty project with the referenced Telerik assemblies as opposed to the **DataGrid** template, which creates a basic setup for the DataGrid control.
**VS Extension Installation: Create Empty Project**
1. Download and install a valid license key. If you already have installed a valid key, the License Validation dialog won't be displayed.
2. Click **Finish** to create the new WinUI project.
**VS Extension Installation: Confirm Project Creation**
## Step 3: Add Styles to the DataGrid
In order for the DataGrid to receive some styles, you need to merge the `Generic.xaml` ResourceDictionary in `App.xaml` as demonstrated in the following example. This should already be present when using our Project Template, but it is an important thing to confirm.
```XAML
```
## Step 4: Declare the Namespace and Define the DataGrid
Let's add the Telerik UI for WinUI DataGrid control—declare its namespace and then define the control.
1. In `MainPage.xaml`, add the following line to declare the namespace:
```XAML
xmlns:telerikGrid="using:Telerik.UI.Xaml.Controls.Grid"
```
1. Add the following code to define the DataGrid:
```XAML
```
As a result, `MainPage.xaml` will look as demonstrated in the following example.
```C#
```
> note If you have chosen WinUI3 Desktop project type, this will be `Window` object instead of a `Page` object.
If you run the application at this point, you will see an empty grid with no columns and rows. Now you'll learn how to display some data.
## Step 5: Render the Sample Data
Since the DataGrid is a data-bound control, you have to create a data model and set the `ItemsSource` of the control to a collection of those models.
To define the Model and the ViewModel:
1. In `MainPage.xaml.cs`, add references to the `Telerik.Core` and `System.Collections.ObjectModel` namespaces:
```C#
using Telerik.Core;
using System.Collections.ObjectModel;
```
1. Add the code from the following example. It demonstrates a sample implementation of a `model` and `ViewModel`. The `ViewModelBase` class from the example is located in the `Telerik.Core` namespace and provides an implementation of the the `INotifyPropertyChanged` interface.
```C#
public class Club : ViewModelBase
{
private string name;
private DateTime established;
private int stadiumCapacity;
public Club(string name, DateTime established, int stadiumCapacity)
{
this.name = name;
this.established = established;
this.stadiumCapacity = stadiumCapacity;
}
public string Name
{
get { return this.name; }
set
{
if (value != this.name)
{
this.name = value;
this.OnPropertyChanged("Name");
}
}
}
public DateTime Established
{
get { return this.established; }
set
{
if (value != this.established)
{
this.established = value;
this.OnPropertyChanged("Established");
}
}
}
public int StadiumCapacity
{
get { return this.stadiumCapacity; }
set
{
if (value != this.stadiumCapacity)
{
this.stadiumCapacity = value;
this.OnPropertyChanged("StadiumCapacity");
}
}
}
}
public class MyViewModel : ViewModelBase
{
private ObservableCollection clubs;
public ObservableCollection Clubs
{
get
{
if (this.clubs == null)
{
this.clubs = this.CreateClubs();
}
return this.clubs;
}
}
private ObservableCollection CreateClubs()
{
ObservableCollection clubs = new ObservableCollection();
Club club;
club = new Club("Liverpool", new DateTime(1892, 1, 1), 45362);
clubs.Add(club);
club = new Club("Manchester Utd.", new DateTime(1878, 1, 1), 76212);
clubs.Add(club);
club = new Club("Chelsea", new DateTime(1905, 1, 1), 42055);
clubs.Add(club);
return clubs;
}
}
```
## Step 6: Populate the DataGrid with Data
Each row in the DataGrid represents an object in the data source and each column shows the value for one property of the bound object.
The following example demonstrates how to display the sample data from Step 5 by setting the `DataContext` of the `Window` and the `ItemsSource` of the `RadDataGrid`.
```C#
```
Now, let's build and run the application.
**Telerik UI for WinUI DataGrid Displaying Data**
That was it! Now you are ready to dive more deeply into Telerik UI for Win UI and take full advantage of its slick functionalities!
## Next Steps
* [Available Product Files for Download](https://www.telerik.com/winui/documentation/installation-and-deployment/download-product-files)
* [Installation Approaches for Telerik UI for WinUI](https://www.telerik.com/winui/documentation/installation-and-deployment/installing-which-file-do-i-need)
* [Usage Specifics for License Types](https://www.telerik.com/winui/documentation/installation-and-deployment/license-limitations)
* [Update to Latest Windows App SDK](https://learn.microsoft.com/en-us/windows/apps/windows-app-sdk/update-existing-projects-to-the-latest-release)
## See Also
* [Microsoft WinUI Samples Gallery](https://github.com/microsoft/WinUI-Gallery)