DEV Community

Bipon Biswas
Bipon Biswas

Posted on

Deploy your Angular app to GitHub pages directly

In this tutorial we’ll see how to host an Angular web application using Github Pages. Let’s get started.

Prerequisites
You need to have Node.js, NPM and Angular CLI installed, you also need to generate a new Angular project using Angular CLI.

Step 1: ng new child-demo in Visual Studio IDE terminal

Step 2: cd child-demo

Step 3: command follow step by step

- git init
- git add .
- git commit -m "first commit"
- git remote add origin https://github.com/bipon68/child-demo.git (git remote add origin https://github.com/<username>/<repositoryname>.git)
- git push -u origin master
- npm install -g angular-cli-ghpages
- ng build --prod --base-href="https://bipon68.github.io/child-demo/" (Note: copy all file in dist folder into child-demo project folder and paste(one level up)) ($ ng build --prod --base-href "https://<YOUR_GITHUB_USER-NAME>.github.io/<YOUR_REPO_NAME>/"
)
- angular-cli-ghpages
- Your project should be available at - https://<username>.github.io/<repositoryname> (Sample example : https://bipon68.github.io/child-demo/)
Enter fullscreen mode Exit fullscreen mode

Reference
angular cli ghpages, Upload angular Project github Pages

Source Code
Github

Discussion (0)