React Error Monitoring with Raygun

Easily detect, diagnose and fix React errors

Solving React errors has never been so easy!

Detect, diagnose and destroy React errors that are affecting your customers. With smart React error monitoring software from Raygun, you can be alerted to issues affecting your users, the second they happen.

JavaScript errors can tend to be noisy and throw in a lot of unuseful information. Raygun helps you cut through this noise and focus on the problems that are affecting the largest number of users of your application.

Raygun supports all major programming languages and platforms including JavaScript, Angular, Node, Ember, React and more. Whatever your tech stack looks like, or whether you’re monitoring backend or frontend code, Raygun can ensure all issues are brought to your team’s attention. All errors are reported to your Raygun dashboard automatically along with full diagnostic details on how to solve them.

Getting started - It's quick and easy

2

Install the client library

Add this snippet to your markup, before the closing </head> tag:

<script type="text/javascript">
  !function(a,b,c,d,e,f,g,h){a.RaygunObject=e,a[e]=a[e]||function(){
  (a[e].o=a[e].o||[]).push(arguments)},f=b.createElement(c),g=b.getElementsByTagName(c)[0],
  f.async=1,f.src=d,g.parentNode.insertBefore(f,g),h=a.onerror,a.onerror=function(b,c,d,f,g){
  h&&h(b,c,d,f,g),g||(g=new Error(b)),a[e].q=a[e].q||[],a[e].q.push({
  e:g})}}(window,document,"script","//cdn.raygun.io/raygun4js/raygun.min.js","rg4js");
</script>

To catch all exceptions, add the following lines of JS code just before the closing body tag in your site or app.

<script type="text/javascript">
  rg4js('apiKey', 'Your API Key');
  rg4js('enableCrashReporting', true);
</script>

3

Start sending data!

To set up the library to transmit data for the currently logged-in user, add the following lines of JS code inside the end of the script block from the previous step. (optional, but highly recommended):

rg4js('setUser', {
  identifier: 'users_email_address_or_unique_id',
  isAnonymous: false,
  email: 'users_email_address@domain.com',
  firstName: 'Firstname',
  fullName: 'Firstname Lastname'
});

Raygun will start monitoring your application for React errors that are present in your application. Errors are grouped by their root cause and smart notifications alert you to the things that need attention.

Start fixing the React errors and improve your app quality!

Don’t rely on your users to report errors

14 day free trial - no credit card required!

React Error Monitoring Features

Raygun gives you full stacktraces for each and every error occurrence, along with environment information, HTTP requests, raw data, browser, OS, affected users and more. All the details you need to rectify issues quickly and efficiently. Raygun stores every single error event (no data sampling) so you’ll always have the right information at hand when needing to see when, why and how an error occurred.

    • Rather than be bombarded with a flood of messages and error emails, Raygun silently monitors your applications in the background and offers smart alerts for you when need to take action. Notifications are fully customizable, but repeating error instance emails and team chat alerts are sent only when issues are recurring or getting worse, resulting in more signal, and less noise.
    • Raygun allows you to set inbound filters to remove the reporting of errors you don’t care about or cannot fix, meaning you’ll be able to see the problems that are highest priority and affecting the largest amount of users. Choose what you want to monitor with custom setup for dealing with private user details and sensitive information, you can do it all.
    • Source maps are a useful tool for debugging and fixing minified JavaScript code without the hassle of determining where in the original code an error occurred. They provide a way to translate between minified code, designed to decrease webpage load times to the source code the developer writes. Raygun can help you make sense of errors stemming from minified JavaScript and create readable stack traces.

    For many businesses hosting JavaScript files publicly is not in their best interests. For this reason Raygun provides a source map center to handle private Javascript Sourcemaps. This is a private store of JavaScript files to be used in the source mapping process. It allows source mapping to work without hosting anything publicly.

It takes minutes to set Raygun up - seriously

Simply add a short code snippet and deploy your application into production, that’s all you need to start monitoring your application for React errors. Start fixing bugs within minutes!

More about Crash Reporting
Raygun dashboard Play button
Close

Raygun also supports your backend

Don’t rely on your users to report errors

14 day free trial - no credit card required!

Supports all major web and mobile programming languages

View all languages

Integrates with the workflow tools you use everyday

View all integrations

Solve your React errors with Raygun

Forget logs and support tickets. Find the answers you need with greater speed and accuracy.

Raygun JavaScript Error Monitoring

Discover why 40,000+ developers love Raygun

14 day free trial - no credit card required!