Getting Started with Yeoman

What is Yeoman?

Yeoman is a scaffolding tool that helps you to kickstart new projects using best practices. It creates the project hierarchy & the basic files required for many projects using technology specific generators.

e.g. Yeoman provides a generator for angular project called as generator-angular

Pre-requisites

Node has to be installed to progress.

Steps to get started with Yeoman

1) Steps to setup dev env

Install yo & its dependencies using the below command

npm install –global yo bower grunt-cli

If you see issues related to permission please execute the command with sudo privileges.

2) Check if everything is installed properly. If everything is fine, the versions of yo, bower & grunt should be displayed

yo –-version && bower –-version && grunt –-version

3) Install a Yeoman Generator for Angular. Note that there are many generators which you can use yeoman for

sudo npm install -g generator-angular

4) Make a new directory (say demoYeoman)

5) Goto the newly created directory (demoYeoman in our case)

6) Hit the ‘yo’ command by selecting ‘Run the Angular Generator’. At this step yo will ask for configuring your project. Select the defaults.Yeoman will automatically scaffold your app along with the necessary dependencies

7) Check the project structure generated

Screen Shot 2015-02-25 at 2.33.01 PM

8) Start the server. In mac, python is installed by default which provides a simple http server. Start that server using the below command

python -m SimpleHTTPServer 9999

9) Check your application. Run the below command

grunt test

If any point you get errors related to karma, hit the following 2 commands-

sudo npm install grunt-karma –save-dev          

     npm install karma-phantomjs-launcher –save-dev 

Download the PDF version

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s