Windows 10: Announcing Microsoft Web Template Studio

Brink · May 15, 2019

Today, we are excited to announce an early release of Microsoft Web Template Studio, a cross-platform extension for Visual Studio Code that simplifies and accelerates creating new full-stack web applications. Web Template Studio addresses a top community ask from developer surveys and 1-1 conversations with developers: Make it easy to create a new cloud-based web app. Web Template Studio uses a dev-friendly wizard to generate your application and provide a ReadMe.md to give you step by step instructions to get up and developing in no time. Best of all, Web Template Studio is open source on GitHub.

Our philosophy is to help bootstrap your app with what you need but not do so much that you’re deleting code and breaking stuff. We also strive to introduce best patterns and practices. Web Template Studio is extremely early in development, but we feel this is a great time to show it to the community and get a broader set of feedback. Web Template Studio currently supports one full-stack app path with React and Node.js. We want to partner with the community to see what else is useful and should be added. We know there are many more frameworks, pages and features to be added and can’t stress enough this is a work in progress. If there is something you feel strongly about, please let us know. Of course, we’re always willing to accept PRs. We want to be sure we’re building the right thing.

Web Template Studio takes the learnings from its sister project, Windows Template Studio which does the same concept but for native UWP applications. While the two projects target different development environments and tech stacks, they share a lot of tech under the hood.

Installing our nightly build

It is extremely easy, just head over to Visual Studio Marketplace’s Web Template Studio page and click “install”. In addition, you’ll need Node and Yarn installed as well.

A Lap Around Windows Template Studio

We launch WebTS by simply using the shortcut and typing in Web Template Studio. Super simple. This will fire up the wizard and you’ll be able to start generating a project in no time.

Step 1: Project Name and Output path

You start with your project name and output path.

Step 2: Project Type

Once you have selected a project type, you need to select a framework. You can select from Code behind, MVVM Basic or the very popular MVVM Light.

Step 3: Frameworks

Next, which frameworks do you want to use for your frontend and backend? We currently support one framework for frontend: React.js and one framework for backend: Node.js as this is an extremely early release.

Step 4: Pages and Cloud Services

To accelerate app creation, we provide several app page templates that you can use to add common UI pages into your new app. The current page templates include: blank page, common layouts (e.g., master detail) and pages that implement common patterns (e.g., grid, list). Using the wizard, add as many of the pages as you need, providing a name for each one, and we’ll generate them for you. Lastly, you specify which Azure cloud services you want to use, and we’ll build out the framework for the services into your app including tagging ‘TODO’ items. Currently supported services cover storage (Azure Cosmos DB), and compute (Azure Functions). We’ll even work on getting these initially deployed for you as well!

Step 5: Summary and generate

Simple as reviewing what you selected, being sure you’re ok with the licenses you’ll be adopting with your choices, and then clicking “Generate”. If you have a service, we’ll help you deploy it.

Step 6: Running your app

Click the “Open project in VSCode” link. You can open up your Readme.MD file for helpful tips / tricks and then to get the webserver up and running, for React/Node.JS, you just need to open the terminal then type “yarn install” then “yarn start” and you’re up and going! As you can see, the web application is a solid starting point. It pulls real data, allows you to quickly refactor so you can spend your time on more important tasks like your business logic.

Preview upcoming features

We have done most testing inside WebTS on the React framework with Node.JS, however we do experimental versions for Angular and will be adding in Vue shortly too! If you want to kick the tires, go to Settings in Code and enable the Preview Mode option.

Open source and built by Microsoft Garage Interns

Web Template Studio is completely open-source and available now on GitHub. We cannot stress enough that this project is community led. We would love for you to contribute to the project and would encourage you to read our contribution guidelines for next steps. A public roadmap is currently actively being worked on as we need more feedback from the community.

We’d also like to directly state we’re proud to be created by Microsoft Garage interns. The Garage internship is a unique program for talented students to work in groups of 6-8 on challenging engineering projects. The Garage drives three primary goals, collaboration, creativity, and experimentation. The team partnered with teams across Microsoft along with the community to build the project. It has gone through multiple iterations variations to where it is currently today. I can’t tell you how proud I am of the work Amr, Danish, Imho, Jimmy, Kai, Kelly, Sahil, and Trevor did and humbled by how everyone supported their idea.

What is even more exciting is we have the new Garage interns working on the project as well over the next few months! They just started this week and are already digging into the project and how they can improve.

Get Started Today

