Can I just have a tutorial that tells me exactly what I need to do and know to set up Gulp, without spiraling into some unrelated discussion about HTML semantics, you wonder? Yes, you can. Here it is.
Is this article for you?
This article is for you if you’re looking for a tutorial that makes no assumptions and will list every step to install Gulp - from the beginning, in order, without any gaps.
This guide was also made on a Mac. A few steps will vary for Windows.
Prerequisites
- Basic knowledge of HTML, CSS, and JavaScript
- Basic knowledge of using the command line
Goals
- Install everything necessary to get Gulp up and running.
- Compile multiple Sass files into one CSS file, apply vendor prefixes, and minify.
Brief Overview
Gulp.js - the streaming build system is a JavaScript task runner that can automatically take care of redundant tasks for you. Like so many other useful tech tools, Gulp has no “getting started for beginners” guide to speak of. Their getting started guide, in reality, begins at step 6 or so. If you already know how Node and npm work and have everything installed, it’s great - but the beginner is only left more confused and frustrated.
I’m going to quickly summarize a few important concepts. Feel free to scroll back up to this after you’ve started making some progress for clarification.
- Node.js - an environment which enables running server-side JavaScript for the web.
- npm - a package manager for Node.js. A tool that allows you to quickly and easily set up local Node environments and plugins.
- Local vs. Global - Node.js is installed globally, but Gulp and all of its plugins will be installed locally on a per project basis.
- Task Runner - A task runner like Gulp automates all your processes so you don’t have to think about them. Gulp requires a package.json and gulpfile.js.
List of Steps
For my part, I will attempt to create the lost beginner’s guide to Gulp. I’m listing the steps so you know what you’re getting into.
- Install Xcode Command Line Tools
- Install Homebrew
- Install Node.js
- Install Gulp globally
- Install Node and Gulp locally
- Install Gulp plugins
- Set up project
There are plenty of ways to go about this, but this is the way we’re going to do it.
Note: Installing XCode and Command Line Tools is no longer necessary in 2016 - Homebrew will install the necessary CLI for you.
#automation #tools #tutorial #javascript #programming
