ngx-deploy-docker 🚀🐳

This Project is still work in progress.

Dockerize your Angular application with ease and deploy your image right from the Angular CLI to a registry 🚀

Table of contents:

1. 📖 Changelog
2. 🚀 Quick Start (local development)
3. 🚀 Continuous Delivery
4. 📦 Options
   • --base-href
   • --build-target
   • --no-build
   • --image-name
   • --account
   • --tag
5. 📁 Configuration File
6. 🏁 Next milestones

📖 Changelog

A detailed changelog is available here.

🚀 Quick Start (local development)

This quick start assumes that you are starting from scratch. If you already have an existing Angular project, skip step 1.

1. Install the latest version of the Angular CLI (v13.0.0 or greater) globally and create a new Angular project. Make sure you have a suitable version of nodeJs installed.

   npm install -g @angular/cli
   ng new your-angular-project --defaults
   cd your-angular-project

2. Add ngx-deploy-docker to your project.

   ng add ngx-deploy-docker

3. Make sure, Docker works properly on your client and you are authenticated at the repository of your choice.

   docker login

4. Deploy your newly built image to the registry with all default settings. Your project will be automatically built in production mode.

   ng deploy

   Which is the same as:

   ng deploy your-angular-project

🚀 Continuous Delivery

...more to come

📦 Options

--base-href

• optional
• Default: undefined (string)
• Example:
  • ng deploy – The tag <base href="https://github.com/"> remains unchanged in your index.html
  • ng deploy --base-href=/XXX/ – The tag <base href="https://github.com/XXX/"> is added to your index.html

Specifies the base URL for the application being built. Same as ng build --base-href=/XXX/

--build-target

• optional
• Example:
  • ng deploy – Angular project is build in production mode
  • ng deploy --build-target=<app>:build:test – Angular project is using the configuration test (this configuration must exist in the angular.json file)

A named build target, as specified in the configurations section of angular.json. Each named target is accompanied by a configuration of option defaults for that target. Same as ng run <app>. This command has no effect if the option --no-build option is active.

--no-build

• optional
• Default: false (boolean)
• Example:
  • ng deploy – Angular project is build in production mode before the deployment
  • ng deploy --no-build – Angular project is NOT build

Skip build process during deployment. This can be used when you are sure that you haven't changed anything and want to deploy with the latest artifact. This command causes the --build-target setting to have no effect.

--image-name

• optional
• Example:
  • ng deploy – Docker Image is build with the name of the project as image name
  • ng deploy --image-name=your-special-name – Docker Image is built with the name provided.

--account

• optional
• Alias: -a
• Default: `` (string)
• Example:
  • ng deploy – Docker Image name is not prefixed.
  • ng deploy --account=test – Docker image name is prefixed with the provided account, like account/image-name.

This option may be necessary, depending on your write-rights within the repository, you want to push to.

--tag

• optional
• Alias: -t
• Default: latest (string)
• Example:
  • ng deploy – Docker Image is build with the tag latest, e.g.account/image-name:latest
  • ng deploy --tag=v1.0.0 – Docker Image is build with the tag v1.0.0

📁 Configuration File

To avoid all these command-line cmd options, you can write down your configuration in the angular.json file in the options attribute of your deploy project's architect. Just change the kebab-case to lower camel case. This is the notation of all options in lower camel case:

• baseHref
• buildTarget
• noBuild
• imageName
• account
• tag

A list of all available options is also available here.

Example:

ng deploy --build-target=<app>:build:production --tag=next

becomes

"deploy": {
  "builder": "ngx-deploy-docker:deploy",
  "options": {
    "buildTarget": "<app>:build:production",
    "tag": "next"
  }
}

And just run ng deploy 😄.

🏁 Next milestones

• Setup of CI/CD Pipeline for the project
• Code Restructuring:
  • Modularization of Schematics and Builders
  • Use what you need
• Testing, Testing, Testing:
  • Manual tests on different clients with different OS
  • Unit and Integration Tests
• Add more options to the deploy builder, what do you need?
• Integration in NxWorkspace
• 💅 Kubernetes deployment right from the CLI
• preparing examples of how to use the package in CI environment with different Providers for private registries
• your feature that's not on the list yet?

We look forward to any help. PRs are welcome! 😃

License

Code released under the MIT license.

Attribution

🚀 Powered By ngx-deploy-starter

🔥 Many things have been taken over from transloco