Tuesday, April 16, 2013

Yeoman Angular Getting Started: A Journey

Getting Started with Yeoman, Angular and eventually Express to create a simple yet fully functional application.

This space is to document my journey in detail, for my own purposes.

Started with reading about Angular.js development, read the recently released book about Angular development and ran through some fairly simple exercises. This led me to figuring out project structure, how to organize an Angular project.

Yeoman, even though its unstable, looks like there is a big following and has some neat features, scaffolding, building, watch etc which might make developing Angular applications simpler & more standardized.

STEP 1: Install Yeoman
pre-req: node & npm should have already been installed

sudo npm install -g yo grunt-cli bower --> Global install

sudo npm install -g generator-angular generator-karma
  1. Karma is used for unit testing
  2. Karma is fully configured when used with angular-generator
cd ang-yo
yo angular
grunt
      returned an error that it requires ruby & compass installed

check if ruby is installed ruby -v

sudo gem update --system
sudo gem install compass

grunt --> build a prod ready version of your app
grunt server --> preview the app w/ live reload
grunt test --> test

cmd: grunt server

This should bring you to the built version launched in the browser

EDIT - I decided to incorporate Yeoman at a later stage since I want to learn the Angular basics first. Without the basics, I was getting very confused with what Yeoman and Yo were doing.

So, the journey definetly should not start with Yeoman.

Back to basics......

Start here by doing a slow paced learning journey using angular (angularjs tutorial):
http://technokayiti.blogspot.com/2013/04/angular-tutorial-learning-journey.html

No comments: