Telerik UI for Blazor Template Wizard for Visual Studio Code
The Progress® Telerik® UI for Blazor Visual Studio Code Extension increases productivity and simplifies the process of creating Blazor projects in Visual Studio Code. The Wizard can be installed and launched on Windows, Linux and Mac and includes Blazor WebAssembly and Server project templates, option to configure the target .NET framework, ready to use and style native Blazor UI components.
The extension eases development efforts by providing quick start with project templates and several predefined pages. The project templates include: Blank (empty project with all the needed configuration to start immediately using Telerik Blazor UI components) and Admin Dashboard (with pre-built layout, components including Grid, Tile Layout, Drawer, Calendar, Form, various Chart types, Card and more). The page options include: the Telerik feature-rich Grid, Dashboard, Chart and Form Input controls such as TextBox, DropDownList or Date Picker. You can also easily configure the desired theme for your application, choosing from Default, Bootstrap or Material themes and the different color variations available with their respective swatches.
Create New Telerik Blazor Project in Visual Studio Code
You can create a Telerik Blazor project by accessing the wizard from the Visual Studio Code Extensions menu. To open the menu, use
Choose whether to start from a Blank project or use the Admin Dashboard Template, select a Project Name and the Output Path. Next, pick the type of project (Blazor WebAssembly or Server project), the target framework, and the type of license you are using – trial or paid. For easy getting started journey you also have the option to pick a page template – Grid, Chart, Form inputs, Chart and more. Style your project at its creation, choosing from Default, Bootstrap or Material themes and select your preferred swatches with different color variations.
To run the application, you need to open the Terminal on your project and find the Server folder. Note that if you chose a Server type of project, the folder will hold the name of your project. If your project is WebAssembly, the folder you will be looking for is called Server folder. Execute the dotnet run command and you will have your Blazor project up and running.
Please review our documentation page for more information.
Telerik REPL for Blazor
The Telerik Visual Studio Code wizard also provides integration with Telerik REPL for Blazor which is a browser-based playground for creating, saving, running and sharing of Blazor code snippets.
Using the Share to Telerik REPL for Blazor option from the code editor context menu, you can easily export your code snippet while coding in your favorite IDE and share the generated URL to social media, community forums or send it to a team mate.
Share Using the Code Editor Context Menu
To share your code using Share to Telerik REPL for Blazor from the code editor's context menu:
Share Using the Code Editor Command Palette
To share your code with Share to Telerik REPL for Blazor from the command palette:
Share Using the File Explorer Context Menu
To use Share to Telerik REPL for Blazor from the VS Code's file explorer's context menu: