Jump to content

Grunt? Gulp? Something else?

OrganizedFellow

By OrganizedFellow,
in Dev Talk

 Share

Recommended Posts

OrganizedFellow Hero Member

OrganizedFellow

Posted
Posted

Which is the one all the coolest kids are using?

Yes, the coolest kids are you all, ProcessWired Friends.

They've been around for a long time and I never was intrigued or interested in using either. I did some reading up and they sound pretty cool.

What are you using?

Why?

Can you give me some newbie-advice?

  • Like 4
Link to comment
Share on other sites
Ivan Gretsky Hero Member

Ivan Gretsky

Posted
Posted

I am starting to use gulp for building my frontend. Though grunt was more popular a while ago. But I do not think there is any significant difference for a beginner (and mature user as well) as both are just task-runners, and plugins are what doing all the work here (both options have enough plugins for any purpose you will possibly need).

Mr. jlahijani shared a nice video, related to your question. Sage did move from grunt to gulp as far as I know, so that can be kind of indicative.

Link to comment
Share on other sites
Yannick Albert Full Member

Yannick Albert

Posted
Posted

The biggest difference, is the pain in your arse, if you come in a project, where tools are used that you don't like. So, just learn to love them all!
 
I use gulp and love it :)
 
However, from time to time I have heard(german) that gulp feels a bit weird, if the project gets larger and your list of tasks growth. But, I have never reached this scale.
 
Another point is speed, gulp uses streams (for parallel execution of tasks), what makes things pretty fast. While grunt does not did. Since v0.5 or so, grunt supports piping data, so the speed could be nearly "the same".

If you do it right, the result is the same, really.

Do you like neither? It is ok/Es ist ok, try npm or use both!

3a8a55c56e69cfc258aa085d0996b587.jpg

  • Like 6
Link to comment
Share on other sites
marcus Sr. Member

marcus

Posted
Posted

I feel like such a newb.

Read most all of the links provided above. I'm more lost than before.

Maybe Grulp is not for me.

I can imagine how overwhelmed you feel right now. It's like wanting to start playing the guitar, but being confronted with amplifier settings, guitar brands and whatnot right within the first minutes. When you only want to learn one single chord first and build upon that. I guess you already stumbled upon Chris Coyiers close-to-perfect intro to Grunt? http://24ways.org/2013/grunt-is-not-weird-and-hard/ ? My advice would be: Choose either Grunt or Gulp (both are great, capable, and have all necessary functions as plugins), stick to that decision for a couple of projects, don't let distract yourself by the usual developer tiffs, and once you build your own Grunt/Gulp boilerplate and feel confident with it, reach out for optimizations (and maybe read these links here again). But then you'll already have entered the amazing world of task runners and will most probably consider them as a crucial part of your development workflow :)

Also, here's a super simple Gulpfile from processwire-recipes.com, just dealing with SASS and gluing some JS files together (Please ignore the messed up indentations in the file)

  • Like 5
Link to comment
Share on other sites
Craig Sr. Member

Craig

Posted
Posted

I think you should be asking, why do you want to use Gulp or Grunt? What are you doing (or want to do) in your projects that needs those tools or that workflow?

If you don't need them, don't use them :)

  • Like 2
Link to comment
Share on other sites
OrganizedFellow Hero Member

OrganizedFellow

Posted
  • Author
Posted

I think you should be asking, why do you want to use Gulp or Grunt? What are you doing (or want to do) in your projects that needs those tools or that workflow?

If you don't need them, don't use them :)

I don't need them.

But I came across some interesting articles and blog posts. I do understand how they make life and work easier for web development.

Emmet totally changed the way I write my HTML.

div>(header>ul>li*2>a)+footer>p

I have avoided so long to change my habits. Can you believe I barely started using SCSS a few months ago?

lol

I currently have to run this command: 

browser-sync start --proxy "test.dev" --files "/home/jaimito/www/test.dev/public_html/site/templates/**"

