After watching this talk from Paul Irish the only logical this was to follow his advice and become enthusiastic about my tools. In the last two months I have learnt so much about programming from Makers Academy. In addition I have learn a surprising amount about things that aren’t directly programming. I started this post writing about all the tools that I use; the terminal, testing frameworks, dotfiles, text editor and possibly more. As this rapidly grew out of control I have cut it back to just the text editor with the others to follow in the future.
Sublime text 3 is the editor I use, I have also tried vim and brackets but Sublime is the one I have stuck with. The reason for my choice is Sublime does everything obviously, this allowed me to start quickly and yet the more you learn the more it improves. It is most like the onion application mentioned in Paul’s talk. On the other hand Vim has been described to me as having a ‘learning wall’ which you must overcome to do even the simplest tasks. Right now I don’t have the time to set aside a week or more to learn. The few times I have experimented with vim have been enticing, there is obviously great power there. Brackets is also very nice but a bit too focused on the HTML, CSS, JS trio and left me wondering if it would be the best choice considering how ruby dominated my coding is at the moment.
Getting started with Sublime the first thing required is to install it. It’s easily done and on Linux Mint it can now be done with a PPA. From the off Sublime gives you is a clear sidebar and syntax highlighting for a huge number of formats, from C to Erlang and LaTeX. In sublime it is easy to change user settings of such things as the tab size. The default is 4 but mine is now 2 as I try to follow this Ruby style guide as much as possible.
Sublime has a huge number of useful shortcuts, I am in the process of writing a tutorial for the most useful. Even ignoring vintage mode (which allows vim inspired keyboard wizardry) there are still a huge number of keyboard short-cuts. Some of the most useful are
- Alt + number - used to change the open tap that has focus
- Alt + Shift + 2 - change to two column layout
- Ctrl + d - select the whole word around the cursor
- Ctrl + d - find subsequent occurrences of the same word
- Ctrl + l - select whole line
- Shift + Ctrl + up/down - move selected lines up or down
- Ctrl + k -> k - delete to the end of the line
- Ctrl + k -> backspace - delete to the beginning of the line
- Ctrl + n - new file
- Ctrl + p - find file
Sublime is able to support multiple cursors for parallel editing. This was awesome the first time I saw it. It allows you to edit the same thing in several places at once, for example adding the same text at the beginning of several lines. To bring up a second cursor holding Ctrl click where it should be . The tip I have is remember to not hold Ctrl when placing the cursor at the first place you need it.
All of the above magic though is trivial compared to what can be achieved with packages that can be added to Sublime. There are many to do simple things, like add syntactic highlighting for languages that aren't bundled as default. For example coffeescript and Haml. To get started with packages it is best to install package control which will make it much much easier to deal with other packages.
First up is Sublime Linter. This package checks the quality and styling of you code in real time. Such things like indentation consistency, closing quotes and brackets. At first it felt like I had invited an awful nag to code with me, it’s true they can hurt your feelings, but if you are constantly correcting the little errors it will complain only about one thing at a time. Come to looking back on your code and you will be very pleased that it is all 'nice’. This package does require others for each language you want to be able to lint. Rubocop for Ruby, JSHint for JavaScript
Next up Fetch. This one allows you to save uri’s of useful resources and with one command import these. This can be a file or whole file system. The nice thing is that if you choose your uri well it will be updated and you will have the most recent version of the resource when imported. So far here I have a css reset page and the Jasmine stand-alone test framework.
Numero. 3 is Git Gutter. This is a simple little app that adds to the gutter (left hand side of text area) symbols indicating the change to each line since the last git commit. Although not always that important it acts as a nice reminder to show what changes you have been working on. This makes naming commits easier and prompts me to commit more regularly.
Last but certainly not least is Emmet. This is an evolution from Zen coding which still allows you to create html with much less coding than normal. It uses css syntax familiar to those who use jQuery to generate html code. I have used this a lot to quickly generate html with all the closing tags. When creating just one tag at a time its use is minimal but creating whole sections of nested elements becomes trivial. For example type in
section.centered>((header>h2)+ul#this-list>li*5)
Then press tab to get
<section class=“centered”>
<header>
<h2></h2>
</header>
<ul id=“this-list”>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</section>