BIT-101 [2003-2017]

JavaScript Day 5: Writing Code


There’s a quote that I can’t quite remember, and that I attribute to one of the Gang of Four, but that may just be in my mind. Anyway, it goes along the lines of “buy cheap desks and expensive chairs.” The idea being that while you may have to look in the general direction of your desk much of the day, you’re in intimate contact with your chair almost every minute of your workday. Thus, it’s important that you have one you are very comfortable with.

A similar train of thought applies to the tool you use to write your code with. You’ll be writing, reviewing, editing, debugging, and compiling in a tool or multiple tools all day long. If you hate that tool, or any of those tools, you aren’t going to be too happy at the end of the day. That isn’t to say that there is any one perfect editor for anything, but you should do the best you can to find one that you, yourself, are comfortable with.

With that in mind, when I set out to learn me some JavaScript, I started looking around for a decent editor. I think over the course of a couple of weeks I tried almost every major one out there. I know that no matter what I say, a dozen people are going to chime in with their own personal favorites, insisting that it is the best. So I won’t try to stop you and I won’t argue with you, but I probably tried it. 🙂

I had a few criteria for what I wanted. Nothing too demanding.

  1. It should be relatively simple. A few I tried had really complex project setup procedures and it was a pretty heavy learning curve just to get a simple hello world up and running.

  2. Code completion/hinting in as much as is possible. I know it’s going to be limited in a loose language like JavaScript, but anything helps.

  3. Some kind of project paradigm, where I can save and re-open a project with related files.

  4. A launch system where I can hit a button or key combo and it will launch my browser of choice with a project-specific html file loaded up. In other words, if I’m editing myScript99.js in a given project, I should be able to hit a key and the editor knows that it should launch Chrome with the index.html file in that project.

  5. Free or relatively cheap would be nice, since this is just a hobby / learning project at this point. (I don’t mind paying a fair price for tools that I use professionally.)

That’s all. These may not be your important points, but they are mine, and I think a good number of people would go along with most of them.

What I came up with after much searching was…. Komodo Edit by ActiveState. This fits the bill in every one of the points above. First of all, let me point out that ActiveState makes two similar editors. Komodo Edit is completely free. Komodo IDE is a higher level product that will cost you a few hundred dollars. If you are just starting out like I am, the free version is all you need. It may be a little confusing when you go to the site to download it. But do take a look at the features of the full version IDE if you decide you like Komodo Edit. It may be well worth it to you.

As for the above features:

1 and 3. It’s really easy to get started with a project. Go to Project -> New Project…, create a directory for your project and save the project file with a name you want. The files in your active project will be in the upper left panel and your other projects will be listed in the lower left. Right click in the files area and choose New File or New File from Template to create a new file in the project. Also, any files you drag into the project folder will automatically be added to the project.

  1. Komodo has as good code hinting and completion as any other editor I tried out there for JavaScript and HTML. It’s no Visual Studio, but I don’t have any complaints about it.

  2. In the top tool bar, you’ll see a globe icon. Clicking that will launch the active file in the editor in the default way. Or you can use it as a drop down to select what browser you want to launch it in. Komodo comes with a built in browser, but I prefer to have it open up Chrome or Firefox. If you go into preferences, you can choose what browser you want to use, and add additional browsers to the list. The first time you launch any file, a dialog will pop up asking you what you actually want to launch. You can choose to launch that exact file, which is probably the case if you are editing an html file, or launch some other file. You probably want the latter if you are editing a JavaScript file – you want it to open up a specific html file that is associated with that file. For each file, you can also select a checkbox to have it ALWAYS open up the file you just chose, rather than ask you each time. The only thing I would add to this flow is the ability to set a project-wide default option, so that no matter what file I’m editing in a given project, it will always open such and such html file. Maybe that’s possible, I haven’t found out how. The keyboard command for launching is Ctrl-K + Ctrl-V. I’m not too fond of the double control combo, but it’s editable as well.

  3. As I’ve already said, Komodo Edit is free. It’s also triple platform: Mac, Windows, Linux. I’ve used the Mac and Linux versions and they are pretty indistinguishable from each other. That’s great. There are also a ton of other options and preferences in the program. Really fantastic tool for free. If this is as good as it is, and it’s free, I can’t imagine what’s in the full priced version.

So that’s my choice. I highly recommend it if you are looking for a decent editor. Anyway, feel free to tell the world about your favorite and why you like it in the comments.

« Previous Post
Next Post »