CI/CD for JavaScript
JavaScript is one of the essential programming languages of modern software development, allowing development teams to introduce dynamic and interactive components to web applications.
Buddy lets you introduce CI/CD to the JavaScript development workflow via easy-to-configure CI/CD pipelines, allowing you to create a pipeline that builds, tests, and deploys JS applications on a push to Git. The configuration is super simple and takes only 10 to 15 minutes.
Example JavaScript Continuous Delivery pipeline
What is CI/CD in JavaScript
Before we get started, let's refresh what CI/CD stands for:
- Continuous Integration – means that every change to source code is automatically built and tested on a CI server, and then integrated into a remote repository, with the build status returned to the sender. Automated testing is the core of Continuous Integration, significantly increasing code quality and developer productivity.
- Continuous Deployment – means real-time deployment to staging or production environment (or web service), provided the tested code is valid and no longer requires bug fixes. A flawless Continuous Deployment process is the Holy Grail of every DevOps engineer.
In JavaScript, that would mean pulling the source code with your project, running the tests defined in the package.json JS file, bundling the files for deployment (provided the tests have passed), and deploying the package to the server.
Below, you will learn how to achieve that with Buddy.
Introducing CI/CD is essential for a healthy software development life cycle and delivering stable software for the end users.
1. Select your Git repository
Buddy supports all popular Git hosting providers, including GitHub, 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 (e.g. on pull request to the main branch), and define the branch from which Buddy will fetch your code:
Exemplary pipeline settings
Trigger modes
- Manual (on click) — recommended for Production
- On push (automatic) — recommended for Development
- Recurrently (on time interval) — recommended for Staging/Testing
Event-based triggers allow you to run pipelines whenever a push is made to any branch in the repository, or whenever a branch, tag or a pull request is created or deleted.
On event pipeline trigger mode
On event pipeline trigger mode
3. Add actions
Buddy lets you choose from dozens of predefined actions. A simple example may include the following pipeline stages:
- Build and test JavaScript app: download dependencies (npm, yarn, etc.), run unit 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 JavaScript application
Build actions in Buddy are run in isolated containers run from official Docker images. When the pipeline is run, Buddy launches the Docker container, runs build commands, and shares the results in the pipeline filesystem with deployment actions.
Look up and click Node.js on the action list to add it to the pipeline:
Action list
The Run tab lets you determine the shell script to execute. The default commands are:
# yarn install
npm install
npm test$$$
Default build commands
3.1.2 Node.js version
You can change Node.js version and install missing packages & tools in the runtime environment tab:
Node.js action image
If your tests require a database to run, you can attach it in the Services tab:
Services tab
Services tab
3.2 Deploy application to server
The compiled application needs to be uploaded to the server. Head to the Transfer section and select your upload action (SFTP in our case):
File transfer actions
When adding the action, you can choose what and where should be uploaded using available feature flags and path inputs:
Setting up an SFTP action
3.3 Restart application
Once the app is deployed, you can run additional commands on your server with the SSH action:
SSH action selection
Enter the commands to execute and configure authentication details:
Command console
3.4 Send notification to Slack
You can configure Buddy to send your development team a message whenever a new version or new features are released. In this example we'll use Slack:
Notification actions
If you add this action in the On Failure tab, Buddy will only send the message if something goes wrong with your build or deployment.
On failure notification
On failure notification
4. Summary
Congratulations! You have just configured a CI/CD pipeline and automated your entire delivery process. 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! 🔥
Bear in mind that this article is only a brief example of what Buddy can do. You can create additional pipelines for staging and production environments, pass environment variables between actions, add more automated tests, set up security testing with Sentry, trigger tests on pull requests, build and push Docker images—the possibilities are unlimited.
If you want us to create a delivery pipeline for your project, drop a line to support@buddy.works – we'll be happy to help!
Additional resources
Last modified on February 29, 2024