Developer

SideWaffle handles the Visual Studio template creation dirty work

Get even more useful Visual Studio 2012 and 2013 templates when you download and use SideWaffle. These tips will help you get the most out of the extension.

ref_arch_iStock_000026809201Small.jpg
Image: iStock

All developers want to automate menial, repetitive tasks. When you can automate tasks, it boosts productivity and cuts down on potential problems that might occur when performing tasks manually.

One such task is creating a new project — after all, web projects or Node or Angular applications begin with the same artifacts and directory structure. Templates are one solution, as new projects are created with the appropriate template, and you are ready to go; this allows you to concentrate on coding with no worries about project setup and configuration.

While you can develop your own Visual Studio 2012 and 2013 templates, the SideWaffle extension adds a bunch of useful templates with only a few clicks. Visual Studio Ultimate 2013 is used in this article.

Get code and templates with your SideWaffle install

SideWaffle provides a collection of code snippets as well as project and item templates for popular items. The SideWaffle project is open source and hosted on GitHub, so it will continue to grow as more templates are added, and you can even add your own.

SideWaffle is easily installed via Visual Studio's Tools | Extensions And Updates window (Figure A) or direct download. Once installed, all of its templates are available for creating new projects or adding to existing projects. Since it is a Visual Studio extension, Visual Studio will alert you when/if there are SideWaffle updates (e.g., new templates).

Figure A

sidewafflefiga010915.jpg
Image: Screenshot by Tony Patton

Installing SideWaffle via the Visual Studio Extensions And Updates window.

A starting point for creating applications

Once SideWaffle is installed, a variety of new options will be available when creating projects. Figure B shows what was added when I installed it; the options include NancyFX, Durandel, Google Chrome projects, and HTML 5.

SideWaffle's real power comes with adding individual items to an existing project. The web templates are available under the Visual C# | Web | SideWaffle options in the New Project window (Figure B); additional SideWaffle options under other project types are visible in Figure B.

Figure B

sidewafflefigb010915.jpg
Image: Screenshot by Tony Patton

New project templates available via SideWaffle.

As an example, I created a new project (Figure C) using the HTML 5 Boiler Plate v4.3 template (Figure B). The project includes all necessary files for a standard HTML 5 application, including readme files, home page (index.html), icon file, and directories for CSS, JavaScript (including jQuery and Modernizr), images, and documentation.

Figure C

sidewafflefigc010915.jpg
Image: Screenshot by Tony Patton

New project created with the HTML 5 Boiler Plate v4.3 template.

With our base HTML 5 application, you can add new items to it via the Add New Item option. SideWaffle includes templates for all types of projects and applications; Figure D shows the extension's options for web projects, and there are even more options under the other item types shown.

Figure D

sidewafflefigd010915.jpg
Image: Screenshot by Tony Patton

Adding new items includes many options with SideWaffle.

I wanted to use my recently acquired AngularJS knowledge, so I added a new AngularJS controller, with the results shown in Figure E.

Figure E

sidewafflefige010915.jpg
Image: Screenshot by Tony Patton

A new AngularJS controller has been added via SideWaffle template.

Another way SideWaffle promises to boost productivity is through its code snippets for Angular, NancyFX, and others. I had a lot of trouble getting these snippets to work properly.

First, they do not appear in the snippet context menu (right-click in the code and select Insert Snippet), but a portion of them do appear to have been installed when viewing what is available via the Code Snippets Manager (CTRL K + CTRL B) (Figure F) (notice that only Angular snippets are available). However, they are only available when typing the snippet shortcut in the code window and pressing TAB (ngctrl, ngdir, and ngservice for Angular snippets). This features seems to need some work to be usable in my setup, so I will look for updates to hopefully correct it.

Figure F

sidewafflefigf012315.jpg
Image: Screenshot by Tony Patton

Code Snippets Manager shows a portion of the SideWaffle snippets installed.

Create your own templates

You can create templates with the help of SideWaffle. While the details are beyond the scope of this article, it is good to know that the extension includes SideWaffle-specific item templates to help with the process. It also requires the TemplateBuilder NuGet package.

Conclusion

The SideWaffle Angular-related templates are a blessing in my recent work. Another plus is the templates include things that I would probably forget and some I may not ever use like the humans.txt file included in the HTML 5 Boiler Plate template.

SideWaffle takes the guesswork out of building Visual Studio templates. You should jump on the bandwagon and use the extension the next time you start a new project.

About Tony Patton

Tony Patton has worn many hats over his 15+ years in the IT industry while witnessing many technologies come and go. He currently focuses on .NET and Web Development while trying to grasp the many facets of supporting such technologies in a productio...

Editor's Picks

Free Newsletters, In your Inbox