Monitor your CI/CD build status for your JavaScript application

In software development, Continuous Integration (CI) and Continuous Delivery (CD) are two important concepts commonly used to ensure that your JavaScript software is always in a working state. CI/CD is a software development practice where developers continuously integrate code into a shared repository and deliver the code to the end users. This way, the software is always working, and the end users can always use the latest version.

When using CI/CD for your JavaScript application, it is crucial to monitor the build status of your application to ensure that the latest version of the application is always in a working state. This way, you can always be aware of the status of your application and take immediate action if needed. For example, if the build status is failing, you can take action to fix the issue and ensure that the latest version of the application is always in a working state.

LogSnag is a powerful, real-time event tracking tool that is an excellent solution for monitoring the build status of your JavaScript application. By using LogSnag directly in your CI/CD pipeline, such as Github Actions, or by using it inside your JavaScript application, you can track the build status of your application in real time. You may also set up optional rules to notify you and your team when the build status of your application changes.

In addition, LogSnag allows for tracking your CI/CD build status over time and creating a timeline of events for each build. This way, you can always review the build history of your application and take action if needed.

Connect LogSnag to JavaScript

Setting up LogSnag

Sign up for a free LogSnag account.
Create your first project from the dashboard.
Head to settings and copy your API token.

JavaScript code snippets

Use the following code snippet to track the build status of your application in real time. All you need to do is to replace the YOUR_API_TOKEN with your LogSnag API token and update the project name to your project name.

Using JavaScript with Fetch

var myHeaders = new Headers();
myHeaders.append("Content-Type", "application/json");
myHeaders.append("Authorization", "Bearer YOUR_API_TOKEN");

var raw = JSON.stringify({
  "project": "my-saas",
  "channel": "ci-cd",
  "event": "Successful Deploy",
  "description": "Project was successfully deployed to production",
  "icon": "🚢",
  "notify": true
});

var requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
};

fetch("https://api.logsnag.com/v1/log", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

Using JavaScript with jQuery

var settings = {
  "url": "https://api.logsnag.com/v1/log",
  "method": "POST",
  "timeout": 0,
  "headers": {
    "Content-Type": "application/json",
    "Authorization": "Bearer YOUR_API_TOKEN"
  },
  "data": JSON.stringify({
    "project": "my-saas",
    "channel": "ci-cd",
    "event": "Successful Deploy",
    "description": "Project was successfully deployed to production",
    "icon": "🚢",
    "notify": true
  }),
};

$.ajax(settings).done(function (response) {
  console.log(response);
});

Using JavaScript with XHR

// WARNING: For POST requests, body is set to null by browsers.
var data = JSON.stringify({
  "project": "my-saas",
  "channel": "ci-cd",
  "event": "Successful Deploy",
  "description": "Project was successfully deployed to production",
  "icon": "🚢",
  "notify": true
});

var xhr = new XMLHttpRequest();
xhr.withCredentials = true;

xhr.addEventListener("readystatechange", function() {
  if(this.readyState === 4) {
    console.log(this.responseText);
  }
});

xhr.open("POST", "https://api.logsnag.com/v1/log");
xhr.setRequestHeader("Content-Type", "application/json");
xhr.setRequestHeader("Authorization", "Bearer YOUR_API_TOKEN");

xhr.send(data);

JavaScript integration details

We believe that event tracking should be simple and accessible to every developer and team. Therefore, we have worked hard to create the next generation of event tracking tools. As a result, LogSnag is flexible and easy to use, making it a great companion for your JavaScript applications.

In addition to tracking CI/CD build status, LogSnag is a powerful solution that you can use to track any other significant events in your JavaScript application. LogSnag provides powerful features such as cross-platform push notifications, event filtering, user and product journeys, charts, insights, and more.

Other use-cases for LogSnag

View all common use-cases with JavaScript

Setting up LogSnag

JavaScript code snippets

JavaScript integration details

Other use-cases for LogSnag

Posted by

Content