TemplateStudio
Template Studio accelerates the creation of new WinUI 3, WPF, and UWP apps using a wizard-based experience.
Top Related Projects
This repo contains the Template Engine which is used by dotnet new
[Archived] This repository has been archived
CLI tool for Angular
š ļø webpack-based tooling for Vue.js Development
Set up a modern web app by running one command.
Rails-inspired generator system that provides scaffolding for your apps
Quick Overview
Template Studio is a Visual Studio extension that accelerates the creation of new Universal Windows Platform (UWP), WPF, and WinUI 3 apps using a wizard-based experience. It provides a rich set of project templates and features to jumpstart app development, allowing developers to quickly create the basic structure of their application.
Pros
- Streamlines the initial setup process for Windows applications
- Offers a wide variety of project templates and features to choose from
- Supports multiple Windows app platforms (UWP, WPF, WinUI 3)
- Regularly updated with new features and improvements
Cons
- Limited to Windows application development
- May generate more code than necessary for simple projects
- Learning curve for understanding the generated project structure
- Dependency on Visual Studio IDE
Getting Started
- Install Visual Studio 2019 or later
- Download and install the Template Studio extension from the Visual Studio Marketplace
- Open Visual Studio and create a new project
- Select "Template Studio for [UWP/WPF/WinUI 3]" from the project templates
- Follow the wizard to choose your desired features and pages
- Click "Create" to generate your project
Note: Template Studio is not a code library, so code examples are not applicable in this case.
Competitor Comparisons
This repo contains the Template Engine which is used by dotnet new
Pros of templating
- More flexible and general-purpose, supporting a wider range of project types
- Deeper integration with .NET CLI and Visual Studio
- Actively maintained with frequent updates and contributions
Cons of templating
- Steeper learning curve for creating custom templates
- Less focus on specific application types like UWP or WPF
- Fewer pre-built templates for common scenarios
Code Comparison
TemplateStudio (C#):
await GenContext.ToolBox.Shell.Current.ShowMessageAsync(
Resources.ErrorDialogTitle,
Resources.ErrorDialogMessage);
templating (C#):
Console.WriteLine(LocalizableStrings.TemplateCreatedMessage);
TemplateStudio focuses on UI-based interactions, while templating is more console-oriented, reflecting their different use cases and target environments.
TemplateStudio provides a higher-level abstraction for creating specific types of applications, with more built-in UI components and patterns. templating, on the other hand, offers a lower-level framework for creating and using templates across various .NET project types.
While both projects aim to simplify project creation and scaffolding, they cater to different audiences and use cases within the .NET ecosystem.
[Archived] This repository has been archived
Pros of JavaScriptServices
- Focused specifically on integrating JavaScript frameworks with ASP.NET Core
- Provides server-side rendering capabilities for SPA frameworks
- Offers more flexibility for custom JavaScript setups
Cons of JavaScriptServices
- Less comprehensive project templates compared to TemplateStudio
- Requires more manual configuration for full-stack applications
- Limited to ASP.NET Core integration scenarios
Code Comparison
TemplateStudio (C#):
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc();
services.AddSingleton<IHttpContextAccessor, HttpContextAccessor>();
services.AddScoped<IIdentityService, IdentityService>();
}
JavaScriptServices (C#):
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc();
services.AddNodeServices();
services.AddSpaPrerenderer();
}
Both repositories aim to improve the development experience for .NET developers working with modern web technologies. TemplateStudio offers a broader range of project templates and features for various application types, while JavaScriptServices focuses specifically on integrating JavaScript frameworks with ASP.NET Core. TemplateStudio provides more out-of-the-box functionality, whereas JavaScriptServices offers greater flexibility for custom JavaScript setups and server-side rendering capabilities.
CLI tool for Angular
Pros of Angular CLI
- More mature and widely adopted in the Angular ecosystem
- Offers a comprehensive set of tools for Angular development, including testing and deployment
- Provides a powerful CLI for generating components, services, and other Angular artifacts
Cons of Angular CLI
- Steeper learning curve for developers new to Angular
- Less flexibility for non-Angular projects or custom configurations
- Larger initial project size due to Angular's comprehensive framework
Code Comparison
TemplateStudio (C#):
public class MainViewModel : Observable
{
public MainViewModel()
{
// ViewModel initialization
}
}
Angular CLI (TypeScript):
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'my-angular-app';
}
Summary
TemplateStudio focuses on providing templates for various Microsoft platforms, while Angular CLI is specifically designed for Angular development. TemplateStudio offers more flexibility across different project types, whereas Angular CLI provides a more opinionated and comprehensive toolset for Angular applications. The choice between the two depends on the target platform, development ecosystem, and specific project requirements.
š ļø webpack-based tooling for Vue.js Development
Pros of Vue CLI
- More versatile, supporting various front-end frameworks and build tools
- Extensive plugin ecosystem for easy integration of additional features
- Active community with frequent updates and improvements
Cons of Vue CLI
- Steeper learning curve for beginners compared to TemplateStudio
- Less focus on specific platforms like UWP or WPF
Code Comparison
Vue CLI project structure:
my-project/
āāā public/
ā āāā index.html
ā āāā favicon.ico
āāā src/
ā āāā assets/
ā āāā components/
ā āāā views/
ā āāā App.vue
ā āāā main.js
āāā package.json
TemplateStudio project structure:
MyProject/
āāā MyProject/
ā āāā Views/
ā āāā ViewModels/
ā āāā Services/
ā āāā Helpers/
ā āāā App.xaml
āāā MyProject.Core/
āāā MyProject.Tests/
Vue CLI focuses on web-based projects with a modular structure, while TemplateStudio is tailored for Windows application development with a more traditional structure. Vue CLI offers greater flexibility for web development, whereas TemplateStudio provides a more guided approach for Windows-specific projects.
Set up a modern web app by running one command.
Pros of Create React App
- Simpler setup and configuration for React projects
- Faster initial development with pre-configured build tools
- Extensive community support and ecosystem
Cons of Create React App
- Less flexibility for customization without ejecting
- Limited to React-specific projects
- Larger bundle size due to included dependencies
Code Comparison
TemplateStudio (C#):
public class MainViewModel : Observable
{
public MainViewModel()
{
// TemplateStudio initialization
}
}
Create React App (JavaScript):
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(<App />, document.getElementById('root'));
TemplateStudio focuses on providing a more comprehensive template-based approach for various project types, including UWP and WPF applications. It offers greater customization options and supports multiple frameworks.
Create React App, on the other hand, is specifically designed for React applications, providing a streamlined setup process with minimal configuration required. It's ideal for quickly starting React projects but may require ejecting for advanced customization.
Both tools aim to simplify the development process, but they cater to different ecosystems and project types. TemplateStudio is more versatile across Microsoft technologies, while Create React App excels in rapid React development.
Rails-inspired generator system that provides scaffolding for your apps
Pros of generator
- More flexible and language-agnostic, supporting a wide range of project types
- Larger ecosystem with numerous community-contributed generators
- Highly customizable and extensible through plugins and custom generators
Cons of generator
- Steeper learning curve for creating custom generators
- Less integrated development experience compared to TemplateStudio
- May require more setup and configuration for complex project structures
Code Comparison
TemplateStudio (C#):
public class TemplateStudio
{
public void GenerateProject(string projectName, string[] features)
{
// Project generation logic
}
}
generator (JavaScript):
module.exports = class Generator extends Yeoman {
constructor(args, opts) {
super(args, opts);
// Generator initialization
}
async prompting() {
// User prompts and configuration
}
writing() {
// File generation and templating
}
};
The code snippets illustrate the different approaches to project generation. TemplateStudio uses a more structured, C#-based approach, while generator employs a JavaScript class with specific lifecycle methods for project scaffolding.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
Template Studio
Template Studio is a suite of Visual Studio 2022 extensions that accelerate the creation of new WinUI 3, WPF, and UWP apps using a wizard-based experience.
- Template Studio for WinUI (C#)
- Template Studio for WinUI (C++) (FUTURE)
- Template Studio for WPF
- Template Studio for UWP
Projects created with these extensions contain well-formed, readable code and incorporate the latest development features while implementing proven patterns and leading practices. The generated code includes links to documentation and TODO comments that provide useful insight and guidance for turning the generated projects into production applications.
To get started, install the appropriate extension, then select the corresponding Template Studio project template when creating a new project in Visual Studio. Name your project, then click Create to launch the Template Studio wizard.
See the roadmap to understand project priorities and upcoming milestones.
Build Status
CI | Nightly | |
---|---|---|
WinUI (C#) | ||
WinUI (C++) | ||
WPF | ||
UWP | ||
Shared |
- CI: Runs for all PRs and integrations and performs basic validation. Executes all tests in the Minimum* Groups.
- Nightly: Runs on a nightly schedule and generates and builds all combinations of project templates in addition to performing more exhaustive tests than CI. Executes all tests in the Build* Groups.
Features
Template Studio approaches app creation using the following six attribute sets:
Project type
First, how do you want your app's UI navigation to behave?
-
WinUI 3: Blank, Navigation Pane, Menu Bar.
-
WPF: Blank, Navigation Pane, Menu Bar and a Ribbon.
-
UWP: Blank, Navigation Pane, Horizontal Navigation Pane, and a Menu Bar.
App design pattern
Next, what coding pattern do you want to use in your project.
-
WinUI 3: MVVM Toolkit.
-
WPF: MVVM Toolkit, Code Behind, and Prism.
-
UWP: MVVM Toolkit, Code Behind, and Prism.
App pages
To accelerate app creation, we provide a number of app page templates you can use to add common UI pages into your new app. We currently include everything from a blank page, to common layouts (e.g., list/detail, web view), to pages that implement common patterns (e.g., app settings). Use the wizard to add as many of each page as you need, providing a name for each one, and we'll generate them for you.
Features
Specify which capabilities you want to use in your app, and we'll build out the framework for the features into your app, tagging TODO
items. Here you can add features that enable your app to interact with storage, notifications, layout theming, etc.
Services
Connect to data services, setup cloud connected services for your application, and enforce rules with the XAML Styler extension.
Automated Tests
Lastly, you can include test projects for your application to run unit tests or use Selenium-like UI test automation.
After selecting the items wanted in your app, you can extend the generated code on UWP, WPF or WinUI 3.
Documentation
Principles
- Generated templates will be kept simple.
- Generated templates are a starting point, not a completed application.
- Generated templates must be able to compile and run once generated.
- Generated templates should work on all device families.
- Templates should have comments to aid developers. This includes links to signup pages for keys, MSDN, blogs and how-to's. All guidance provide should be validated from either the framework/SDK/libraryĆ¢ĀĀs creator.
- All UWP features will be supported for two most recent RTM Windows 10 Updates. Those supported releases are Windows 10 May 2020 Update (version 2004) and Windows 10 May 2019 Update (version 1903).
- Templates released in production will try to adhere to the design language used in the current release of Windows 10.
- Code should follow .NET Core coding style.
This project has adopted the code of conduct defined by the Contributor Covenant to clarify expected behavior in our community. For more information see the .NET Foundation Code of Conduct.
Contributing
See CONTRIBUTING.md.
Privacy Statement
The extension logs basic telemetry regarding what is selected in the wizard. Our Telemetry Data page has the trends from the telemetry. Please read the Microsoft privacy statement for more information.
.NET Foundation
This project is supported by the .NET Foundation.
Projects we like and collaborate with
- Web Template Studio
- Rapid Xaml Toolkit
- Windows Community Toolkit
- Windows UI
- Windows App SDK
- Fluent XAML Theme Editor
- XAML Styler
Frameworks and libraries in generated code not created by our team
Frameworks
Libraries
Top Related Projects
This repo contains the Template Engine which is used by dotnet new
[Archived] This repository has been archived
CLI tool for Angular
š ļø webpack-based tooling for Vue.js Development
Set up a modern web app by running one command.
Rails-inspired generator system that provides scaffolding for your apps
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot