CI/CD for Angular
đź“š Learn more about Angular action features, integrations and alternatives.
Angular is an open-source framework built up by Google. This TypeScript-based framework is mostly used to create single-paged applications as it uses modular architecture allowing developers to divide software into smaller parts. Due to its flexibility, Angular is the perfect choice both for freelance developers and enterprises.
With Buddy, you can create a CI/CD pipeline that builds, tests, and deploys Angular applications on a push to Git. The configuration is super simple and takes 10 to 15 minutes.
Example Angular CI/CD pipeline
1. Select your Git repository
Buddy supports all popular Git hosting providers. You can integrate Buddy with your GitHub account, Bitbucket, and GitLab. You can also use your own private Git server, or host code directly on Buddy.
Supported Git providers
2. Add a new delivery pipeline
Enter the pipeline's name, select the trigger mode, and define the branch from which Buddy will fetch your code:
New pipeline configuration
Trigger modes
- Manually (on click) — recommended for Production
- On events (automatic) — recommended for Development
- On schedule (on time interval) — recommended for Staging/Testing
3. Add actions
Buddy lets you choose from dozens of predefined actions. In this example, we'll add 4 actions that will perform the following tasks:
- Build and test Angular app: download dependencies (npm, yarn, etc.), run tests, compile assets (npm tasks, webpack, etc.)
- Upload code to server together with compiled assets
- Restart application
- Send notification to Slack
3.1 Build your Angular application
Look up and click Angular CLI on the action list to add it to the pipeline:
Angular action on framework list
The default commands are:
npm install
ng test --watch=false --browsers=ChromeHeadless
$$
Default build commands for Angular
3.1.2 Node version
You can change the version of Node (and thus the Angular it comes with) in the runtime environment tab:
Environment configuration
The runtime environment tab provides a few options to select your Docker image from. You can add it from Docker Hub, private registry, or from an already existing Build Image action.
3.2 Deploy application to server
Now the application needs to be uploaded to the server. Head to the Transfer section and select your deployment action (SFTP in our case):
Transfer actions with SFTP deployment
When adding the action you can choose what and where should be uploaded:
SFTP transfer configuration
3.3 Restart application
Once the app is deployed, you can run additional commands on your server with the SSH action:
Remote Ops action list
Enter the commands to execute in Run CMDs and configure authentication details in the Target tab:
Example SSH script
3.4 Send notification to Slack
You can configure Buddy to send your team a message after the deployment. In this example we'll use Slack:
Notification actions
4. Summary
Congratulations! You have just automated your CI/CD process by setting up just a single pipeline. Make a push to the selected branch and watch Buddy fetch, build, and deploy your project. With Continuous Delivery applied, you can now focus on what's really important: developing awesome apps! 🔥
Last modified on February 26, 2024