Jon Stuebe

A Beginner's Guide to Front End Tools

sass bower front-end gulp grunt

A Beginner's Guide to Front End Tools

Posted by Jon Stuebe on .
Featured

sass bower front-end gulp grunt

A Beginner's Guide to Front End Tools

Posted by Jon Stuebe on .

There are so many great tools out there for getting started building a front end of your website. Unfortunately, most of these tools assume that you already know what every technical term means and how to use terminal. In a few articles, I hope to breakdown the different tools that exist for building a frontend and give some educational background on each.

There are two main paths you can go down in terms of tools: GUI and Terminal. What I mean by this is that any tool you use needs to be downloaded and ran on your system. But the two different ways of doing this can either be through GUI's like CodeKit or by installing them and running them through your computer's command line (terminal/iterm on mac, command prompt on pc). The overall end product will be the same, but most (developers) like their terminal based tools because of the modularity and customization that they allow. So for now, I will focus primarily on the terminal based tools as CodeKit offers their own set of documentation which I don't feel needs repeating.

For my own sake, I'm going to split this article into a series. My goal is to write one article a week. Hopefully by the end of the series you will have a good understanding on what each tool does, how they work together, and feel very comfortable using them on projects.

1. Terminal Basics

2. Node.js Install & Node Package Manager (NPM)

3. Javascript Task Runners (Grunt & Gulp.js)

4. CSS Preprocessors (Sass/Less)

5. Dependency Management (Bower)

user

Jon Stuebe