I’m a fan of web applications, but I’m used to having a great development environment at my fingertips. I’ve never understood the appeal of using a glorified notepad to write code. I think most of us could do it, but why would someone want to? It’s like painting a house with a toothbrush.

Visual Studio is much better; it’s like a house painting kit. I would rather have a full painting kit than one brush, even one larger than a toothbrush, but kits usually lack specialized tools. Trust me; the job is much easier if you have the right tools.

If Visual Studio gives you a few buckets of paint and several brushes, JustCode Q1 2013 gives you the shades of paint and brushes you’re missing. We love the web, and we want to help you create your masterpiece.

Do More with LESS

LESS is CSS with a ton of great features. JustCode now supports this file type so it feels like a standard code file in Visual Studio. With JustCode, you have the colorization, navigation, code analysis, and refactorings you expect in CSS files but for LESS.

To get started, you can simply rename your site’s CSS file to the .less extension, add an existing less file (there are some great ones in Kendo UI and Twitter Bootstrap), or add a new less item to the Solution. One warning: if you rename a file to .less, Visual Studio sets the Build Action to None and you must change it back to Content for JustCode to analyze the file.

Most browsers don’t directly support LESS, and it’s customary to convert LESS to CSS before deploying. To do this with JustCode, right-click the file in the Solution Explorer and choose either Just Compile to CSS or Just Compile to CSS and Minify, according to your preferences. These functions are also available from the Code section of the Visual Aid menu.

If you renamed a CSS file and did this, then an identical CSS file is the output. So what’s the big deal? LESS supports all those features you wish CSS had such as variables, functions, mixins, hierarchal definitions, and more. To get a full picture of what you can do, go to lesscss.org. The website describes the language with tons of examples.

Configuring Code Analysis and Styling for LESS

We added menu options for controlling code analysis and styling for LESS files.

In JustCode User Options, under Code Analysis, you can control how it handles both code problems (what we now call error and warnings) and hints. Here’s a screenshot to help you find them.

There are several styling options available under the Code Style menu. We also added a hint that if you click a label, we’ll show you how the option affects the styling rule.

Both analysis and styling options are available as Solution Options as well.

Compatibility with Web Essentials

If you use recent versions of Microsoft Web Essentials or the current release of ASP.NET with Web Tools, you already have some LESS functionality. JustCode is compatible with these tools, so there’s no need to change your workflow.

Compatibility is a concern, but it doesn’t provide incentive to use both products. Here’s what JustCode adds on top of the capabilities provided by Web Essentials:

• Enhanced navigation
• Refactorings
• More colorization
• Color Chooser
• Structural Highlighting
• Compilation Results Window (when multiple files are selected for compilation) showing detailed information
• Code Templates

Code Templates for HTML, CSS, and LESS

We were going in deep with LESS, so we added Code Template support for LESS files. Since LESS extends CSS, it only made sense to include them for CSS files. Why stop there? We threw in HTML templates to complete the cycle!

Kendo UI Templates

Don’t confuse Kendo UI Templates with Code Templates. These templates take advantage of using a MIME type not recognized by browsers for the TYPE attribute of a SCRIPT tag, preventing the browser from parsing that particular script section. Kendo UI uses these tags marked with the MIME type text/x-kendo-template as item templates, and this is perfect for dynamically generating content for tables or other controls containing variable data. Here’s an example of one of these templates.

More to Come

JustCode Q1 2013 is an exciting release for web developers, and these features open up many possibilities for the future. Let us know what you would like to see in future releases of JustCode by visiting our Feedback Portal. We look forward to hearing from you!