From NetBeans to Sublime Text 2 with Drupal

Hey hey, I've wasted a couple of hours recently in a search of a better IDE than NetBeans and I want to share my experience with you guys.

Why not NetBeans?

Well, lots of times it's really slow. Slow in terms of function definition look-up, autocompletion and overall project browsing and everything that has to do with the IDE itself. Don't get me wrong, I do like NetBeans, I like it more than huge and clusmy Visual Studio (back in the win days) or Eclipse, it has all that I need, and even more: seamless version control systems integration, code debugging, etc. But I constantly had this feeling that there's something better out there. Once I had to work with LESS framework and I couldn't make NetBeans understand the mark-up. Then I've remembered how difficult it actually is to install a package for NetBeans (usually all of my earlier attempts resulted in breaking NetBeans settings and reinstalling NetBeans).

And lets not forget, because NetBeans is based on Java, it eats up a LOT of memory.

And one more detail, usually when I have a fresh Ubuntu Install and a fresh NetBeans install, NetBeans' theme looks aweful. Usually guys in our office write a custom launcher that overrides the default theme to make NetBeans look acceptabile.

All-in-all, I just wanted to explore for something better.

Say Hi to Sublime Text 2

First time I took a look at Sublime Text 2, I saw it as a simple text editor. Well not a simple one, it was a small one, cute one and expensive one. So I didn't dive deep into it.

But recently, I've seen that some of my friends were using this editor for their first HTML lessons, and I thought to actually give it a try (..and I found out that you can use the Unregistered version as much as you want, a sort of Infinite Trial - hopefully it's true).After I gave it a little time and overpassed all of its minuses, I'm pretty much happy with ST2 (I've worked with it so far just 2 days, I still have some issues but hopefully I'll overcome those as well).

I want to say that ST2 is fast, lite and SEXY. Yes, that's right, it's just very sexy: I love everything, from the theme itself up to the smooth way that the cursor fades in and out (which is even customizable). ST2 has some awesome features that make code-writing fun again, khm-khm, I mean, quick, efficient and fun ;) You will notice yourself how quick ST2 is, meanwhile I'll talk about setting it up.

I'll do my best to share all of my experience gathered in these hours, from unpacking and shortcut creation to optimizing ST2 to work with PHP / Drupal.

As a part of "Saying Hi" we'll need to go here and download the Sublime Text 2 (doh!): http://www.sublimetext.com/2Download it and unpack it in your /home/<user>/ directory (I'd recommend to rename the editor folder to /home/<user>/SublimeText2 (get rid of the spaces)).

Now by launching the /home/<user>/SublimeText2/sublime_text you can explore the ST2 by yourself.

Customizing Sublime Text 2

So far so good, first things I'd suggest you to do (assuming you are using some Ubuntu Desktop version) is to create a shortcut icon and a terminal shortcut for ST2 to open files with it from the terminal.

http://www.technoreply.com/how-to-install-sublime-text-2-on-ubuntu-12-04-unity/ - that's a good link to start-off.

To be short, to create a terminal command to quickly open files via subl short command, type this in your terminal:

sudo ln -s /home//SublimeText2/sublime_text /usr/bin/subl

Now you can type something like: subl my-text-file.txt and work with your file.

To create a Unity Launcher follow steps from the website above, slightly adjusting them to your own needs:

[Desktop Entry] Version=1.0 Name=Sublime Text 2 # Only KDE 4 seems to use GenericName, so we reuse the KDE strings. # From Ubuntu's language-pack-kde-XX-base packages, version 9.04-20090413. GenericName=Text Editor

Exec=subl Terminal=false Icon=/home/nikro/SublimeText2/Icon/256x256/sublime_text.png Type=Application Categories=TextEditor;IDE;Development X-Ayatana-Desktop-Shortcuts=NewWindow

[NewWindow Shortcut Group] Name=New Window Exec=subl -n

There, now when you will type in Super > Sublime .. you will see the Icon right there. 

Working with a Project

At this point, we just created a neat substitute for gedit and we can easily work with different source or mark-up files. But, of course, we want more. Lets start with something a bit more interesting.

Basically to create a project, one must Open a Folder and then go to Project > Save Project As... and save the project in the root directory if your project (don't forget to add those to .gitignore file or to ignore those in your SVN). Once a project is opened, you can use Goto Anything functionality (Read more here: http://www.sublimetext.com/). This is an awesome and easy to use functionality, basically makes all of the code right under your fingertips.

Optimizing Sublime Text 2 for Drupal / PHP / LESS

I will not cover such things as vertical editing or multi-line editor, different useful shortcuts and stuff, basically because you cand find them all over the web (or right on their website). I'll try and cover some of the topics which were important for me as a developer.

First of all, setup the defaults according to your coding standards. Yes, this is very, VERY important. Go to Preferences > Settings - Default, specify such things (i.e. for Drupal): tab_size: 2, translate_tabs_to_spaces: true, etc.

Now, we need to install so called "Package Control" plugin to tweak our ST2 further. For this we need to follow steps from this website: http://wbond.net/sublime_packages/package_control/installation

So, we go to View > Show Console to bring up the Console, and then we paste the huge string (from the link above) ;) and hit enter. Restart ST2. Now if you press CTRL + SHIFT + P and type Package Control, you will see all of the magical things you can do.

Assuming you are a Drupal developer (well, if you are not, then you can definitely find other plugins) two of the missing things are autocompletion and source definition (code/software archeology - it's when you would click on a function and hold down CTRL, it would point you to its definition in NetBeans).

To make ST2 handle autocompletion we need to do the following: SHIFT + CTRL + P > Package Install > Drupal Project Autocomplete (read the text, don't forget to add to .gitignore the extensions). Now our project has autocomplete support.

Goto Definition was a little bit trickier to handle (I bet you've installed already other Drupal related suggested plugins, hehe, see how easy it is? Now compare that to NetBeans :D). For this feature we need to install ctags. This is a feature that indexes all of the functions and classes and other neat things and is later used by other 3rd party apps to look things up. First we need to install ctags.

sudo apt-get install ctags

Now we need to install the Ctags Plugin and tweak it a little: SHIFT + CTRL + P > Package Install > Ctags (NOT FOR PHP)

Now go to the plugin itself: SHIFT + CTRL + P > Browse Packages and go to Ctags folder and edit "CTags.sublime-settings" file. Now replace ctags_command line with this one (source):

"ctags_command" : "ctags --langmap=php:.engine.inc.module.theme.install.php --php-kinds=cdfi --languages=php --recurse -f .tags",

Restart ST2. Now within your project, type CTRL + T, CTRL + R, and wait a bit (it will type in the bottom when it's done, but even thou' it's not really accurate).

And, as you probably already guessed it, same easy way we can install LESS support and work beautifully with our projects.

Also there are formatting plugins and block commenting plugins, and if you didn't notice, there's a Drupal Snippets plugin.

Wrap up 

Some might use Sublime Text 2 as a substitute for gedit (for quick single file editing) some might use Sublime Text 2 as a fully featured IDE - in any case, it's a powerful, fast, easy-to-use and beautiful text editor. It has lots of modern plugins that can be installed by simply selecting those in the Command Palette. It has a geek-friendly Goto Anything search.

And it's simply Sexy.