Web Template Studio nightly are available now. We have extremely easy to use instructions for installing the VS extension on our GitHub page. We would love to hear how your experiences are using it and the helpfulness of the project. You can reach Clint at @clintrutkas. What are you waiting for? Go and try it out for yourself now!
Click to expand...

Source: https://blogs.windows.com/buildingap...mplate-studio/

:)

Brink · May 15, 2019

Announcing Windows Template Studio

Today, we are pleased to announce the next evolution in your File → New Universal Windows Platform app in Visual Studio – Windows Template Studio. Windows Template Studio addresses a top community ask in our developer survey to make it easier and provide guidance to create new projects that target the Universal Windows Platform. In this post, we’d like to spend a few minutes introducing Windows Template Studio and show you how it works.

Windows Template Studio uses a dev-friendly wizard to get your UWP apps to F5 in no time, bringing together the pages, frameworks and features that you want. Our wizard walks developers through four steps to quickly scaffold a new UWP app:

Project Type: Select between standard layouts and predefined controls.

Framework selection: Select the structure of your UWP app with in-house and third-party support.

App pages: Select which pages that make sense for the app, that you are trying to create.

App features: Easily add features such as background tasks with one click.

Furthermore, we’re open-sourcing Windows Template Studio, welcoming UWP devs to take the generation engine further – adding additional capabilities and app pages, improving the implemented best practices and patterns – and encouraging UWP devs to make the engine their own – tailoring it to their company’s specific needs.

Windows Template Studio is the evolution of Windows App Studio. App Studio was a free, online app creation tool that allowed developers and enthusiasts to quickly build Windows Universal Apps. We are taking our learnings from the code generation engine and the existing wizard to provide a strong foundation for our code generation and developer experience in Windows Template Studio.

A Lap Around Windows Template Studio

We kick off Windows Template Studio by creating a new UWP app project. In the Visual Studio 2017 ‘New Project’ dialog, select the Visual C# → Windows Universal node.

Here you’ll see the Windows Template Studio project. Select the project type, enter in your new UWP app’s name and click ‘OK’. Windows Template Studio will now fire up and walk you through the UWP app creation wizard, step by step.

Step 1: Project Type
You begin by selecting a project type. We’ve started you with the most common types such as: blank, navigation pane and pivot and tabs.

Step 2: Framework
Once you have selected a project type, you need to select a framework. You can select from Code behind, MVVM Basic or the very popular MVVM Light.

Step 3: Pages and app lifecycle features
Once you have selected a project and framework, then it is time to add in pages and features. We’ve already added the most common pages such as Master/Detail, Settings and Web view. You can also easily add in Application Lifecycle features such as Suspend and Resume as well as Background Work and User Interaction.

Best practices and patterns

To wrap all of this up, with a couple of simple clicks, you can wire up an app that uses the Navigation Pane, MVVM Light framework, a Master Detail page and a couple of features such as suspend and resume and Azure hub notifications. You save time, your app is adhering to our design guidance and industry standard patterns and practices come free.

Below is an example of an app generated with Windows Template Studio. Again, we provide the foundation of a great UWP app and get you to F5 in a couple of clicks.

Get Started Today

Windows Template Studio v1.0 is available now and you can expect updates every 6 weeks. We have extremely easy to use instructions for installing the VS extension on our GitHub page as well. A public roadmap is currently available and we’d encourage you to check out The Tips and Tricks for UWP Developer session that was shown at Build to learn more. You can get started creating your own app in three simple steps:

Download Visual Studio 2017 and select Universal Windows Platform development under Workloads.

Install the Visual Studio Extension for Windows Template Studio by downloading the VSIX from the Visual Studio Gallery.

Once installed, open Visual Studio 2017 and select File→ New Project→ C# → Windows Universal and you should see the new template that was just added.

And Best of All…Windows Template Studio is Open Source

Windows Template Studio is completely open-source and available now on GitHub. This project is community led and we’re very excited to already have contributions from the following community members: Matt Lacey and James Croft. We would love for you to contribute to the project and would encourage you to read our contribution guidelines for next steps.

In the spirit of being transparent, the roadmap for the next release is always available. If you have a bug that you would like to report or share a feature request, then please add it to our issue tracker.

We would love to hear how your experiences are using it and the helpfulness of the project. You can reach Clint at @clintrutkas and Michael at @mbcrump. What are you waiting for? Go and try it out for yourself now!
Click to expand...

Source: Announcing Windows Template Studio - Building Apps for Windows

Brink · May 15, 2019

Windows Template Studio 1.1 released

