Thursday, August 25, 2016

How to push Angular Project to Git ?

A) Create Angular Project using Yoman

- install node.js and npm
- npm install -g yo
- npm install -g generator-webapp
- npm install -g bower
- yo webapp (Select the options during the process)
- npm install -g gulp
- gulp serve (Check if the application is running on localhost:9000)

** For reference  - Folder structures from Sublime

B) Create a new repository in Git

- Go to
- Signup for a new account or login to your existing account.
- Click on the + button from upper right corner and click on “New Repository”

- Enter name for your repository, optional description, choose public/private, don’t need to add .gitignore and README as we will push these files from our angular project and click “Create repostiary” button.

C) Push your code to Git

- Install git from (

- Enter inside your project folder

$ pwd
$ ls
app bower_components gulpfile.js package.json
bower.json dist node_modules test

- git init (Initialize the local directory as a Git repository.)
Initialized empty Git repository in ../FST/.git/

$ ls .git
HEAD config hooks info refs
branches description index objects

- git status (Check the status of the files)

On branch master

Initial commit

Untracked files:
  (use "git add <file>..." to include in what will be committed)


nothing added to commit but untracked files present (use "git add" to track)

- git add * (This command will add the files to the new local repository. This stages them for the first commit.)

The following paths are ignored by one of your .gitignore files:
Use -f if you really want to add them.

- git status

On branch master

Initial commit

Changes to be committed:
  (use "git rm --cached <file>..." to unstage)

new file:   app/apple-touch-icon.png
new file:   app/favicon.ico
new file:   app/index.html
new file:   app/robots.txt
new file:   app/scripts/main.js
new file:   app/styles/main.css
new file:   bower.json
new file:   gulpfile.js
new file:   package.json
new file:   test/index.html
new file:   test/spec/test.js

Untracked files:
  (use "git add <file>..." to include in what will be committed)


- git commit -m “Test First Commit”

[master (root-commit) ac58ce8] Test First Commit
 11 files changed, 454 insertions(+)
 create mode 100644 app/apple-touch-icon.png
 create mode 100644 app/favicon.ico
 create mode 100644 app/index.html
 create mode 100644 app/robots.txt
 create mode 100644 app/scripts/main.js
 create mode 100644 app/styles/main.css
 create mode 100644 bower.json
 create mode 100644 gulpfile.js
 create mode 100644 package.json
 create mode 100644 test/index.html
 create mode 100644 test/spec/test.js

- Add the git repository url as remote origin

git remote add origin “repo url"

- Push the code to github

git push origin master 

D) Check the pushed code in git

Note : Please add a README file and push both README and .gitignore to git. Its missing in repository.

Wednesday, August 24, 2016

How to create angular project using YEOMAN

Create angular project using YEOMAN :

Create a project folder and go inside. ($ mkdir FST, $cd FST)
Please install node.js and npm package manager globally using option "-g” as it can be used in other places for different projects.

- node.js can be installed from npm is installed as a part of the node. 
- To get latest npm, run the following command “sudo npm install npm -g” 

Install yo and webapp generator (

- npm install -g yo
- npm install -g generator-webapp

Install bower, a package manager. (

- npm install -g bower

Create new project using generator
- yo webapp
- Select the options during the process. I have selected “Bootstrap” and “BDD”

Install gulp ( You can build the project using it. 
I have installed gulp locally and globally so you are seeing CLI version and Local version. You may see only CLI version.

- npm install -g gulp

- Check the project structures.

Note :
Since the generator already run "npm install" and "bower install", so you can see the node_modules and bower_components folder with all the installed modules.
** npm will pick from package.json folder
** bower will pick from bower.json
** Any other modules need to be installed for your project then add them to respective package/bower json file and run npm/bower install.

Start the server using gulp. Tasks are present in gulpfile.js

- gulp serve 

** Server will be starting and listen at 9000 port. You can change the port in gulpfile.js file if you want.