How to Get Started with Sentry Error Tracking

2021/04/012 min read
bookmark this
Responsive image

Table of Contents

  1. Introduction
  2. Go to Sentry.io to Register
  3. Run the Page
  4. Conclusion

Introduction

This blog shows how to get started with Sentry.io for tracking JavaScript errors and performance.

Often, once you ship your website, you'll continue to add content and features, which means you'll need to call more APIs to get more data. Then your site may become slower, so you'll add some caching to make requests faster and track the speed of your pages so you know if you have improved or not.

Now, this blog will show how to get started using Sentry.io with JavaScript in a web application. Sentry.io supports the following features:

  • Open-source error tracking system supporting PHP, Node.js, Python, Ruby, C#, Java, Go, React, Angular, Vue, and JavaScript.

  • The pricing starts as free with limited features and can be upgraded to a paid version with more.

Go to Sentry.io to Register

First, go to Sentry.io to create an account and follow the instructions to prepare the JavaScript SDK. The application used in this sample was using Node.js in the backend. The frontend has a TypeScript file called global.ts, and we want to add Sentry.io to the UI's JavaScript code.

import * as Sentry from "@sentry/browser";
import { Integrations } from "@sentry/tracing";

Sentry.init({
    dsn: "{THIS CODE WILL PROVIDE BY SENTRY.IO}",
    integrations: [new Integrations.BrowserTracing()],
    environment: 'local', // default is 'Production'
    // Set tracesSampleRate to 1.0 to capture 100%
    // of transactions for performance monitoring.
    // We recommend adjusting this value in production
    tracesSampleRate: 1.0,
  });

Run the Page

Once you run the page that includes the Sentry.io code, you should start seeing some data in your Sentry.io account. You can modify the environment setting as shown above to separate data by different environments.

Conclusion

That's all you need to get started with Sentry.io. There are many more settings you can configure, but this is the minimal setup required to get started with error tracking and performance monitoring.