Tools Practical solutions for front end tooling

Modern front end development is always changing. New tools are constantly cropping up and it can sometimes be difficult to stay on top of them all. However, it’s really important to realize that you don’t necessarily need to know everything that’s out there. All you really need to know are the good parts.

Atom.io

As far as text editors are concerned, Atom.io has it all. If you’re currently using Sublime Text, you’ll be right at home coding in Atom. It’s open source and super customizable…

atom-spotify - displays the currently playing song in Spotify in Atom’s status bar

CLI

Pretty much every new front end tool uses the command line. If you want to automate your tasks and delpoy right from your local build, then you’re going to spend a lot of time in the CLI. Most stuff is pretty simple, but you can get real advanced with it should you chose. Code Academy has an execellent and free introductory course right here.

Gulp.js

This has forever changed the way I code. I can’t even imagine building another site without Gulp.js, no matter how large or small. I seriously love this tool. You can automate any task imaginable and maintain clean, solid source code while simultaneously producing highly optimized production code.

Bower

Going along with build systems is a great package manager named Bower. I like it because it seamlessly integrates and you can quickly grab your dependencies:

$ bower install your-package-name

..And your done.

Yeoman

An excellent way to scaffold your projects, Yeoman has a generator for almost any app you can imagine — many of which use the same tools mentioned above.

GitHub

GitHub has so many practical uses, it’s ridiculous. Number one being versioning, which is insanely important… Especially if the codebase you work on has other team members in there all the time. Beyond that, it’s great for housing snippets, documentation and public collaboration. You can even publish content directly on GitHub Pages at no cost to you. Nice.

Surge

Surge is fairly new to me. Basically, it’s free and works just like any other CDN for your static sites. You can deploy straight from the command line and even setup a custom domain name in only seconds.

Slack

Even if you’re not working on a big team, Slack is a great tool for taking notes, tracking progress and communicating with clients. There are lots of channel integrations and you can set it up as a virtual watch dog for your server. Slack will ping you instantly. It’s also just plain ol’ fun.

Conclusion

That’s nowhere near the amount of options a front end dev has today. If you want to get the best tools and not pay a penny, check out and follow what other people are doing. Read their source code on GitHub. Follow a publisher. Staying informed and sharpening your skills will help you make the right choices amongst the vast array of modern front end tools.