What Is Yeoman

I just realized I’d never talked about some tools like Yo, Grunt or Bower so today I will fix this and I will talk about Yeoman

First I saw on many blogs, poeple who are a bit confusing about Yeoman, Yeoman is not a scaffolding tool, it is just an installer for 3 different tools:

  • Yo: This one is the scaffolding tool
  • Bower: A package manager for your front end
  • Grunt: A task runner
yeoman

Even if Yo and Yeoman starts with the same letter it’s not a reason to mix them together ;) I think this confusion come because the same team is working on Yo and on Yeoman and moreover Yo generate configuration for bower and grunt which is some tools of Yeoman workflow. Anyway, this is close but keep thinking Yeoman is not a scaffolding tool but just a kind of workflow including awesome tools.

This post will be in 3 post, one for each tools.

Yo:

Yo is the first tool of Yeoman, this tool is a scaffolding for your application.

Let’s say you need to create a new application, for example an angular application with an expressjs server, yo will help you to startup your project, organize all your files, configure everything and even install some tools to be more productive like SASS or Coffee.

To do that, first you need to install yo with npm install -g yo and you’re lucky because this will also install Bower and Grunt for the next parts ;)

Ok after that you need to find the right generator here. And good there is one angular-fullstack (AngularJS with an Express server), exactly what we want.

To install it, you can just run npm install -g generator-angular-fullstack.

Now your generator is installed so we just have to generate our new app.

With the yo command you will be able to see all the generators already installed and when you select one this will run the generator, so select the one Angular-fullstack or type directly yo angular-fullstack.

That’s it, now you just have to answer to the questions and your application will be generate.

generator questions

With this generator you will have:

  • Your express server created
  • Your tests with karma
  • Your config for database and different environments
  • Your routes for your server
  • Your models
  • Your controllers
  • Your views
  • Your style
  • Your Angular application (routes, directives, controllers, services)

And in bonus you will have

  • Your Bower configured
  • Your Grunt configured

So with this you saved many hours to organize and configure your new project and even now your project is ready to be deployed thanks to grunt but we will see that in a different post.

Yo is really an awesome tool and the list of generator is really good. For now there is 468 generators for everything, you can have a chrome extension, a worpress, a firefox os app, threejs app… really impressive, just have a look.

See part 2: Bower

Comments

Copyright © 2014 - Anthony Estebe -