Decodize

console.log

Installing Yeoman Front-end Development Stack in Windows

Updates
14th Sep 2012 :
1. Alternate method to install Yeoman using Chocolatey.
2. Github Yeoman windows issues link.

15th Sep 2012 :
1. Added description (Chocolatey method).

17th Feb 2013 :
1. On Feb 15th 2013 Yeoman 1.0 BETA released. Its not supported on windows yet. 

3rd March 2013 :
1. Yeoman 1.0 Beta can be installed on windows.

This post is for Yeoman 0.9 and a new beta version, Yeoman 1.0 Beta is available and installation instructions can be found here Yeoman 1.0 Beta installation on windows

What is Yeoman?

Yeoman

Its a tool to make the front-end development workflow easier. It includes tools and front-end frameworks that helps to create web apps quickly and easily.

Features

Initialize and scaffold a new project
Build & deploy app
Launch server, preview & live reload
Run automated tests using PhantomJS
Install & update packages
Customise your apps framwork
Genarator for chrome app

More on Yeoman

Installation

MAC OSX & Linux Installations Yeoman site

Install Yeoman using Chocolatey (Method 1)

Chocolatey is a package manager for windows. Its like Linux apt-get. Once Chocolatey installed, you can install Chocolatey packages from windows cmd. Install Chocolatey & type cinst yeoman it will prompt you to install all necessary tools one by one.

Steps

  1. Goto chocolatey.org Chocolatey NuGet is a Machine Package Manager, somewhat like apt-get, but built with windows in mind.

  2. Open cmd & paste

    C:> @powershell -NoProfile -ExecutionPolicy unrestricted -Command “iex ((new-object net.webclient).DownloadString(‘http://bit.ly/psChocInstall’))” && SET PATH=%PATH%;%systemdrive%\chocolatey\bin

  3. Type

    c:> cinst yeoman

It will fetch & install all dependent files.

Done!!

Yeoman installed on windows and now its time to play with yeoman commands. Close and reopen cmd.

C:> yeoman init –disable-insight

This will create bolierplate for your next application. To launch preview server and run application locally use yeoman server --disable-insight.

more commands

Windows (Method 2)

Prerequisites

Ruby Installer

This is a self-contained Windows-based installer that includes the Ruby language, an execution environment, important documentation, and more.

Download & install

Compass

Compass is an open-source CSS Authoring Framework.

Download & install

Nodejs

Node.js is a platform built on Chrome’s JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.

Download & install

Git

Git is a free and open source distributed version control system

Download & install

Phantomjs

PhantomJS is a headless WebKit with JavaScript API.

Download & Install – You have to add path in Windows Environment Variable.

Git windows

The easiest way to use Git on Windows. [Optional]

Download & install

Python

Python is a programming language that lets you work more quickly and integrate your systems more effectively.

Download & install

Steps

1.Download and install all above tools

There are 2 method to install Yeoman.
——a. Open command prompt & type C:\npm install yeoman
——b. You can install using Git

Clone Yeoman using git.

Git Yeoman

–Or–

If you have installed Github for windows tool. “Clone in windows” from Github Yeoman page.

Git Windows app

Clicking on “Clone in Windows” will open up windows github tool.

Git Windows app

After cloning right click and open files in explorer.

Yeoman CLI

shift + right click inside the root folder. You will get an option “Open Command Window Here”.

npm install -g

You will get following screen if its a success.

Yeoman installation

Done!!

Working with Yeoman

yeoman init

Yeoman init

Yeoman server

yeoman init      # Initialize and scaffold a new project using generator templates
yeoman build     # Build an optimized version of your app, ready to deploy
yeoman server    # Launch a preview server which will begin watching for changes
yeoman test      # Run a Mocha test harness in a headless PhantomJS

yeoman install   # Install a package from the client-side package registry
yeoman uninstall # Uninstall the package
yeoman update    # Update a package to the latest version
yeoman list      # List the packages currently installed
yeoman search    # Query the registry for matching package names
yeoman lookup    # Look up info on a particular package

more commands and help

Github Yeoman Windows issue

File bugs & issues here github yeoman windows issue

Summary

Its a super cool tool that helps to streamline front-end workflow.

Resources

Yeoman home page
Yeoman Github page
Yeoman issues
Yeoman documentation