And then this in a separate terminal tab:

cd /home/jaimito/www/test.dev/public_html/site/templates/_css && sass --watch styles.scss

Then if I want to minify my CSS, there's a different command.

After reading a bit and exploring some different snippets, I know that Gulp can do all these for me.

Link to comment
Share on other sites
Craig Sr. Member

Craig

Posted
Posted

If all you need is some SCSS/LESS (or JS) processing, there are some helpful GUI tools that take the command line and dependency management hassle away - Prepos as mentioned above, or my favourite, Koala. They can watch your files for changes for you, so no running commands every time you change project or change a single line in one file.

  • Like 1
Link to comment
Share on other sites
  • 4 months later...
Mike Rockett Hero Member

Mike Rockett

Posted
Posted

Started using Gulp for a few projects several months back. It's a great tool, but found it to be a tad bulky for one of the projects. These are my current choices:

Large projects: Gulp with zillions of plugins (working on one as we speak)

Medium projects with a decent handful of assets: NPM

Small projects with one or two scripts and one stylesheet (including PW modules): The respective ST3 plugins for LESS and Uglify

Currently, this works for me. I see there are other alternatives to Gulp, but none of them give me good reason to switch over. Some alternatives boast about shorter code, but I really don't think that matters. Performance and feature-richness are what made me choose Gulp. Using NPM is also great, though not as fast. My only real quirk with NPM is on Windows. I don't particularly want to use Cygwin as I'm comfortable with my Mingw32 setup, but that means I loose several features like glob, which is essential. Nonetheless, workarounds are easy to build.

  • Like 2
Link to comment
Share on other sites
elabx Hero Member

elabx

Posted
Posted

Sometimes I feel horrible that I'm not using the cool kids tools, but truth be told I think none of my projects are that complex to really need this setup. Am I being lazy here? Should I actually try this tools to actually see the possible benefits? I mean, I do want to become a better webdev, just really haven't seen the need, I just feel that all that minification and optimized workflow works for complex stuff and when that time comes, I will make my move, meanwhile it feels like an overkill.

  • Like 5
Link to comment
Share on other sites
Mike Rockett Hero Member

Mike Rockett

Posted
Posted

Sometimes I feel horrible that I'm not using the cool kids tools, but truth be told I think none of my projects are that complex to really need this setup. Am I being lazy here? Should I actually try this tools to actually see the possible benefits? I mean, I do want to become a better webdev, just really haven't seen the need, I just feel that all that minification and optimized workflow works for complex stuff and when that time comes, I will make my move, meanwhile it feels like an overkill.

Deciding to use them for projects that don't need them isn't the greatest idea, to be honest. But, for learning purposes, I would give it a try. Should you choose to do so, you could also create yourself a blueprint of sorts for use in future projects. So no, you're definitely not being lazy - if the tools are not needed, then don't use them.

  • Like 2
Link to comment
Share on other sites
OrganizedFellow Hero Member

OrganizedFellow

Posted
  • Author
Posted

Sometimes I feel horrible that I'm not using the cool kids tools, but truth be told I think none of my projects are that complex to really need this setup. Am I being lazy here? Should I actually try this tools to actually see the possible benefits? I mean, I do want to become a better webdev, just really haven't seen the need, I just feel that all that minification and optimized workflow works for complex stuff and when that time comes, I will make my move, meanwhile it feels like an overkill.

I've tinkered and dabbled with lots of "cool tools" and only end up using what makes sense TO ME.

I tried git years years ago and I just didn't "GET IT", so because it didn't make sense to me, I didn't pursue it. Then I looked into it again some time later and probably because my work changed, I'm not sure What or Why, but this time around, it made total sense! I absolutely would have saved so much time, had I stuck with it the first time. It would have saved me countless hours of losing work and messing up configs and changes, etc. Now I can not see myself EVER working without git!

