I’m going to use Angular-cli angular building tool to make my first angular application.first we need to install angular cli in our computer for that we have to run this command.
I’m running these commands in Ubuntu environment but you can run all these codes in Windows and Mac as well.
$ npm install -g angular-cli
To check whether Angular-cli is working or not run this command.If it exists it will show the version of angular-cli
$ ng -v
go to a folder where you would like to make the angular application and run this command to make a new angular application. in my case application name is “app-name”
$ ng new app-name $ cd app-name
To run our sample application we can use this command
$ ng serve
If your application is running successfully your command line will show this code.
[default] Checking started in a separate process... [default] Ok, 1.718 sec.
Go to this URL from your browser. http://localhost:4200/
It will show “app works !” in browser
Now we are going to deploy this application on GitHub pages.
first we have to make a repository in GitHub .If you are already logged in to your GitHub account, go to this URL https://github.com/new
give a name to your repository .I have named it as “new-repo” .
After clicking the Create repository button. you will get a your repository URL
my repo URL is this. https://github.com/isuruAb/new-repo.git
Now we are going to add/link this GitHub repository to our project. place your repository URL instead of my one below.
$ git remote add origin https://github.com/isuruAb/new-repo.git
To check whether repository is added or not we can run this.
$ git remote -v
If it is working it will show this result.
origin https://github.com/isuruAb/new-repo.git (fetch) origin https://github.com/isuruAb/new-repo.git (push)
Now we have to push(send) all data into the repository that we made.
push all these new files into repository like this
$ git add . $ git commit -m "initial commit" $ git push -u origin master
Now you have to enter your username and password.Refresh your repository page to ensure that files are added.
You will see this part at the end of the page of repository.
run this command as they are saying.
$ ng github-pages:deploy
Now our angular application is ready to see.
*If your application name is differ from the repository name , this link will give you a 404 page.If you are getting this kind of error we can change package.json file like this