{"id":21445416,"url":"https://github.com/kathleenwest/sample-angular-app","last_synced_at":"2025-08-09T03:42:37.396Z","repository":{"id":193764455,"uuid":"689439933","full_name":"kathleenwest/sample-angular-app","owner":"kathleenwest","description":"Quick step-by-step tutorial on how to create the sample default angular app deploy to GitHub Pages.  The result of following these guided steps will be that your sample angular site is visible on GitHub like the screen capture shown in the README.","archived":false,"fork":false,"pushed_at":"2023-09-10T01:32:25.000Z","size":337,"stargazers_count":4,"open_issues_count":0,"forks_count":5,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-19T21:30:39.608Z","etag":null,"topics":["angular","deploy-to-github-page","deployment","github","github-pages","sample","sample-app","screen-capture","screenshot","step-by-step","step-by-step-guide","tutorial"],"latest_commit_sha":null,"homepage":"https://kathleenwest.github.io/sample-angular-app/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kathleenwest.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2023-09-09T20:10:33.000Z","updated_at":"2024-10-26T02:01:23.000Z","dependencies_parsed_at":"2025-04-20T15:15:25.345Z","dependency_job_id":null,"html_url":"https://github.com/kathleenwest/sample-angular-app","commit_stats":null,"previous_names":["kathleenwest/sample-angular-app"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/kathleenwest/sample-angular-app","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kathleenwest%2Fsample-angular-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kathleenwest%2Fsample-angular-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kathleenwest%2Fsample-angular-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kathleenwest%2Fsample-angular-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kathleenwest","download_url":"https://codeload.github.com/kathleenwest/sample-angular-app/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kathleenwest%2Fsample-angular-app/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269527524,"owners_count":24432438,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-09T02:00:10.424Z","response_time":111,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","deploy-to-github-page","deployment","github","github-pages","sample","sample-app","screen-capture","screenshot","step-by-step","step-by-step-guide","tutorial"],"created_at":"2024-11-23T02:26:58.024Z","updated_at":"2025-08-09T03:42:37.328Z","avatar_url":"https://github.com/kathleenwest.png","language":"HTML","readme":"# sample-angular-app\n \nQuick step-by-step tutorial on how to create the sample default angular app deploy to GitHub Pages.\n\nThe result of following these guided steps will be that your sample angular site is visible on GitHub like the screen capture shown below (Example: https://kathleenwest.github.io/sample-angular-app/):\n\n![Screenshot of application deployed and running.](demo.jpg)\n\n## Step 1 - Create Angular App\n\nOpen a terminal window, create a new angular app, then navigate to the app root directory.\n\n`ng new sample-angular-app`\n\n## Step 2 - Add Base Href To App\n\nOpen the file _src/index.html_ and add the _sample-angular-app_ for base href\n\n`\u003cbase href=\"/sample-angular-app\"\u003e`\n\n## Step 3 - Create Local Git Repo for Folder\n\nVia console or GitHub Desktop\n\n## Step 4 - Publish to GitHub\n\nPublish as public repo (if you have the free plan)\n\n## Step 5 - Create and check out a git branch named gh-pages\n\n`git checkout -b gh-pages`\n\n## Step 6 - Build your Project\n\nBuild your project using the GitHub project name, with the Angular CLI command ng build and the following options, where your_project_name is the name of the project that you gave the GitHub repository.\n\nBe sure to include the slashes on either side of your project name as in /your_project_name/.\n\n`ng build --output-path docs --base-href /sample-angular-app/`\n\n## Step 7 - Build 404 File\n\nWhen the build is complete, make a copy of docs/index.html and name it docs/404.html\n\n## Step 8 - Commit your changes and push\n\nPush the working branch _gh-pages_\n\n## Step 9 - Configure GitHub Pages\n\nOn the GitHub project page, go to Settings and select the Pages option from the left sidebar to configure the site to deploy from your branch (gh-pages) and the _/docs_ folder as seen in the screen capture below.\n\n![Screenshot of deployment configuration.](deploy.JPG)\n\nYour deployment may take some time, but you will soon see the url/link as seen in the screen capture above.\n\nYour site is live at https://kathleenwest.github.io/sample-angular-app/\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkathleenwest%2Fsample-angular-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkathleenwest%2Fsample-angular-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkathleenwest%2Fsample-angular-app/lists"}