Brackets.io Your Text Editor, my IDE

Jamezs Gladney
6 min readDec 28, 2015

First off I prefer Brackets.io over Atom.io. It’s hard to explain why but Brackets.io hit the scene first, I was already looking for something to replace SublimeText and Intype was not cutting it. Don’t get me started on Notepad++. I love all these programs and what they do for the community especially those of us programmers that do not write in Java and C#, those poor souls will never be free of their IDE’s.

Brackets is a damn good IDE, oops did I offend you? Text editor, what is an IDE because I obviously don’t know. A vein of redditors where very assertive that Brackets.io, SublimeText, and Atom.io where not integrated development environments. In the context of someone that writes Java C# and C/C++, maybe not… but we are writing HTML, CSS, Javascript, PHP, and a host of augmented variants of those here. So lets just google that word, and click Wikipedia :

An integrated development environment (IDE) is a software application that provides comprehensive facilities to computer programmers for software development. An IDE normally consists of a source code editor, build automation tools and a debugger. Most modern IDEs have an intelligent code completion.

Ok lets see, program to make programs that programmers uses. Usually but not always includes : Text Editor (huehue), program that makes text turn into a programmer and program that lets programmer fiddle with it while its running, and spell checker. I’m idiot-ifying this on purpose, lets come off our religions, we are all programmers here.

Right, so we have a fresh installation of Brackets.io, and we want a powerful IDE, well maybe we should have installed VSCode, or Atom.io? VSCode is opinionated to Microsoft's world domination plans of TypeScript, (read young) and Atom.io is cumbersome. I’ll explain.

Brackets.io comes with JSLint installed with all the settings turned up to max. I swear it feels as if Douglas Crockford guides your hand, and the linter “just works.” Atom.io’s fell apart when I tried to actually start coding. The UI is amazing in Atom.io but it doesnt work in practice. JSLint is important here because its the syntax checker/spellchecker. Its a bit more opinionated than that but you get the jist. It running on save and showing me where I screwed up is the most important part of the ‘integrated’, in ‘integrated development enviroment’ for me. Copy pasting my code to jslint.com, repeatedly is not integrated development.

The first plugin you should install is Beautify. It formats your code like gofmt does as you save your changes, dont worry you can flick it off when it gets haywire from you writing bad buggy code. I say install it because it finds errors like unclosed braces. I remember some medium post about “JS Sucks because it doesnt have gofmt, go is better, whaaa!” So lets just nix that.

Next is Ternific, Brackets.io comes with something akin to IntelliSense, but we want to augment it a bit, it also features some refactoring tools like ReSharper. Oh yeah and Emmet if you are zen like that.

Next we need a debugger, Brackets.io used to come with Theseus, but now it needs to be installed. So we are installing Theseus. It goes without saying that if you are working on a Node.js project to install node-inspector, nodemon, and the like.

Some IDEs contain a compiler, interpreter, or both, such as NetBeans and Eclipse; others do not, such as SharpDevelop and Lazarus. The boundary between an integrated development environment and other parts of the broader software development environment is not well-defined. Sometimes a version control system, or various tools to simplify the construction of a Graphical User Interface (GUI), are integrated. Many modern IDEs also have a class browser, an object browser, and a class hierarchy diagram, for use in object-oriented software development.

Additionally we have something like a ‘compiler’, in the web world its just something that runs your code. Bracket.io’s shining feature is its live editor, it fires up a server and allows you to see live editing much like Dreamweaver. It kills off the Chrome DevTools, and while it won me over to brackets as I moved on to more JS oriented programming its pointless to me. Brackets-Builder-Extended fills in for other languages but all the damn thing does is “go build”, or “node file.js”. Some people need a magic push button. I’d like to point out that just because an IDE doesn't have a compiler doesn't make it an IDE is a rather stupid one. Especially when the languages don’t compile. (Looking at you r/node). There is also an open in browser plugin.

Next up I suggest installing any additional linters for languages that you use based on frameworks, or real languages; handlebars, angular, PHP, ngnix configuration files, go, JSON,… yatta yatta.

Next up some graphical changes. The one thing that annoyed me while using Brackets was the tab layout, its just annoying, so “Tab — Custom Working” is a godsend. Brackets Icons for a splash of professionalism, “Brackets CSS Color Preview” for making CSS work flow easier, AutoPrefixer also.

Integrated development environments are designed to maximize programmer productivity by providing tight-knit components with similar user interfaces. IDEs present a single program in which all development is done. This program typically provides many features for authoring, modifying, compiling, deploying and debugging software. This contrasts with software development using unrelated tools, such as vi, GCC or make.

Well here is the ‘real point’, we can all agree SublimeText (once put together), Atom.io and Brackets.io do this, but the immediate follow up on the wikipedia article is :

One aim of the IDE is to reduce the configuration necessary to piece together multiple development utilities, instead providing the same set of capabilities as a cohesive unit. Reducing that setup time can increase developer productivity, in cases where learning to use the IDE is faster than manually integrating all of the individual tools. Tighter integration of all development tasks has the potential to improve overall productivity beyond just helping with setup tasks. For example, code can be continuously parsed while it is being edited, providing instant feedback when syntax errors are introduced. That can speed learning a new programming language and its associated libraries.

Effectively a more immersed programmer will have to ‘turn’ on all the features that we have been talking about and whether or not that disqualifies Atom.io and Brackets.io I’m unsure. Once on the elements are integrated, that much is clear. Both programs have processes that make finding, installing, and customizing those features for development very simple. That last point is why I moved away from SublimeText it was horrible to use plugins for me. The plugins rarely worked, where buggy when they where, and where hard to configure. Atom.io still takes a bit to much configuration for me so I stayed with Brackets. If a Developer gets a list like the above or Brackets.io starts including more of these features in its core like it has already with code folding, and so on it’ll evolve fine.

Text Editors that plugin-digivolve, to IDE’s can get bloated up and take time to start like their larger cousins but I think that they get what the developer needs from them much better and serve as a sliding scale in power to what the developer knows and is learning. At no point do the hamper the developer by preventing them from being able to code without it like Visual Studio has become.

Looking at these three programs and the way they are used they are IDE’s for their target language. Maybe just very bad ones, you know because “JavaScript is bad, grunt grunt grunt”, so bad we are starting to make IDE’s out of them, talk about “Self-hosting”.

With the advent of cloud computing, some IDEs are available online and run within web browsers.

So in conclusion, Brackets.io is a damn good text editor, oops I mean IDE.

Lets make an IDE then!

--

--