We’re extremely excited to announce the Windows Template Studio 1.1. In partnership with the community, we’ve been cranking out and iterating new features and functionality. We’re always looking for additional people to help out and if you’re interested, please head to our GitHub at microsoft/WindowsTemplateStudio.

How to get the update:

There are two paths to update to the newest build.

Already installed: Visual Studio should auto update the extension. To force an update, Go to Tools->Extensions and Updates. Then go to Update expander on the left and you should see Windows Template Studio in there and click “Update.”

Not installed: Head to Windows Template Studio - Visual Studio Marketplace, click “download” and double click the VSIX installer.

Improvements to the Wizard:

Page Reordering

The first page doesn’t have to be the Blank page

Renaming of pages and background tasks

Offline improvements

Initial work for supporting localization

Code analysis was added

Page updates:

Grid page added

Chart page added

Media/Video page added

Web View page has been enhanced

Feature updates:

Store SDK Notifications added

SettingStorage now has a binary save option (not just string based)

Template improvements:

Navigation panel moved to UWP Community Toolkit

Styling adjustments

ResourceLoader performance improvement

For a full list of issues fixed in the 1.1 release, head over to Github.

What else is cooking for next versions?

We love all the community support and participation. We’re partnering with additional framework Caliburn.Micro and have a branch currently under development with Nigel Sampson. We’re talking with Prism and Template 10 to see how those frameworks can also be added in. In addition, here are just a few of the things we are currently building out:

Fluent design in the templates

Project Rome features as options for your project

Right-click->add support for existing projects

Localization in the wizard

Accessibility supported in both wizard and in the templates

If you want to help out, please head over to microsoft/WindowsTemplateStudio.
Click to expand...

Source: Windows Template Studio 1.1 released! - Building Apps for Windows

Brink · May 15, 2019

Windows Template Studio 1.6 released

We’re extremely excited to announce the Windows Template Studio 1.6!In this release, we added in app scheme launch, finalized our work for localization, massive improvements in accessibility, and started our work for Visual Basic support.

What’s new:

Full list of adjustments in the 1.6 release, head over to WTS’s Github.

New Pages:

Image Gallery

New Features:

Drag and drop source

Web to App Link

Template improvements:

Minor tweaks for Fluent

Discovered a few pages that set background color

Improvements to the Wizard:

Lots of under the hood bug fixes and code improvements

Much more Visual Basic engine work

Work for supporting multiple projects in a single solution

Work to support Prism

How to get the update:

There are two paths to update to the newest build.

Already installed: Visual Studio should auto update the extension. To force an update, Go to Tools->Extensions and Updates. Then go to Update expander on the left and you should see Windows Template Studio in there and click “Update.”

Not installed: Head to Windows Template Studio - Visual Studio Marketplace, click “download” and double click the VSIX installer.

Known issue

We are tracking an issue (#1532) when uninstalling / upgrading where you may get an error of “A value for ‘Component’ needs to be specified in the catalog.”

If you get this error, we need logs to help track this with the help of the Visual Studio team. We don’t know how to reproduce it, but we know a few people have hit this scenario.

We have how to capture these logs in the tracking issue on GitHub.

What else is cooking for next versions?

We love all the community support and participation. In addition, here are just a few of the things we are currently building out that will in future builds:

Visual Basic support (In nightly)

Prism support (In nightly)

Improved update system to help increase speed of startup and file size download

Improved user interface in-line with Visual Studio

Continued refinement with Fluent design in the templates

Ink templates

Improved Right-click->add support for existing projects

With partnership with the community, we’ve will continue cranking out and iterating new features and functionality. We’re always looking for additional people to help out and if you’re interested, please head to our GitHub at microsoft/WindowsTemplateStudio. If you have an idea or feature request, please make the request!
Click to expand...

Source: Windows Template Studio 1.6 released! - Building Apps for Windows

Windows 10: Announcing Microsoft Web Template Studio

Announcing Microsoft Web Template Studio

Announcing Microsoft Web Template Studio

Announcing Microsoft Web Template Studio

Announcing Microsoft Web Template Studio - Similar Threads - Announcing Microsoft Web

Microsoft Whiteboard Announces Preview of New Templates

Announcing Microsoft Web Template Studio version 2.0

Microsoft announces new Outlook on the web is ready

Microsoft Announces Visual Studio 2019

Windows Template Studio 1.2 released

Windows Template Studio 1.5 released

Windows Template Studio 1.1 released

Windows Template Studio 1.3 Released

Announcing Windows Template Studio