The world of front-end development has changed quite a bit of the past few years. When I was in college, I didn’t even know what a compiler was, let alone how useful they were. I wrote in plain ol’ CSS instead of using pre-processing languages like SASS or LESS. Furthermore, I didn’t even know enough about JavaScript to know that there were frameworks out there.
Fast forward to present time, and I couldn’t imagine my life without Koala. I actually had to write plain CSS for a quick project a little while ago, and it was the most painful experience ever. It was a grim reminder of what life would be like without a pre-processor. As for JavaScript, with performance ever on the brain, you would have to be crazy not to compile your scripts down to one, and minify that. That’s just easy bandwidth to save. To do both of these things, you need a compiler.
There are quite a bit of compilers out there in the world, some are command line, and some have a GUI. Personally, command line compilers can be a little annoying to get up and going, as you have to learn commands. If I can find a good program with a GUI, I’m going to use it, for sure. The more visual approach is a welcome site when you are trying to focus on bigger problems, like your project that the program is supposed to be helping you create. Though, it does look cool typing commands into a command prompt, I’m not gonna lie.
Enter Koala.
Koala is a great compiler with a very easy to use GUI. It can do quite a few things for you including: compile SASS/LESS, compile Compass, compile CoffeeScript, compile and minify Javascript.
Getting it set up is a breeze. Once the app opens, you can easily tell it what folder to watch. After that, it automatically detects all of the valid files that it knows how to compile. Simply click on one of those files, and a set of options opens up.
For instance, let’s take a SASS file. Whenever you click on a SASS file, you get quite a few options. The most convenient one would have to be auto compile; this option makes sure your compiled SASS stays up to date after every save. You can also choose to generate a source map along with the compiled CSS for easy debugging. Autoprefix is a life saver; one little checkbox and you never have to worry about prefixing a bunch of CSS properites. Lastly, you can choose to minify the compiled CSS, which is always helpful.
There aren’t as many options with JavaScript, besides minifying the script, which is useful. Other than that, you can use special comment code within the script itself to tell Koala to pull in other scripts. It’s pretty nifty for combining all of your scripts into a single export. The only downside of the JavaScript compiling is it doesn’t really play nice with frameworks, such as Angular.
In the end, I feel that Koala is a great app that can get you and your project up and running very quickly. All you have to do is install and run the program, tell it where the source files are, and you are off to the races. It’s hard to beat that simplicity.
Source by Kyle W Hawk