Another one of the "cool tools" is sass/scss. I'm good enough with my css and organizing it very well, I don't NEED the complexities of learning another tool! But it too, has changed my workflow and I am indeed faster WITH IT than I am without it. My scss files are logically sorted and it's much easier for me to find some value than ever before with a 400 line css file.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 

In the end, remember, you make the Tool Cool. Just because Framework QWERTY is used by all the cool kids, means nothing.

My uncle can build a dog house with a simple hammer and screwdriver. Does it matter how fast he builds that dog house? No, what matters is that the resulting final product be strong, stable, long lasting, durable, etc.

YOU make the tool cool :)

  • Like 4
Link to comment
Share on other sites
Christophe Hero Member

Christophe

Posted
Posted

So many different things... and it's only front-end development...

I've just downloaded the PDF version to look at it later.

Added:

NB: I've also found another interesting security and hacking "platform" (among others) today, but I'm not sure if it would be a good idea to post the link here, so... 

  • Like 3
Link to comment
Share on other sites
elabx Hero Member

elabx

Posted
Posted

@Mike Making Automation is something I definitely lack, I kind of always feel slow to start, every new project a tad bit better, but always kind of slow paced. I will take your advice and think thoroughly on what I could put in these blueprints for future work.

@OrganizedFellow I get you! It's like, right now, I get some weird looks amongst a few programming friends because I'm programming in godforsaken PHP. I guess that's probably one of the reason I've been really enjoying this forum, I don't talk that much about programming, but rather useful ways of doing things and solving problems, and creating great design with a really cool tool (looking at you PW), and well, it all happens to be a written in PHP and that's just fine with me.

  • Like 5
Link to comment
Share on other sites
adrian Hero Member

adrian

Posted
Posted
I don't talk that much about programming, but rather useful ways of doing things and solving problems, and creating great design with a really cool tool (looking at you PW), and well, it all happens to be a written in PHP and that's just fine with me.

What a great comment!!

I sometimes find myself apologizing for my PHP work also, but until someone can show me a system in a trendy/better language that is better than PW, it will always be my goto tool for web development. That doesn't mean I don't like playing with the new JS toys (node, meteor, angular, react) when the need arises, but PW makes everything so easy that I'd rather be here :)

  • Like 3
Link to comment
Share on other sites
thetuningspoon Hero Member

thetuningspoon

Posted
Posted

I still write my CSS without a preprocessor... Is that weird now?  I admittedly haven't really tried any of the preprocessors (although I have looked into them), but at this point I prefer to use plain CSS because I can see exactly what code I'm producing and base how I architect my CSS off of that.

I'll have to look more into this gulp n' grunt stuff...

  • Like 4
Link to comment
Share on other sites
Beluga Hero Member

Beluga

Posted
Posted

http://www.walkercoderanger.com/blog/2015/06/state-of-js-build-tools-2015/

I am disappointed by the state of JavaScript build tools in 2015. They are very immature and don’t seem to be well informed by the long history of build tools for other environments and platforms. Additionally, their authors don’t seem to be sitting down with the goal of really working through all the issues that come up in a build tool and making sure they are handled and the tool is easy to use. Only two, namely Brunch and Mimosa seem to have set out with the goal of making most builds very simple to setup and not requiring lots of boilerplate configuration.

Btw. here is a slightly outdated list for your pleasure: https://gist.github.com/callumacrae/9231589 Comments kind of work as updates, though..

  • Like 1
Link to comment
Share on other sites
tpr Hero Member

tpr

Posted
Posted

I admittedly haven't really tried any of the preprocessors

I really recommend to do yourself a favor and try one - LESS is for example really easy to set up. I use only a few of its features - nesting, variables, etc - but I won't ever go back to native CSS. When I have to I feel like using pure PHP instead of PW (just to illustrate my feelings :)). After all you can write pure CSS but the advanced features are available if you need them.

  • Like 1
Link to comment
Share on other sites
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...