Brosteins

Developers, Technology Evangelists, Bros.

Learning Gulp

Over the past week, I have been starting to use the Visual Studio 2015 RC, primarily focused on ASP.NET 5. Of the numerous new features and changes, I’ve found myself gravitating towards learning Gulp.

I was the .NET developer that stayed within the Microsoft ecosystem – I started learning .NET in the early beta days, and my first real development job was using Visual Studio .NET. I grew up using Web Forms, and didn’t really pay attention to the rest of the development ecosystem. Over the past 5 years, I’ve been changing – and growing to appreciate the development community outside of .NET.

Now, with ASP.NET 5 and built-in support for Gulp (and Grunt) in Visual Studio 2015, it’s time I really sat down and learned what is possible with Gulp. As I’m learning Gulp, I’m going to be sharing what I find here.

Starting Out

The first place I started was walking through Microsoft’s documentation on integrating Gulp into an ASP.NET 5 project. This walk-through was very helpful – it got me up and running with Gulp pretty quickly, introducing me to some of the basics. After walking through the exercises the docs outlined, what I understood Gulp to be was a JavaScript-based task runner, in which I could use to easily transform data stream content via a dot-notation/fluent API.

This was my first understanding of Gulp, but I wasn’t really sure of how or why I would integrate Gulp into my everyday development processes.

A Gulp Plugin – Why Not?

To better learn Gulp, I thought I should write a simple plugin – after all, the best way I learn is to do, and writing a plugin for Gulp is just a few steps removed from contributing back to the source.

As I started down the path to writing a plugin, I landed on the Gulp plugin readme page. I read about basic guidelines, buffers, streams, and testing recommendations. form what i gathered, my plugin (whatever it may be) should be simple, single-purposed, not reproduce existing functionality, and well-tested. The plugin should also handle streams.

Streams

Without knowing much about streams (in the Gulp world), I headed over to the Node.js stream API documentation. Node.js streams aren’t too far off from my .NET knowledge of stream, and the API is straight-forward enough to get started relatively quickly. My main take-away from learning about streams was there are 4 types: Readable streams, Writable streams, Duplex (readable and writable) streams, and Transform streams (duplex streams that have a predictable output computed from the input).

The Node.js streams API documentation has quite a bit of information on how to consume streams, extending streams by implementing a customer steam, and even how streams work under the covers. Although this is all fascinating, I focused on how to consume streams to understand the bare bones. Perhaps I’ll come back to the other sections at a later time.

Vinyl

After reading up on stream basics, the Gulp docs pointed me to Vinyl, a JavaScript-implemented virtual file format used by Gulp to describe “files” and basic metadata about files. Before getting too deep into Vinyl, I found a great link to a Gulp primer, that after reading I hit that “a-hah” moment. I highly recommend reading this primer, but I wouldn’t start with it first. If I had read the primer without going through the Visual Studio tutorials, I feel I may have skimmed over the contents too much, and I wouldn’t have appreciated the philosophy of Gulp.

What’s Next

I’m still reading and learning Gulp, and I hope to have more updates soon, so check back. If anyone has an recommendations, thoughts, advice, please let me know. I’d love to hear from you.

Share

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.