In this video tutorial, I’ll be showing a couple of packages that will help you format your code easily. If you are anything like me, you also love the code that is clean and formatted properly.

So let’s open up Sublime Text and start installing the packages that’ll help us format our code with very little effort.

HTML Beautify

The first package that you should have is HTML Beautify. You can install this package from Package Control. Just open up a messed up HTML file and select HTML Beautify from the Command Palette. You’ll immediately see that the package will re-format your entire HTML file or selected text to the proper formatting and indentation.

JavaScript Beautify

Just like HTML Beautify package, this package gives you the ability to format JavaScript files. With this package’s help you can even format a minified JS file just as an example even though formatting a minified JS file defeats the minification purpose.

JSON Reindent

As the name suggests, this package will format JSON which is unformatted. Just use it via the Command Palette option.

Alignment

If you are like me and you like to align your (=) symbol in your variable declarations or while making an associative array then this package is for you. Just install the package, select the text which you want to align and press Ctrl+Command+A on the Mac. If you are a Windows user you can use the option Alignment -> Key Bindings – Default to see the shortcut. You can also modify the Package’s settings by selecting Alignment -> File Settings – User.

Auto Semi-Colon

While I was writing code, I made a lot of mistakes of putting the semi-colon (;) in the wrong place. This handy little package helps me put the semi-colon at the end of the line as it’s supposed to if I make a mistake.

BracketHighlighter

This package will display the opening and closing brackets when you are in a code block.

DocBlockr

If you write comment blocks to describe your PHP methods that can be read by PHPDocumentor. This is the package for you as PHPDocumentor has a peculiar syntax in how to write code comments. You can define your function normally like you do and even complete it. Then just type /** above the function declaration line and press Enter. This will create a PHPDocumentor compatible code block. If you have type hinted your function arguments, it’ll even define the right annotations in that comment block.

CaseConversion

We’ve seen basic case conversion in Sublime Text which is Title Case, Lower Case and Upper Case. This package enables you to convert your selected text into a number of different cases. For example, snake_case, dash-case, PascalCase, camelCase, dot.case etc.

ChangeQuotes

You can also use this package to convert Single Quotes to Double Quotes or vice versa.

That’s it for this tutorial, in the next one, I’ll be showing you a couple of packages to extend Sublime Text’s autocomplete functionality.

Till next time, Good Bye.