Microsoft unveils full-stack web templates for Visual Studio Code

Wizard-driven Web Template Studio extension for VS Code speeds creation of web apps with React, Node, and Azure services

Microsoft is previewing an open source extension to its Visual Studio Code editor for building full-stack web applications. Called Microsoft Web Template Studio (WebTS),  the extension is intended to make it easy to build a cloud-based web app.

Developers can use WebTS to generate boilerplate code for a web application, choosing between different front-end and back-end frameworks, Microsoft Azure cloud services, and pages. Key to the tool is a wizard to generate an application as well as a READMe.md and provide instructions on use.

WebTS was built using the TypeScript superset of JavaScript and the React UI framework. It takes inspiration from Windows Template Studio, which is for native Universal Windows Platform applications. WebTS gives developers four sets of options to build an app:

  • Project types, with full-stack applications the only currently supported type.
  • Framework options to use for front-ends and back-ends. Currently, React is supported on the front-end and Node.js on the back-end.
  • App page templates that provide common UI pages to accelerate development. Current templates include blank page, common layouts, and pages implementing common patterns such as grid or list. With the wizard, WebTS can add pages as needed, providing a name for each one.
  • Azure cloud services options, with Azure Cosmos DB and Azure Functions currently supported.

You can download the nighlty build of the WebTS preview from the Visual Studio Marketplace. WebTS also can be downloaded from GitHub. WebTS requires Visual Studio Code 1.33 or above. Node.js and NPM or Yarn are needed, as well, to run generated templates.

Join the newsletter!

Or

Sign up to gain exclusive access to email subscriptions, event invitations, competitions, giveaways, and much more.

Membership is free, and your security and privacy remain protected. View our privacy policy before signing up.

Error: Please check your email address.

More about GitHubMicrosoftMicrosoft Azure

Show Comments
[]