Home Explore Blog CI



docker

5th chunk of `content/guides/angular/configure-github-actions.md`
4859113d2f158213c2785c429c03c852b10ced877b2c50780000000100000c28
2. Monitor the workflow execution

   - Go to the Actions tab in your GitHub repository.
   - Click into the workflow run to follow each step: **build**, **test**, and (if successful) **push**.

3. Verify the Docker image on Docker Hub

   - After a successful workflow run, visit your [Docker Hub repositories](https://hub.docker.com/repositories).
   - You should see a new image under your repository with:
      - Repository name: `${your-repository-name}`
      - Tags include:
         - `latest` – represents the most recent successful build; ideal for quick testing or deployment.
         - `<short-sha>` – a unique identifier based on the commit hash, useful for version tracking, rollbacks, and traceability.

> [!TIP] Protect your main branch
> To maintain code quality and prevent accidental direct pushes, enable branch protection rules:
>  - Navigate to your **GitHub repo → Settings → Branches**.
>  - Under Branch protection rules, click **Add rule**.
>  - Specify `main` as the branch name.
>  - Enable options like:
>     - *Require a pull request before merging*.
>     - *Require status checks to pass before merging*.
>
>  This ensures that only tested and reviewed code is merged into `main` branch.
---

## Summary

In this section, you set up a complete CI/CD pipeline for your containerized Angular application using GitHub Actions.

Here's what you accomplished:

- Created a new GitHub repository specifically for your project.
- Generated a secure Docker Hub access token and added it to GitHub as a secret.
- Defined a GitHub Actions workflow that:
   - Build your application inside a Docker container.
   - Run tests in a consistent, containerized environment.
   - Push a production-ready image to Docker Hub if tests pass.
- Triggered and verified the workflow execution through GitHub Actions.
- Confirmed that your image was successfully published to Docker Hub.

With this setup, your Angular application is now ready for automated testing and deployment across environments — increasing confidence, consistency, and team productivity.

---

## Related resources

Deepen your understanding of automation and best practices for containerized apps:

- [Introduction to GitHub Actions](/guides/gha.md) – Learn how GitHub Actions automate your workflows  
- [Docker Build GitHub Actions](/manuals/build/ci/github-actions/_index.md) – Set up container builds with GitHub Actions  
- [Workflow syntax for GitHub Actions](https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions) – Full reference for writing GitHub workflows  
- [Compose file reference](/compose/compose-file/) – Full configuration reference for `compose.yaml`  
- [Best practices for writing Dockerfiles](/develop/develop-images/dockerfile_best-practices/) – Optimize your image for performance and security  

---

## Next steps

Next, learn how you can locally test and debug your Angular workloads on Kubernetes before deploying. This helps you ensure your application behaves as expected in a production-like environment, reducing surprises during deployment.

Title: Workflow Monitoring, Verification, and Branch Protection
Summary
This section provides instructions on monitoring the workflow execution in GitHub Actions, verifying the Docker image on Docker Hub with its associated tags, and implementing branch protection rules to maintain code quality by requiring pull requests and passing status checks before merging into the main branch. It then summarizes the accomplishments of setting up a CI/CD pipeline for a containerized Angular application using GitHub Actions, including creating a repository, generating a Docker Hub access token, defining a GitHub Actions workflow, triggering the workflow, and confirming the image publication on Docker Hub. Finally, it lists related resources for further learning and suggests locally testing and debugging Angular workloads on Kubernetes before deploying as the next step.