2013年6月30日日曜日

Setting up angularjs on Windows 7

My ultimate goal was to try out AngularJS, which supposedly gives us MVC in JavaScript world.

For our game, which is written in .NET stack, I recently set up REST API and WebSocket, and about to embrace JavaScript-oriented browser client.

Also, my colleague at work set up a web app (there, we use Java as the server) using YEOMAN.

The world of JavaScript development is pretty alien to me. I've used JQuery and I know basic HTML5/CSS3 stuff, but not much more than that.

This is just a log of what actions I've taken to get to the point where I have a AngularJS app running (probably integrated to ASP.NET MVC3 - or maybe side-by-side).

 Its work in progress so I may update this later.


  1. Installed Chocolately that gives us a mechanism to install all kinds of software, many of which we know and familiar with (but we use separate "Installers" to install it on Windows). Chocolately let you install at command line.
  2. I used Chocolately to install Yeoman as:
    1. cinst yeoman
  3. To scaffold a web app, this is the Yeoman command line I used, which worked
    1. yeoman init
  4. I was curious about other Yeoman command. One of them is "Yeoman list" to list all packages, but I run into an error:
    1. yeoman list
    2. Error Arguments to path.join must be strings
    3. I found an article that suggests a fix, but I could just not find the file to put a patch (even when I grepped the entire drive. I must be doing something stupid)
  5. I gave up and I decided to do clean install again. By this time, I realized that nodeJS's Node Plugin Manager (nmp) is the tool to install the tools that comprises YEOMAN, namely, yo, grunt, and bower. So I installed them one by one (I basically just followed the "installation" instruction at yeoman.io website.)
    1. npm install -g yo grunt-cli bower
    2. npm install -g generator-webapp
  6. At this point, I believe I have all the tools I needed, some were installed as part of Chocolately install, some other manually by hand. Verify this by just obtaining version number of each tool
    1. node --version
    2. git --version
    3. yo --version
    4. grunt --version
    5. bower --version
    6. ruby --version
    7. compass --version
  7. Once I got these tools installed, then I proceeded to generate AngularJS project (again, just follow "Usage" instruction at yeoman.io website.)
    1. npm install -g generator-angular
    2. yo angular
This is as far as I got. AngularJS project has been created but I see bunch of errors too and not sure if they are show-stopper or not.

1 件のコメント: