Honeybadger frontend integration in Neeto apps

Calvin Chiramal

Calvin Chiramal

December 12, 2023

At neeto, we integrated Honeybadger to track all errors in our applications at runtime. We also integrated Honeybadger with Github to automatically raise issues in the respective repositories when errors are caught. This blog is an in-depth guide on how we integrated Honeybadger on the frontend part of our web apps.

For our apps deployed on Heroku, we used the following command to get the latest commit hash as an environment variable in the Heroku server on each build:

1heroku labs:enable runtime-dyno-metadata -a your-app-name

With NeetoDeploy, we didn't need this step since git is available in the console and we used git commands to set the latest commit hash as the Honeybadger revision. Honeybadger uses the revision to associate maps with the bundle when the bundle name doesn't change.

Steps to integrate Honeybadger:

  1. Create a new project in the Honeybadger dashboard. We've made a video on setting it up following the React integration guide.

  2. Set the environment variable HONEYBADGER_JS_API_KEY with the Honeybadger project's API key. The API key can be copied from Settings => API Keys.

In depth guides for Honeybadger integration & sourcemap upload:

We've created a YouTube playlist of the above videos for easy access.

If this blog was helpful, check out our full blog archive.

Stay up to date with our blogs.

Subscribe to receive email notifications for new blog posts.